Responsive web design
This presentation is the property of its rightful owner.
Sponsored Links
1 / 12

Responsive Web Design Has Become One Of The Hottest Trend PowerPoint PPT Presentation


The purpose of responsive web design is to have one site, but with different elements that respond differently when viewed on devices of different sizes.

Download Presentation

Responsive Web Design Has Become One Of The Hottest Trend

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -

Presentation Transcript


Responsive web design

Responsive Web Design

The Present Of The Web is…


Basic parts in design

Basic Parts In Design

  • Fluid Grids : In this grid, each and every unit resize itself according to screen size.

  • Flexible Images : No need to give specific width. It will scale & move with the flexible grid.

  • CSS Media Queries : It serves stylesheets based on browser window’s size, color, & orientation.

  • Screen resolution : Maintain landscape & portrait widths of different devices.


Fluid grids

Fluid Grids

  • It allow the elements of the layout to resize based on the size of the user’s screen.

  • All elements are designed in terms of proportion instead of traditional layout.

  • All information fits well onto the screen.


Flexible images

Flexible Images

  • Image’s dimensions are flexible, so they can be resized properly.

  • Images on the web page must be sized in flexible units.

  • So they do not go outside of the dedicated viewing area


Media queries

Media Queries

  • Media queries are the coding part of the website which enable the web designer to create the visual look.

  • CSS used to separate the content on a webpage from it actual view in the form of layout, color & fonts.

?


Do you know this

Do You Know This ?

  • Adaptive Design : It has multiple but fixed width layouts.

  • Responsive Web Design : It has multiple, but fluid grid layout (as said in previous slide)


Google recommendation

Google Recommendation

  • As we all know Google is the largest and most usable search engine world wide.

  • So if you want to rank your website on Google SE, then you must follow the webmasters recommendations.

  • They prefer same HTML for all devices and use CSS media queries to render webpage on device.


Consumer s preference

Consumer’s Preference

  • 75% consumer’s prefer to use mobile friendly website.

  • 25% may not use smart phone or may not much aware with this technology upgrade.


Internet users

Internet Users

2016

2016

90%

62%

2009

2009

Desktop Users

Mobile Users


Benefits

Benefits

  • One website is required for all different size devices

  • The overall development cycle is shorter than previous

  • Google prefer this structure to index webpages for its search engine

  • It gives choice to the viewers for device used to access website


Benefits1

Benefits

  • Users like look and aesthetics of a responsive site.

  • Website content loads quickly as there are not hundreds of pages of content.

  • It is easier for Google to crawl and index one URL for every device, rather than two different URLs.


Connect with us

Connect with us

Check out our portfolio on responsive web design & development.

Contact us, if you have any query for app development here : [email protected]

Twitter : twitter.com/aditmicrosysau

Facebook : facebook.com/Adit-Microsys-887908624668076/

LinkedIn : linkedin.com/in/aditmicrosys-australia

Google+ : plus.google.com/+AditmicrosysAu


  • Login