How to avoid responsive web design problemsBy Sabrina*
There are many designers who face lot of problems while creating responsive web design. This article consists of those problems and the solution to those problems along with some suggestions which you must consider for your next project.
Responsive web design problems and how to avoid it:
Explaining Responsive web design to clients: The old process used for designing the website was simple and was easy for the clients to understand. One of the things which the designers find difficult is: How to explain the clients that there is not any visual stage. Responsive web design is a fluid process and sketching and prototyping are stronger tools.
Solution: Tell them about the power of responsive web design: You can easily explain the concept of responsive design to your clients, by showing them what it can do for you. By performing an action it becomes easier for the client to understand. You can easily explain them by giving a demo and showing them how the same site behaves in different platforms. This is simple especially, if you compare it to a non responsive site.
The absence of static design phase: Responsive web design doesn’t involve static designs; therefore it becomes difficult to explain these to clients.
The solution: You can explain this to client by quick sketching, wire framing. In this way, client will easily understand the appearance or the structure of responsive design on various devices.
Images: Due to the advancement in technology, there are many devices which have high pixel density like iPad, and such devices will not be able to open the images clearly which are of low density in your site.
Solution: You must make use of flexible images which can be easily opened on the devices with high pixel density.
Navigation: In the past navigation was tended horizontally on the top of the web page. Navigation needs to be considered seriously now because of the variation in devices.
Solution: Choosing a navigation strategy is a crucial decision and it should be based on the information and the content structure on your website. For instance, the user visiting your site on mobile should have vertical scrolling with the fixed header at the top and that header should be visible while scrolling the site.
Converting fixed width sites: Problem faced by the designers is How to update the code of fixed width site so as to make it responsive.
Solution: You can opt for any of the two options. First solution is that you can rebuild stylesheets and templates. Second option is that you can reverse your existing coding. For smaller sites, it is possible to reverse the coding but on bigger sites it is not possible to reverse the coding, therefore, it is better to rebuild your site.
What to serve to the users of internet explorer (old versions): The older versions of IE doesn’t supports some of the attributes of CSS. This means that if you have created a mobile site for the width of 320 or up, then it will not be opened properly on desktop browsers and will appear much smaller on a big screen.
Solution: If you build mobile-first site, then you have to include some Java script so that the users can easily access your website on old versions of internet explorer. You have to include JS because internet explorer doesn’t support some of the CSS attributes.
Aforesaid are the solutions to some of the common problems that most of the designers are facing while making a responsive web design. These solutions will definitely help you to design an effective responsive website
*Author Bio : I am Sabrina working as a SEO Executive with SEO Rank Smart, SEO Rank Smart is a professional SEO Company based in India. They have best SEO Experts who helps you to increase your sites ranking.
15 June 2013