If you’ve been commissioning a website recently, you may have heard the terms responsive web design or adaptive web design. Here’s our guide to responsive web design for businesses.
What is responsive web design?
Responsive web design is a collection of techniques in website design to tailor your website towards the capabilities of different devices, whether it’s a desktop computer, tablet PC or iPad, or mobile phone.
Below is an example of my personal website (in particular, a page on my web design speaking snippets) when viewed on different device widths. As you can see, the website’s design changes quite significantly to better accommodate whatever screen space is available.
Is a responsive website design right for you?
The first question to ask is: does your website attract visitors on mobile or other handheld devices? If the answer is ‘no’, then there is probably little point in making your website responsive, unless you have firm plans to drive more traffic to your website from mobile and handheld sources.
There are two primary ways to tailor your website to different devices:
- Build an entirely separate website for other devices, e.g. mobile.yourwebsite.com;
- Build one website and tailor its appearance and functioning depending on the device viewing it;
Sometimes, it is more appropriate to build an entirely separate mobile website; this may be more appropriate for ecommerce websites.
Considerations for responsive web design
There are a number of things to take in to account when considering responsive web design:
- Does your website make use of video (perhaps embedded from YouTube)?
- Would images on your website still work as effectively once scaled down?
- Do you have any forms on your website (for example, contact forms)?
If the answer to any of the above is yes, you may find responsive web design requires greater thought from your web designer.
The best results from responsive website design tend to be when the website is built from the ground upwards. Whilst it is possible to introduce responsive elements to an existing website, building for ‘mobile first’ ensures smoother results as the web designer is able to strip back unnecessary clutter and consider the needs of visitors on mobile or handheld devices.
Using an existing website as a base could mean the website is more bloated, and the benefit of speed for visitors on mobile Internet connections is likely to be lost!
Responsive websites in WordPress and Drupal
Many popular content management systems such as WordPress and Drupal have add-ons which can convert your website to be ‘mobile friendly’, but beware these ‘one size fits all’ solutions are rarely suitable long term. WordPress’ default mobile friendly theme is particularly bad in these terms, as it removes many of the elements present on the ‘normal’ website such as Twitter feeds and customised navigation menus.
About the author: Richard Carter
Richard Carter is the Creative Director at Peacock Carter, an established web design agency in Newcastle upon Tyne.
If you would like to work with us to develop a mobile-friendly website, please contact us on 0191 375 5713.