There’s a lot of talk at the moment around Responsive Design. Is this just the latest design fad, or is it going to revolutionise the way people build websites? This blog post looks at some of the pros and cons…
Responsive Design is a way of coding websites with a fluid layout, meaning that the elements of the site adapt based on the size of the screen that is being used to view the site. Instead of creating different versions of a site for different devices responsive design uses style sheets to make the site ‘react’ to whatever screen size it is being viewed on. This means a single URL is used for a site and it is displayed appropriately for the device it is being viewed on; whether it’s a desktop. laptop, tablet, mobile phone or any other device that displays webpages. This includes devices of the future so, in theory, when Apple release yet another differently sized device a responsive site will automatically work on it.
The main advantage of responsive design is that it works seamlessly on any device and any screen size. If the site is well designed then this should lead to improved usability for the site. As mentioned in the previous paragraph responsive design should adapt to new devices fitting the screen irrespective of its dimensions.
The fact that there is only one version of the site makes it easier for users to share your content. If a user shares a mobile version of your website with someone on a desktop the site may look odd to them, this is not the case with responsive design. Having your site exist on one URL, rather than having a separate mobile subdomain, may also help with your SEO. Responsive sites are easy for Googlebot to crawl, as the following statement from Google suggests “We wouldn’t need to crawl a page with the different Googlebot user agents to retrieve and index all the content”.
There can be benefits for website designers too. If a responsive site is built well to begin with then there should be fewer requirements for modifications of the design. If different versions of the site are designed specifically for set screen sizes or certain devices then a new version needs to be built when new devices come out.
With benefits to the user, SEO of the site and site designers responsive design sounds like a perfect way to build your website. However, there are a few drawbacks to building your sites in this way.
While responsive design can save you time in the long run, it will generally require more development time to begin with. There is also a lot of pre-development time required in planning how your page should be displayed across a wide variety of screen sizes and devices. As responsive design is generally more complex than building sites for set sizes there is more room for error and there is a need for a lot of testing to make sure everything is working as it should. Having one design means that any changes you make to the design require a lot more thought on the impact across all devices. It is not easy just to make a small tweak to the desktop version as this may cause problems for people viewing on a mobile.
User experience should always be a consideration when building your site. Users will use different devices in different ways, for example, touchscreen users may benefit from larger navigation than those using a mouse. If your design is device specific then you may be able to use techniques to improve your conversion rate that would be very difficult to implement using responsive design.
Responsive design is also quite easy to get wrong! Just because your site is responsive that doesn’t automatically mean that it will work well for all users. It needs to be carefully planned to ensure that the both user interface, and the content is appropriate for users. Often responsive design can just lead to lots of scrolling on smaller screened devices. Responsive design should not just be about whether a website works in various devices but should also carefully consider the IA of a site, its functionality and the overall user experience. These basics can be overlooked when creating one site to work across all devices.
Still in its infancy, responsive design is a challenge faced by designers that cannot be ignored. There are already a lot of different devices to design for, and there will be many more in the future too. Designing a custom solution for each screen size and device is just not practical. The way forward has to be to design websites that provide a great user experience on all devices, as well as being ‘future proof’ by working on any new devices and advances in technology.
While responsive design has some drawbacks a lot of these can be overcome by careful planning before the development stage begins to ensure that your site not only works across all devices, but that it also provides a great user experience too!
Responsive web design is only the starting point for how sites can adapt to meet the needs of their users. The next stage is responsive or contextual web design, where the users environment is taken into account, as well as screen size, to deliver a truly useful and relevant experience.