Responsive Web Design

What is responsive design and why do I need it?

What is responsive design and why do I need it?

If you or your company are shopping for a new website you have no doubt heard the term “responsive”.  While the concept has been around for many years, the approach has changed dramatically with the improved capabilities of CSS3 and the powerful @media-screen query (more on this later).   When mobile devices started to gain popularity the most common approach was for web developers to create two websites, one for desktop and one for mobile.  While this method was effective it proved to be cumbersome in that there were now two sets of content to maintain and update.  This was particularly time consuming for e-commerce sites that contained large amounts of data.

Without diving into too much technical jargon, let’s look at some numbers regarding device usage vs. desktop.  According to comScore, a cross-platform measurement company, mobile device usage to access the internet actually exceeded that of desktop in mid 2013.  Since then, it has been steadily rising and with the ever expanding mobile device market I would expect this trend to continue. The data collected by comScore shows a steady rise in the number of users accessing the internet since 2007.  At that time, desktop users far exceeded mobile users.  Fast forward 7 years and the change is dramatic with the use of mobile devices surpassing that of desktop users and steadily climbing.

So what do these numbers mean for you and your website?  To put it simply your site is most likely visited more frequently on mobile devices than desktop.  Your focus should be to present a seamless experience for users, not only from a content standpoint but also from a visual as well.  This is the beauty of the media-screen query.  It allows developers such as myself to code your website in a way the recognizes the users screen resolution and adapts the website accordingly.  To drive the point home, take a look at the image below depicting a non-responsive web design as displayed on a mobile phone.

Now let’s have a look at a responsive site we recently developed.  Notice the difference?  One set of content, designed to suit any screen.

responsive web design

Providing your customers with a seamless experience on your site through responsive design has many benefits.  Not only will your site look better, but it also improves your search engine ranking, user retention and overall ease of use.  The implications are clear – if you’re not able to reach your audience through mobile search or display, or you’re not providing a satisfactory mobile experience you will miss out compared to competitors who are.

Interested in upgrading your unresponsive site?  Visit our Web Development page to learn more.