Learn More

What is Responsive Web Design and why do I need my website to be Responsive?

Responsive Web Design

Responsive web design (RWD) is a new web design term coined by Ethan Marcotte that plans around prime viewing and usage on all types of devices so you can have one website that fits and functions on any device from PCs to tablets to smart phones. Specifically, web designers focus on highly functional reading and navigation while minimizing resizing, panning and scrolling. Mashable called 2013 the Year of Responsive Web Design so let’s find out what all the hype is about.

A site designed with RWD uses CSS3 Media Queries to adapt the layout to various viewing environments—along with fluid proportion-based gridsand flexible images:

  • A flexible image is sized in relative units (up to 100%) to ensure that it sizes within the margins of each size version of the site.

  • The fluid grid builds on the liquid layout concept and means that page elements are sized in relative units like percentages and carefully designed for proportions instead of absolute units like pixels or points. This allows the site to adjust its width/layout automatically.

  • Using media queries allows for unique CSS style rules to apply to different types of devices. This ensures the website will fit properly in the width of each browser and pictures/text will appear appropriate to size.

Top 5 reasons for using RWD:

  1. Having one website move across platforms means one URL, providing continuity for your customers and for search engines. It also means that if you share a URL link from your mobile device and it’s opened on a desktop, it will open in the appropriate size instead of a smaller, mobile size.

  2. As technology evolves the number of and types of devices, platforms and browsers that will need to work with your site will only grow. It is smart to invest in a responsive website now as building a different version of your site for each type of device is expensive and impractical.

  3. Your website’s visual appeal and functionality is a key to gaining new customers and increasing profits. A responsive website helps ensure a great user experience on all the devices your customers are using.

  4. If Search Engine Optimization is important to your digital marketing strategy then you will want a responsive website. It is much easier and more cost effective to manage a SEO campaign for one website than two or more. Additionally, Google endorses responsive web design for SEO purposes.

  5. Today’s mobile devices and browsers an getting faster and able to handle larger downloads which means viewers can enjoy pictures from your website on their mobile devices instead of the text only mobile websites of the past.

While a website’s design has always been fluid, often replaced within a few years, the infiltration of online viewing on mobile smart phones and tablets has necessitated rapid change in web designers’ tool kits. When mobile browsing first started, web designers began building two versions of websites; a desktop version and an extra “mobile” version for smart phones. This method proved to be expensive and inefficient and caused a need for the technique of building one website tailored to fit all devices or Responsive Web Design. Be sure to hire a web designer familiar with the intricacies of RWD.

Don't know where you are with your Inbound Marketing?

Topics: SEO, user experience, web design

Tony Sova

Written by Tony Sova

Owner of Softwired, a web design, SEO, and Inbound Marketing firm.