To respond or not to respond, that is the question. As web designers... wait, scratch that. As experience designers... hold on. What are we again? The world as we know it has changed and will continue to change not only on the web but anywhere we’re connected. "By 2014, mobile traffic to websites will exceed desktop traffic" and as artisans crafting digital experiences we too must change as well. But where do we start? How do we start?
It's impossible to ignore the fact that people and businesses are accessing services and information from their mobile devices at an increasing rate. As this mobile web consumption has increased responsive design has been a hot approach allowing content on a site to adapt to the appropriate size and resolution for a particular device. Small, medium, and large screens all show content in a nice legible format and conform to various resolutions. It's all but expected now, but that line of thinking isn't as obvious as it seems.
Responsive design can be a difficult approach for some legacy/agency designer types (*ahem*). For me, the web started back in the days of CD-ROMs. It was the birth of multimedia! (Yes, I’m dating myself here). The web was young and limited. Websites were basic and crude. (Do you remember the </blink> tag?) Netscape had just started breaking the limited online audience out of AOL keyword hell. In other words, the web was not very sexy. And as visual designers we wanted sexy dammit. CD-ROMs allowed us to do things the web couldn’t. Motion, video, animated interactions, and so much more. Sure, we were limited by Microsoft Windows and their 216 color palette but we were doing things we could never do with print. But times were-a-changin’. The technical transition from CD-ROMs to web was a simple one. Those 216 colors were still there for the PC-based masses while a handful of us Mac users were in the realm of thousands and even millions of colors, leaving us to design for that lowest common denominator. And this is where us designers royally screwed ourselves.
We couldn’t think outside of the box. The very box we stared into day after day, night after night. First it was 640x480, then 800x600 and 1024x768, each leap seemingly broadening our horizons. But even then very few things changed. We just had more issues to deal with, more browsers to test on and all those navigation add-ons in the top of the browser making our box small again. We as designers settled on the magic number of 960 pixels. We simply put that as a constraint on everything we did, compounded by additional elements like download speeds, processor speeds and ever changing (often ever sucking) browsers. The canvas we were stuck using to present our work to the world dictated what and how we designed. It dictated how we worked. We were literally incapable of thinking outside the box.
Fast forward a number of years to the present day web. Many of the basics haven't changed, but motion, accessibility, and an ever-growing array of devices have complicated things, rendering our magical 960 pixel guideline useless. Or have they?
<irony> The web was built to be flexible </irony>.
Text and images have always naturally wrapped and have always conformed to whatever way we consumed them. We, the designers are the ones who put the constraints on the web. We’re the ones who couldn’t get beyond these constraints. We collectively couldn’t let go of the print world. We've traditionally always looked at a set dimension and designed within that. Even our tools start us by defining a set space. Even when we were designing with tables, the choice to spec pixels or percentages was there for us. Some of us used this flexible percentage option but most of us kept our box neatly constricted by a pixel size. *sigh*
Over 12 years ago John Allsopp in his article Dao of Web Design said: “The control which designers know in the print medium, and often desire in the web medium, is simply a function of the limitations of the printed page. We should embrace the fact that web doesn’t have the same constraints, and design for this flexibility.”
This flexibility is something we as designers needed to embrace, and we finally are with responsive design techniques, using tools like Style Tiles to solve for these ever changing platforms and for all those varying canvas sizes. And instead of viewing this new paradigm as a hurdle, we need to see this as a benefit for the experiences we're creating.
As designers we need to accept we don’t have control. This is the true nature of the web. The web is everywhere. It exists on large desktop screens at home. Small laptop screens on a plane. On a tablet screen in front of a screaming baby. And on a tiny screen of a smartphone while taking the bus home. Simply shrinking down to a "magical" 960 pixel width is no longer an option. Think of it this way. By 2015, 81% of US cell phone users will have smartphones (Goldman-Sachs, 2011). Is your design going to work for them regardless of resolution, size, and orientation? If that's not food for thought I don't know what is.
Stay flexible my friends.