It seems that we are slowly moving towards an age where responsive web design will become more and more applicable.
After reading an article on http://www.netmagazine.com/tutorials/build-basic-responsive-site-css ,
I have come across useful tips for this type of design. One is to include a wrapper that contains your content, and then to include respond.js to enable media queries for IE 6 to 8.
Use
<meta name="viewport" content="width=device-width, minimumscale=1.0, maximum-scale=1.0" />
Include links to skip to the navigation if it is at the bottom of your page. Always include the important content first and allow for minimum scrolling. It is not recommended to hide certain items, so make sure that all your content is important enough to be included on desktop themes as well.
Set your image width to 100%. Use percentages where applicable. To make sure that the navigation does not reduce the size and link of the text too much, make the link appear one on each line, @media screen and (max-width: 480px) { //content }
The navigation's li could be changed from display:inline to display:block for example..
Responsive web design is very important now a days are most people access to the internet from their smartphone and this ratio is getting higher day by day. Thanks for this informative post of yours and please visit my site at GrafWeb.
ReplyDelete