My Responsive Design Isn’t Responding!

VP of UX & Optimization
Published 4/8/13
Share This Post: 

Share This:

Unless you’ve been holed up in your Mayan apocalypse bunker for the last year, you’ve probably heard something about Responsive Design. Called by many names, and difficult to consistently define, Responsive and/or Adaptive Design are essentially concepts that aim to make the web easier to use on a wide variety of devices. More or less, the goal is to take a single piece of content displayed on a single HTML page and rearrange, reformat and show/hide parts of the content to suit different display sizes.

This is important, because where we used to be dealing with, say, three or four different browsers or operating systems, we’re now dealing with multiple browsers across multiple operating systems across multiple devices with wildly different aspect ratios and resolutions. The number of combinations is staggering and continues to grow on an almost daily basis. This issue alone is enough to make a strong case for Responsive Design on your next web project.

Another big reason has to do with the dramatic increase in cross-device web usage. What that means is that the customers who visit your resort’s website at work on their desktop computer are also visiting your site on their phone while they’re at lunch, and on their tablet when they get home at night. This multi-device approach to interacting with your business is rapidly becoming the standard browsing behavior.

This means you need to be thinking beyond how people interact with your business or brand on a particular device, and think instead about how they interact with you across MULTIPLE devices throughout their decision making process. Your brand, message and user experience need to be consistent and seamless, two things that Responsive Design principles are great at.

The next generation of travel websites needs to extend the concepts of Responsive Design into Responsive Experiences.

Responsive Design also has drawbacks; for starters, it’s several times more complicated to design and build. Let’s say your typical site has four page templates – home, section, sub-section and article. For each of those templates you’ll need to come up with layout solutions for somewhere between four and six different sizes and aspect ratios. And of course it’s not just the user interface work that’s more complicated, it’s also the development – building all those templates and layouts plus keeping the media queries up to date to deliver the right layouts to the right devices.

It’s also somewhat restrictive in terms of design. You have no fixed positioning on the page and you need to have elements that gracefully move from one layout to another. Responsive design increases load time for all types of devices, because the page contains the information to display for any of the devices.

All of this is tolerable, because the other choices are far worse. You can stick your head in the sand and pretend people aren’t browsing your site on anything but a traditional computer; or you can create chaos for yourself by building separate universes of content and code for all the different devices.

There’s one place where Responsive Design really falls short though; while this approach is great at responding to devices, it’s really bad at responding to situations. Responsive Design is a sort of one-size-fits-all approach to content – it’s the same content and the same message, just delivered in a way that’s suited to the device you’re using. It’s not just that your screen is a different size – when you’re on your phone you’re not browsing the same way you are on your laptop; you’re browsing in a very different way with very different needs. You’re in a different situation, not just a different device. You might be in a restaurant, or walking down the street, or in a car on your phone.

The information you’re likely to want in those situations is dramatically different from the information you might want about a resort when you’re sitting at your desk. The same thing is true of tablets, which are starting to show longer session times on average, because you’ll sit in front of the TV and flick through more pages than you might at work in front of your laptop with your boss lurking around behind you, or on your phone on the subway.

Let’s take an easy example of an on-property vs. off-property experience. If you visit my resort website from your couch in Michigan, I can assume you’re at the top of the funnel. You’re looking for somewhere to vacation. I need to get some photos in front of you, and I need to sell you on why my resort is the best place for you to go.

But… imagine that same person is using that same device, but this time they’re in their room at the resort. What now? Do they need to be “sold” on the idea that they should come to the resort? No. Do they need a booking engine? No! What do they need? They probably need to know what’s happening RIGHT NOW on the property. Is there a happy hour? What activities are available? How do I book them? What if there are no towels by the pool? What the heck is the name of that restaurant in the lobby and how do I make a reservation? Stuff like this.

It’s a completely different situation on-property, but it’s the same user, with the same device as before. The next generation of travel websites needs to extend the concepts of Responsive Design into Responsive Experiences. By taking into account whatever other information we can gather – location, browsing history, whether or not you responded to a campaign, retargeting – anything we can get our hands on to try to tune not just the SIZE of the site to your needs, but the content and the user experience to suit your situation.

If we detect that you’re on property we can dramatically change the content we display for you, regardless of the device you’re using. If you’ve responded to an ad campaign we can rearrange the content to match your interests. If you’ve already booked we can hide the booking widget, or emphasize dining and local experiences, and so much more. Responsive shouldn’t be just about devices, it needs to be about providing consistent user experiences tailored to the needs of customers no matter what device, location or situation they’re in.

More about Responsive and Adaptive Design