According to Mashable Inc., 2013 is the year of responsive design. It is a somewhat new concept in web design, and is still evolving and changing, but there are still some fundamentals and facts to familiarize yourself with.
Although responsive design creates websites that are mobile-friendly, referring to it as mobile design would be doing the approach an injustice. Responsive design is a whole web design. That is the main difference between mobile design and responsive design. It creates sites that give users uncomplicated navigation and reading, along with very little browser resizing, scrolling and panning.
Another must-know for web designers is that image quality is more crucial than the number of images. This is because a low quality image doesn’t look good on any size screen. Having minimal load time is also just as important. Scaling images with CSS properties, avoiding full-size images, and modifying them for the internet are all methods to maintain great image quality. The Sony USA website is an example of how sharp image quality and quick load time is maintained no matter that the size of the image is.
When it comes to responsive typography, line length is the most important aspect. Type should depend on the width of the screen. 50-75 characters is typically used for desktop websites, and 35-50 characters should be used for mobile devices. Using fancy or extravagant fonts can look great on big screens, but not so much on smaller screens. Using a normal sans sarif style and even strokes will be the most beneficial type to use. The Hardboiled Web Design website shows all these guidelines being used by having a very easy to read typeface, suitable line length, and it even performs great on mobile devices.
Providing easy and efficient navigation is also a top priority, as it will assure that user experience is as comfortable and uncomplicated as possible. A good responsive design site will have its navigation laid out in different areas depending on the browser’s width. An example of a site that has great navigation is Food Sense’s website.
Responsive design is so much more than just making a website look good and perform efficiently on mobile devices. It’s about providing the finest user experience regardless of what device they are viewing it on.