The Importance of Responsive Web Design

by Melinh Nguyen
November 13, 2013

The pinch and the zoom. This action with our thumb and index fingers can be all-too-familiar if you've ever opened a website on your smart phone or tablet that was not optimized for mobile. The accidental tap. It can be both frustrating and reminiscent of an unpleasant game of hide and seek. According to a 2013 study by eMarketer, roughly 40% of Internet users access it through a mobile device, and it has been shown that Responsive Design websites retain visitors for longer periods of time and provide  sustainable content strategies in the long run.

[ibimage==30498==Original==http://www.devbridge.com/articles/the-importance-of-responsive-web-design/?topic=strategy-technology==self==ibimage_align-center]

Responsive Web Design: Abridged

Responsive web design (RWD) is an approach to web design in which a website is created to provide an optimal viewing experience with minimal resizing, panning, and scrolling across a wide range of devices from desktop computers to tablets to mobile phones.

The best way to see it in action is to load a website on various devices like a phone, a tablet, or a desktop monitor. You can also drag the corner of your web browser window to see how the layout responds to a different size. 

The Benefits

A responsively designed website eliminates the need to build separate mobile and desktop sites. One build for all devices is a long-lasting investment providing you with the assurance that you won’t need to build another version when a new device comes to the market, which inevitably occurs as technology progresses

More than just a cost investment, it also acts as a time saver. Updates on a responsive site are done in one place, which saves the hassle of updating the content on different platforms. Just set it and forget it.

But, most importantly, visitors reading content will receive the same experience on any device. Regardless of the size dimensions of the screens, information will be easy to find and easy to read. This is exactly what a website provides and what RWD does to enhance and optimize the user’s visit. 

Adapting to a RWD Workflow

Unfortunately with RWD, there is no one-size-fits-all process for creating a website.  Companies must consider the limitations that each device brings to us. With more and more powerful, and faster devices like the iPhone 5S are introduced, we use progressive enhancement to make sure we are delivering the functionality of the website on smaller devices without relying on too many process heavy features that detract from the experience. This method ensures that we are adding features, pictures, and animations that take into account the slowest performing device on the market to ensure that the same experience is delivered throughout any device.

In addition, we find it best to start with building out the content on the mobile device first. It helps make sure your core functionality and message stay consistent. In addition, it causes the designer to focus on the content and functionality rather than the UI.  Having that drafted also quickens the process as fewer changes need to be made in the long-run as it helps create more accurate designs.

Next, when sketching out the general framework of the website, there are a few different tools available. UI template pads act as stencils so we can see the layout physically. In addition, we also use paper prototyping where we cut out paper models with repositionable elements of a web or mobile site. We’ve learned that its portability and accessibility makes the sketching process efficient.

To read more about our RWD Workflow, check out the rest of the blog post on Devbridge's website

Jobs at Devbridge Group10 open jobs
All Jobs
Design + UX
HR
Product
Sales
Product
new
Devbridge Group
Chicago
Product
new
Devbridge Group
Chicago
Design + UX
new
Devbridge Group
Chicago
Sales
new
Devbridge Group
Chicago
Design + UX
new
Devbridge Group
Chicago
HR
new
Devbridge Group
Chicago
HR
new
Devbridge Group
Chicago
Product
new
Devbridge Group
Chicago
Product
new
Devbridge Group
Chicago
Design + UX
new
Devbridge Group
Chicago

Chicago startup guides

LOCAL GUIDE
Best Companies to Work for in Chicago
LOCAL GUIDE
Best Software Engineer Jobs in Chicago
LOCAL GUIDE
Coolest Offices in Chicago Tech
LOCAL GUIDE
Best Sales Jobs in Chicago
LOCAL GUIDE
Best Perks at Chicago Tech Companies
LOCAL GUIDE
Your Guide to Healthtech in Chicago
LOCAL GUIDE
Best Data Science & Data Analyst Jobs in Chicago
LOCAL GUIDE
Best Marketing Jobs in Chicago