Minimize text size Reset text to normal size Increase text size

One Site Fits All: A Responsive Solution

With 56% of American adults owning a smartphone and 34% owning a tablet External Link Disclosure and with 1.2 billion devices projected to be sold in 2013 External Link Disclosure, smartphone and tablet access continues to skyrocket. Users are increasingly accessing online information through a multitude of devices that are of all shapes and sizes. This means that your content needs to be able to be accessed conveniently and provide a positive experience – regardless of the device used.

Attempting to create and maintain multiple versions of your site to accommodate each device can be time consuming, resource intensive, and unsustainable as a long-term solution. So how do you give people a comparable user experience regardless of the device they use to access your site? The solution lies in responsive design.

Responsive Design: the Effective Solution

Although including responsive design as part of your user-centered requirements may require additional resources and an increased timeline, choosing to take a responsive approach to serve the growing number of devices on the market is often the most effective path to take without requiring you to create a new site design to accommodate every device on the market. It allows you to build a single version of your site that adapts to the device accessing it. In other words, whether they view your site on a smartphone, tablet, laptop or desktop computer, they access the same content, formatted for their device. The end result is a more seamless user experience. built in responsive design

Another large benefit is the savings. When planning a web site, budgeting for resources, costs, time and scalability are all major factors. For example, the time and resources needed to a create mobile, tablet and desktop versions of a site is nearly three times the effort needed to create a single responsive site. When you consider what it would cost to update the three versions of a site as compared to a single version the savings is what we call in the trade a "no brainer."

Building a Responsive Site

Ethan Marcotte notes that there are three key components to responsive web design External Link Disclosure:

  • Flexible grids
  • Flexible images
  • Media queries built in responsive design

When we design a site for desktop computer or a specific device, we use fixed, pixel-based dimensions. With a traditional or “unresponsive” web design, the layout and content need to be recreated and adjusted manually for other devices.

However, with responsive web design, the content and layout become fluid, adjusting naturally to the dimensions of the device accessing the site. Responsive web design does not change the content of a site, but rather the presentation of the content. So does your entire site become miniaturized to fit on a smartphone? No, that would simply make the user frustrated. Instead, the content is resized to fit the format of the device. Through the use of a media query, the pixel width of the browser the device is using is determined and content responsively changes its layout to accommodate that device. Images and text are resized to fit and read clearly. Making the site content fluid to respond to the device makes it easier to scan, navigate and use. built in responsive design

Responsive web design improves content accessibility, provides a more consistent user experience across devices and saves money. No site is forever and we will always be refining the user experience, but a responsive approach allows you more flexibility moving forward.

So, what have your successes been in trying to implement a responsive strategy? Your challenges? We want to hear about your experiences below.


I like the valuable info you provide in your articles. I will bookmark your blog and check again here regularly. I am quite certain I'll learn a lot of new stuff right here! Best of luck for the next!
you may have an important weblog here! would you prefer to make some invite posts on my blog?
Nice post on "Responsive Design". Really appreciated. An attractive website is always capable of attracting a greater number of people towards it, and this is inclusive of designing and developing, at the same time.
I think you have remarked some very interesting points , appreciate it for the post.
Thank you, I have just been searching for info about this subject for a long time and yours is the greatest I've found out so far. However, what about the bottom line?
Great blog! I am loving it!! Will come back again. I am taking your feeds also
I'm really enjoying the themedesign of your website. Do you ever run into any internet browser compatibility issues? A handful of my blog audience have complained about my site not operating correctly in Explorer but looks great in Firefox. Do you have any solutions to help fix this problem?
Hi my friend! I want to say that this post is amazing, great written and include almost all significant infos. I'd like to see more posts like this.
Responsive web design are used for easy interaction with visitors on mobile and desktop.
nice blog | it will help many designers to once review their site improving a user experience and make your web design more responsive.


Post new comment

By submitting this form, you accept the Mollom privacy policy.