For those that are uncertain, I wanted to take a few minutes to describe what is meant by responsive web design and what the business benefits are to you.
Going back 5 years, very few people used their mobile phones to access the internet and tablets were in their infancy, so web sites were viewed on laptop or desktop screens. Because of this, web sites tended to be a fixed width such that they would fit comfortably within the most common screen sizes.
Problems
With the development of mobile and tablet technology and the increased speed of mobile networks, it was natural that people wanted access to web sites from these new devices. There were 2 problems:
- the web sites took a long time to download and
- the web sites were practically unusable because the text was too small to read and links were too close together because the sites had not been designed for use on smaller screens.
As an example of problem 2, take a look at this site…
The entire width of the web page (which was intended for a much larger screen) has been squeezed into the width of a mobile phone screen. As you can appreciate, the text is too small to read and it would easy to make a mistake when clicking on a link.
Of course, you can zoom in on a smartphone or tablet and so increase the size of the text so that it is readable. However, what often happens then is that some of the text falls off the side of the screen so you are forced to pan right and left to read a full line. Clearly, this is not at all satisfactory.
Solutions - Responsive Web Design
The challenge for web designers and developers is to produce web sites that look good, are readable and usable on any size screen. This means that the layout of the components of the page has to adapt itself to the screen width. This is what is meant by responsive web design.
The web sites we design and develop here at AttractMore Web Design are responsive as you can see in the images below.
As you will see, the layout on a desktop screen and a laptop has 2 columns, whereas on a tablet and a mobile a single column holds all the content. The information contained in the right hand column shown on the wider screens is displaced below the main content on tablets and mobiles. The text remains readable at all screen sizes, links and buttons are big enough so you can click them without hitting an adjacent link or button in error.
Business Benefits
If your web site is unreadable or unusable on a tablet or mobile smartphone you are likely to be losing business - people will not tolerate sites that they have to struggle to use. According to a survey by Techcrunch, 2013 will be the year in which more people use mobiles than desktops/laptops for accessing the internet. It is essential that your site can be used by people whatever type of device they happen to be using otherwise you are reducing your audience. So if you want a web site that looks good and works well on devices of all shapes and sizes, please get in touch - we can help.
If you have any views about responsive web design, please feel free to comment below.