What is Responsive Website Design?


Responsive web design is the concept that a website should respond to user behaviour, and should scale to fit to their device depending on the platform, screen layout, and screen size it is being viewed on. This contrasts significantly with the standard fixed width approach to be found on many websites, where the size is always the same and must be either scrolled or zoomed to be viewed on many devices.

This approach has become much more relevant in recent years, with more and more users viewing websites on mobile phones, tablets, and other devices with non-standard resolutions and screen sizes.

Read about our Mobile Website Service Here

Example 1: standard monitor screen

This first example shows a website at a standard width as viewed on a large screen. Normally a site of fixed width would need to be zoomed in on smaller screens to be able to view all of the content. However, this website uses responsive design, so we can now see what happens when the site is viewed on a smaller screen such as a tablet:

Example 2: tablet screen

At this screen size, the logo has been reduced in size, and the images both at the top and in the middle section have dynamically been reduced to fit within the new screen width. The text has also wrapped around automatically to fit. Notice that the structure of the page remains the same. Next we can see how the site would behave on the mobile phone.

Example 3: mobile phone

Here we can see that the layout has changed significantly to display correctly on a mobile phone. A phone number is placed prominently at the top, and the page navigation is now placed within a dropdown menu, which can be tapped to show the full menu. Additionally, the images in the main content area are now not loaded, to speed up on display time

How can responsive design benefit your business?
As more potential customers may be viewing your website on a mobile phone, it is important to consider whether you are showing the right content to these users, and that they can easily access the information they need. Customers visiting a website on a mobile phone may be more concerned with quickly getting the most relevant information, such as a phone number or address, rather than having to browse through large images or other content that would be more suited on larger screens. Responsive design can help to display only those site elements that suit the users chosen platform, and to speed up access of the site for mobiles by not loading unnecessary elements

Realistically, as a website owner, you only have a few seconds to catch users when they first visit a site, and if they are turned away by a hard to navigate interface in those crucial moments then their custom may be lost. With mobile phones and tablets increasingly being used to view websites over traditional computers, having a responsively designed website could make a huge difference in the number of users that both stay and return to your website.

Mobile Usage Statistics
In the last 2 years, mobile phone use for web browsing in the UK has increased by over 100% compared to desktops, and mobile internet use has more than doubled world wide in just the last year. People are often browsing websites on a mobile phone or tablet in lounge or kitchen areas rather than at a desk on a computer, and tablets are increasingly taking a large portion of the share of website use from traditional desktops and laptops. It is predicted that mobile internet usage will overtake desktop internet use by 2015

Users are now highly likely to be viewing your website on a non-standard device – for example, 30% of tourists visiting an area will use their mobile to research what to do there – so it is becoming prudent to consider the implications for how you present your information to this audience and how it can be improved to maximise customer satisfaction

How We Can Help
InSynch can offer fully responsive websites that can be tailored to your needs.

For more information on pricing, or to request a responsive website design for your business, please contact us.