An Introduction to Responsive Websites

Chandra's picture

A website used to be something that you viewed on your computer, at your desk. This simply isn't the case anymore.  With the rapidly growing popularity of mobile devices such as smartphones and tablets, websites are being viewed on a huge range of screen sizes, by users on the go.

Unfortunately many websites have been (and are still being) designed for the large screens provided by desktop and laptop computers.  They don't play nicely with smaller screen sizes. This results in mobile users having to zoom in to view content. Then zoom out again to find the next bit of content they are interested in. They may even have long scrolls left and right just to see the menu.  The menus themselves become unwieldy and the whole experience is highly unsatisfactory.

A responsive website detects the screen size of the user's device and automatically rearranges itself to fit that screen. That doesn't mean it shrinks to fit the screen. It actually resizes elements and rearranges the page layout to give the user easy access to site content.

Image of People Using Computers Courtesy of clemens.loecker

Responsive in Action!

Browsing on a desktop? Resize your browser's width.

Browsing on a tablet or phone? Flip from portrait to landscape.

The Importance of Having a Responsive Website

A major key to making the web work for you (growing your business on the web) is to remove as many barriers as possible to your prospective client connecting with you. If your website doesn't work very well on their preferred device, but your competitor's does, you may well find that prospect walks away.

You want your users to get to what they are looking for a fast and as easily as possible.  You will have goals for your site, such as making sales, or receiving contact. You want to ensure your users are able to complete these goals with ease.

Have a look at your website statistics and see what sort of devices your visitors are using. This will be easy if you have a product such as Google Analytics installed (if you're one of our clients you can find this in your monthly Analytics reports under the "Visits and Pageviews by Mobile" section).  You will see that visits from mobile devices have been increasing. Current projections indicate that the global penetration of mobile Internet users will exceed that of PC-based Internet users between 2014 and 2016.  If your site is not responsive you will be disappointing over 50% of your users in the very near future.

Experience Responsive Web Design

The best way to understand responsive websites is to see some in action. In order to see how they work you can either view the same site across a range of devices (your laptop, your iPad, your smartphone), or simply view them on a desktop and resize your browser window. Resizing a browser window gives you the advantage of actually seeing the site being reorganised on the fly as it responds to the changing space it has available. If you use a mobile device make sure that you flip from portrait to landscape modes to see the resulting behaviour.

Here are some good sites for you to check out.

Take The Next Step

If you want to find out more about the benefits a responsive website will have for your organisation, get in touch.  We're passionate about enabling businesses to succeed on the web and we are always happy to have a chat.

Share This:

Tag(s):