Home arrow Design Usability arrow Responsive Web Design: More Than Just a Buzz Word
DESIGN USABILITY

Responsive Web Design: More Than Just a Buzz Word


Perceptive website developers not only know what responsive web design is; they've already put it into practice. Thanks to a number of trends among web users, the need for websites built along responsive web design principles will certainly continue to grow. If you're not tuned in to this change in the field just yet, keep reading to find out why you need to get on board, or risk getting left behind.

Author Info:
By: Terri Wells
Rating: 5 stars5 stars5 stars5 stars5 stars / 2
December 14, 2012

print this article
SEARCH DEVARTICLES

Perceptive website developers not only know what responsive web design is; they've already put it into practice. Thanks to a number of trends among web users, the need for websites built along responsive web design principles will certainly continue to grow. If you're not tuned in to this change in the field just yet, keep reading to find out why you need to get on board, or risk getting left behind.

So let's start by defining our terms. What, exactly, is “responsive web design”? To put it simply, responsive web design involves building a website that looks great regardless of the device on which it's viewed. As Mashable explains, such a design “uses 'media queries' to figure out what resolution of device it's being served on. Flexible images and fluid grid then size correctly to fit the screen.” Elements of the design itself might even change to keep the important items from getting lost. The idea behind this is to make your visitors happy when they check out your website, whether it's from a desktop browser or the small screen of their smartphone.

How does this work in practice? Mashable recently redesigned its website along responsive web design principles. In introducing this new design to its readers, it described what would happen if someone viewing the site on a desktop made their browser window smaller. “The images and content column will shrink, then the sidebar will disappear altogether. On our homepage, you'll see the layout shrink from three columns, to two columns, to a singular column of content.” The changes as the browser shrinks in size give you some idea of how different devices will display the content of a website built along responsive web design principles.

So why does this matter to you and your company? This year, regular PC sales declined for the first time since 2001. While it would be irresponsible of me not to point out that this change may be partially due to the sluggish economy (2001 was also an economically down year), this time, there's more at work to indicate a lasting change. Consider this: many consumers are purchasing tablets now. They're catching on so well, in fact, that by next year we may see at least as many tablets sold as notebooks. And despite their excellent resolution, tablets often boast smaller screens than desktop or even notebook computers.

Another point to consider is that the majority of mobile phone subscribers in the US, according to Nielsen, own smartphones now. That means that these subscribers can, at least in theory, connect to the Internet and browse your website on that relatively tiny screen.

But don't take my word for it. There are tools that exist that can tell you how much of your traffic is visiting your website from mobile devices. Check those numbers; you're liable to find out that a large percentage of your potential customers are browsing from their iPhones, tablets, or other mobile devices. You need to use responsive web design on your site so that they don't associate your company with pain and frustration.

Remember, for many people these days, your website is the first contact they have with your organization – and first impressions are hard to shake. I'm sure you can imagine what will happen if a mobile visitor to your website gets a bad experience; they won't be back, and they might tell their friends that your website sucks. That's the last thing you need!

Another hassle you don't need is trying to build tons of applications for all of the different devices that access your website. That might work...if you could cover every device and app store. It's not simple. Mashable noted that in just one month, it was accessed on more than 2,500 different devices. With responsive web design, “You build a website once, and it works seamlessly across thousands of different screens,” the publisher explained.

Indeed, if you're a publisher, you can't afford to NOT consider using responsive web design. Mashable pointed out these impossible-to-ignore benefits: “For publishers, it offers the simplest way to reach readers across multiple devices. For users, it ensures a great experience on every screen.”

Are you considering responsive web design for your next project? Or if you're already using it, how well is it working out for you? Feel free to share your experience in the comments.


DISCLAIMER: The content provided in this article is not warranted or guaranteed by Developer Shed, Inc. The content provided is intended for entertainment and/or educational purposes in order to introduce to the reader key ideas, concepts, and/or product reviews. As such it is incumbent upon the reader to employ real-world tactics for security and implementation of best practices. We are not liable for any negative consequences that may result from implementing any information covered in our articles or tutorials. If this is a hardware review, it is not recommended to open and/or modify your hardware.

All Design Usability Tutorials
More By Terri Wells


blog comments powered by Disqus
DESIGN USABILITY ARTICLES

- Responsive Web Design: More Than Just a Buzz...
- Add New Website Features to Please Users
- Gzip Components in Action
- Configuring Gzip Components
- Gzip Components
- Create Great JavaScript and CSS Menus Simply
- Design Principles that Shape a Web Site
- Creating Aqua Style Images
- Easy as A,B,C – dynamic A to Z indexes
- EasyChart: a Usability Teaching Tool to Demo...
- Building Friendly Pop-up Windows
- Back to School: Design Usability
- Using HTML_QuickForm To Manage Web Forms, Pa...
- Using HTML_QuickForm To Manage Web Forms, Pa...
- More Website Knick Knack

Watch our Tech Videos 
Dev Articles Forums 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Write For Us 
Weekly Newsletter
 
Developer Updates  
Free Website Content 
Contact Us 
Site Map 
Privacy Policy 
Support 

Developer Shed Affiliates

 




© 2003-2014 by Developer Shed. All rights reserved. DS Cluster - Follow our Sitemap
Popular Web Development Topics
All Web Development Tutorials