Responsive Web Design

People are increasingly making use of their mobile terminals (tablet and smartphones) to connect to the internet and it is important to adapt websites to the new browsing habits. Each terminal has its own features and limitations (such as the screen size) which will determine how a website will be displayed. The Responsive Design is a compelling solution if you want to have your website smoothly displayed on multiple screen sizes.

Responsive web design (RWD), is an important evolution in an increasingly on-demand world. RWD is a design approach that lets you view content in a way that is optimized for the screen size that you are viewing it on. For example, if I access a RWD website on my laptop, I will see the content formatted in a way that is optimal for a larger screen. And if I access that same website on my smart phone, I will see the same content reformatted to fit that screen size. The important thing about this is that it is showing me the same content whether it is on a large screen or small screen, only the layout is different.

It wasn’t long ago that the prevailing practice, when considering how to make your website mobile friendly, was to create a separate website for mobile devices along with separate content. The content would be pulled from the existing site and edited down for brevity with some sections being omitted entirely. All of this was based on the assumption that visitors to the mobile site would only want certain kinds of information and not others. Specifically information that would be consumed while “on the go,” and therefore needed to be short, to the point, and informative. Anything less, wouldn’t make it into the mobile site. The implications are that some of the content on the non-mobile site may be potentially long, pointless, and ultimately not very valuable.

One interesting aspect of responsive website design is that it forces us to think about the value of content. If it’s going to be shared across all devices, then anything other than short, to the point, and informative, doesn’t make the cut.  This is a great filter because it helps us focus on the purpose of the information.

Does this mean you should convert your website to a Responsive design? Let’s consider the Advantages of Responsive web design:

• The advantages of Responsive Design are numerous. This technique allows a website to automatically adapt itself to the different screen resolutions.
• Columns and images are automatically adjusted, resized and moved automatically according to the screen resolution. This technique allows optimum ergonomics in preserving the layout and the display of the information from the website.
• The Responsive Design is a strategic long-term solution and you don’t have to worry about redirecting users to another version of your website. Once deployed, there is very little maintenance to perform and the cost of development could be often lower than creating and maintaining a dedicated mobile site.
• Responsive Design also implies having a unique URL: perfect for promotional campaigns.

There are certainly some Disadvantages to Responsive web design so I thought I would list these along with pros for RWD:

• If there are many benefits, there are still some drawbacks to Responsive Design. These include a longer loading time. Most of the time, users (browsers) are obliged to download useless a HTML/CSS codes. Similarly, the images are often stretched and not simply resized causing a negative impact on the loading time.
• Responsive Design won’t allow you to easily adjust the titles, descriptions and other content on mobile phones. In addition, the development of Responsive Design websites takes more time.
• The Initial Cost. It is obviously takes longer to code and test a website that is to work on a wide variety of screen sizes and devices so the initial cost of having a website designed is usually could be higher than having a non responsive site designed.

The Responsive Design is definitely an effective solution to provide an optimal user experience. This is a major evolution of web design inviting designers to take a new challenge. Disadvantages and limitations of using this technique are easily overcome by putting more emphasis on the design and development stages of your website. But still I have added the advantages and disadvantages above so that people can make their own mind up about the responsive approach, whether you might be an individual looking for a new web site or a designer considering the expansion of your own design services, it is always nice to know the pros and cons of any concept.

What are your thoughts on Responsive web design?