Over the past few years I’ve watched responsive design gain traction, moving from the vanguard to the mainstream of web design. Let’s think about this. A technical approach to making websites, nerd stuff, is now something clients are asking for specifically. Mainstream media organizations are talking about it as a major selling point of their websites.
It’s easy for people to get behind responsive design because its results are easy to see. It has that magical ability to transform a website before your very eyes. On the surface, it appears to answer one of the web’s most pressing questions – namely, how can we cater to a rapidly expanding ecosystem of devices? This ecosystem is going to be broader than we can imagine. Responsive is not the answer. But it is part of a bigger solution.
Responsive design is the tip of the iceberg
I think that responsive design has a place in any web project, and that it can make any site or app more robust and flexible, but it needs to be done on a deeper level and as part of a broader approach. Functionality needs to be just as flexible as layout. Sadly, the vast majority of sites using responsive design don’t think much farther than looks. They use impressive layout tricks, but a smartphone on a 3G network has to download just as much code and large images as a desktop computer. Many organizations boasting about their shiny new responsive websites haven’t looked at the actual user experience across different devices. What about how it works? Example: Sportsnet recently put out a press release about how their new website is the first to go responsive in Canadian sports. The statement boasts about how state of the art it is, so I went to it on my iPhone to kick the tires. It was barely useable. What’s the point of a responsive site if it’s a nightmare to use on anything but a desktop?
Responsive design in a user experience context
Let’s look at what people actually expect from a site:
- If someone is on a mobile device, they want an experience that is as useful as the one they’d enjoy on a desktop computer
- And they want it to load just as fast
- If someone has a brand new tablet that’s a slightly different size and shape from the last model, they still want your site to work on it properly
- If someone is using a device with fewer features (and that can mean something very old or very new), they want the same information and a pleasant user experience for that context
If these issues aren’t addressed, your visitors will leave and that lovely stretchy layout will go to waste.
Responsive, meet Adaptive
Adaptive design is a term used to describe the larger approach of making websites as flexible as they look. It takes responsive design and expands the scope to functionality, looking at issues like:
- Ensuring fast performance on different devices, because performance is a design feature, you know!
- Organizing content so that visitors can access all the information they need, no matter what device they’re using
- Not pandering to specific devices. That new device that takes the world by storm in six months doesn’t have to mess everything up if we design experiences for the web, instead of for specific devices
These factors determine whether or not people will use your site. If we build sites with them in mind, we’ll find not only that more people benefit from them now, but also that they stand up better as the web inevitably changes. The business benefits of responsive design are already understood, imagine the results if websites took a fuller approach to deliver a better user experience to everyone.
For a more in depth look at this subject, take a look at Beyond Squishy, a talk by Brad Frost.