What is a Responsive Design?

As more and more people are using smartphones to browse the web, having a website that shines across all platforms has become crucial. You don’t want the viewers of your site to be frustrated with writing that is difficult to read, and constantly having to zoom in and out to view photos and content. If your site has a storefront, viewers should be able to browse the store while relaxing at home or riding the bus.

If your site is informational, viewers should be able to find the same information easily whether they are on a desktop computer or accessing the site on their smartphone. According to research published by the analytics company comScore, as of June 2014 viewers were spending 60% of media time on a mobile device and only 40% on a desktop device. Over the past few years, that number has only grown.

In the past, the solution to this dilemma was to create two entirely different websites – one for desktop, and one for mobile, and detect whether the viewer was on a desktop or mobile device and send them to the appropriate site.  This solution, referred to as a “mobile-only” approach, is not ideal for several reasons. Having two different websites requires maintaining both sites simultaneously and making sure the same content is on each site.

It is common for these mobile sites to have less content and functionality than their desktop counterpart, which can be frustrating for viewers and send them looking for another resource. Another big concern with this is the appearance of the mobile site- with the growth of the smartphone and tablet industry, manufacturers are creating devices with varying screen sizes, making it difficult to create one mobile site that looks good on all of them.

Currently, the most ideal solution is to build a website that is considered to be “responsive”. Responsive sites are designed and built using flexible, fluid grid systems. These systems resize website elements based on proportions and percentages. This means that responsive website can adapt to any screen size.
Need to update your website? Let us help you!
Responsive sites also use media queries. Media queries tell the site what features to change based on the current screen size. For example, on a desktop you can have an image next to a block of text, but when the screen size gets smaller- say to tablet size, the text will drop to be below the image. Each element goes from 50% wide at desktop size to 100% wide at that designated breakpoint.

Responsive design allows the same site to be viewed across multiple platforms, making it the most convenient option when it comes to editing and updating the site – you don’t need to make the changes to two different sites. It also tends to have the friendliest appearance because the elements respond fluidly to the screen size, so there is no concern about viewers using different sized tablets and smartphones.

Responsive design not only helps your website be more user friendly, it also impacts your marketing and SEO efforts. In March of 2015, Google announced an algorithm update that improves ranking for mobile-friendly sites on its mobile search results. The reason for this update was to improve search results for mobile viewers. In October of 2015, Google’s senior vice president of search Amit Singhal stated that more than half of all Google searches happen on mobile devices, making mobile friendly sites even more desirable.

Questions about the mobile friendliness of your site, and want to make the most of responsive design? Contact an Account Manager today.