Approaching Responsive Design Responsibly

Image of a laptop, tablet and smartphone showing the same contentOne thing is certain about the Web – change is imminent and constant. As Web strategists, writers, designers, and developers, we’re used to this reality. That’s why when the Web throws yet another curveball, we’re prepared to react. The latest curveball has come with a shift in how people interact with online content – their migration to mobile devices.

Back in 2009, Morgan Stanley published a 424-page diatribe titled, The Mobile Internet Report, which declared, “More users may connect to the Internet via mobile devices than desktop PCs within five years.” Smart people, those Morgan Stanley folks. Midway through 2012, we’ve already seen an explosion in the adoption of mobile devices.

Studies indicate that some users are leaving their desktop machines for a mobile device and not turning back. For those users, it appears their mobile device may be the only computer they need. Other users strike a balance between their mobile and desktop devices.

As designers, we have been watching this trend for several years, and it’s clear we’re no longer designing for one on-screen experience. Instead we have to be responsive to the needs of all users, across all devices, ranging from extra-large to small – from vertical to horizontal. And websites need to adapt to these varying screen resolutions, aspect ratios and user inputs.

The uncontrollable nature of mobile computing has challenges that go along with it. Imagine you are a painter. You take many things into consideration as you approach your latest work – design principles and elements. Color. Emphasis. Contrast. Line. And perhaps most important, composition.

Now imagine cutting your new work into pieces and issuing those pieces to your fans allowing them to be reassembled in any way they see fit. One of your fans wants a horizontal piece to hang over a mantle. Another wants a vertical piece to place next to a doorway. You get the idea. Designing a site so it can be “cut apart” and reassembled in a number of ways is how we’re reacting to the shift in mobile usage. It’s called responsive design.

With media queries embedded in CSS, we can alter the placement of images. We can introduce new, alternate layouts tuned to each resolution range. And we can fine tune navigation so it’s more prominent in a widescreen view, or reposition it above a logo on smaller displays.

We can also fine-tune elements to create a more optimized user experience regardless of the device type. We can increase the target area on links for smaller screens. We can selectively show or hide elements that might enhance page navigation. We can even practice responsive typesetting – stripping down gorgeous fonts in favor of system defaults to minimize the amount of data needed to display the site properly – saving users valuable kilobytes in a world where wireless data plans are ever-increasing in price.

Geonetric is fully immersed in responsive design solutions. And we discuss this in further detail during our webinar, Everything You Know About Mobile is Wrong.

Plusone Twitter Facebook Email Stumbleupon Pinterest Linkedin Digg Delicious Reddit
This entry was posted in Design, Mobile by Bill Basler. Bookmark the permalink.

About Bill Basler

Named Ad Person of the Year. Adjunct professor of graphic design. President of an advertising agency. Yeah, Bill has a pretty impressive background. But what’s even more impressive is his ability to consistently deliver outstanding creative. His team wins awards for design and usability, but more importantly they know how to “wow” our clients with both eye-catching design and jaw-dropping results. Bill has spent the last 25 years on the agency side, first as a senior art director and then an associate creative director for two regional firms, and most recently as president of his own design agency. He is also an active member of the Advertising Federation of Cedar Rapids and an adjunct professor of graphic design at Mount Mercy University. Bill holds a bachelor’s degree in graphic design from Iowa State University and while he cut his teeth on designing award-winning print campaigns, he is equally comfortable designing across platforms including Web, social media and video. This father of six is married to a radio D.J., likes antiques boats and is the only one at Geonetric that insists on using a Mac.

Leave a Reply

Your email address will not be published. Required fields are marked *


+ seven = 9

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>