responsive web design has become one of the hottest trend
TRANSCRIPT
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
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
Images on the web
page must be sized in
flexible units.
So they do not go
outside of the
dedicated viewing
area
Image’s
dimensions
are flexible,
so they can
be resized
properly.
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 ?
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
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
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
2016
2009
Desktop Users Mobile Users
2016
2009
90%
62%
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
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
Check out our portfolio on responsive web design &
development.
Contact us, if you have any query for app development here
Twitter : twitter.com/aditmicrosysau
Facebook : facebook.com/Adit-Microsys-887908624668076/
LinkedIn : linkedin.com/in/aditmicrosys-australia
Google+ : plus.google.com/+AditmicrosysAu