Responsive Web Design: It’s a Must-Have, and Our Sites Are Always Repsonsive!

In a recent algorithm change, Google has has begun to use “mobile-friendliness” as a ranking metric. This means that non-responsive sites are likely to see a drop in where they rank.  What’s all this “responsive” talk about?  Read on.

An important change in website design has been going on for about the last 18 months.  Referred to as ‘Responsive Web Design’, it’s a website design approach that keeps an eye toward providing an optimal viewing experience across a range of devices ranging from desktop browsers to tablets to smartphones.  More specifically, it concerns itself with easy reading, image resizing, and maintaining intuitive navigation across those devices.

Perhaps Jeffrey Veen, author of the book, The Art and Science of Web Design said it best, “Day by day, the number of devices, platforms, and browsers that need to work with your site grows.   Responsive web design represents a fundamental shift in how we’ll build websites for the decade to come.”

As businesses, we’re very aware that changing technologies impact how we present our work on the internet for potential clients to view.  Just a few years ago, many of us used Flash to present impressive interfaces and utilize a degree of interactivity to our websites.  When Apple decided not to embrace Flash on the iPhone and iPad, we were left scrambling to redesign our sites to eliminate Flash entirely or create “mirror HTML sites” that simply were a Band-Aid and presented our work less than ideally.

All of that worked fairly well; that is until viewers tired of squinting to view tiny text and tiny images on tiny screens.  Enter Responsive Web Design (RWD).  With RWD, the viewer’s experience is enhanced because text and images are resized specifically for the device on which  your site is viewed.

If you are not utilizing RWD, the next time your site is revamped, ask your web designer (hopefully us!) to fully embrace the technology.  If you are doing it yourself, an excellent resource is Ethan Marcotte’s book, Responsive Web Design, available at http://www.abookapart.com/products/responsive-web-design.

Below are two examples of RWD.  The first is Target’s corporate site, the second is my own SEO company’s site, go-seo.com.  The images show how the sites look, from left, on a desktop browser, on a tablet, and last, on a smartphone.  Note that the images resize and the text re-flows depending on the device.

You can see the difference, especially when comparing the desktop browser version of the site to the  smartphone version.  Without responsive design, the full desktop browser version would be “squished” down to 320 pixels in width on most smartphones, 640 pixels on the iPhone. Responsive design affords your visitors (potential customers!) a much better browsing experience because they aren’t forced to constantly be zooming in and out to read your site’s contents.

A responsive site must meet these three criteria:

• Respond to the size of the screen on which it is being viewed so that the viewer does not have to scroll horizontally to see full sentences or full images;
• Have links (touch targets) that are placed far apart so that they are easy to tap without having to zoom the content in order to not hit two targets at one time; and finally,
• Uses text sizes that are easy to read without one having to zoom on the screen.

Little things all add up in making your marketing effective, responsive web design will help you to look your best!  Ask us how we can help!