If you haven’t heard much about “Responsive Web Design” yet, you should get reading. The original article was published on A List Apart almost a year ago, and the movement has slowly been building since. Its practically a buzzword now.
The idea is fairly straightforward: With all the new internet devices coming out, people are accessing websites in many different ways and viewing them on many different screen sizes. Monitors are getting bigger, smartphones are (mostly) getting smaller, and tablets are, well, somewhere in the middle. So why develop sites at just one size? If people are viewing sites at different times in different ways, shouldn’t the design—and in some cases the content—change as well?
The idea is a great one. The executions, however, are easy to screw up. Yesterday on Twitter I briefly discussed the blog post More Responsive Design, Please and some of the problems I see with many mobile sites. With Responsive Web Design starting to gain momentum, I fear we will start to see many designers getting caught up in the idea and trying to implement responsive designs just for the sake of it, throwing away many principles that still hold true.
This post is not an attack on Responsive Web Design. I think the idea is great. This post, rather, is to make sure designers are thinking things through before acting. A word of caution, and a reminder of some of the design and development principles that should still hold true regardless of how “responsive” a site is.
Grids are good
While technology and devices will always change, good design principles will not. Proper grid alignment will always be key, and the Golden Ratio will always be golden. Similarly, the ideal number of characters-per-line of text is still 66.
For these reasons, fluid layouts, while they can be great, can also be very dangerous. Extra attention needs to be placed on these kinds of details for such layouts, otherwise good design is simply being sacrificed in the name of a web design movement. Adapt.js looks to be another interesting idea for using multiple grid layouts.
Mobile users don’t always want to be mobile users
This was the main subject of my tweet yesterday. A growing trend is to create mobile versions of websites, often at 320 pixels. Back before smartphones ran complete browsers, mobile versions were actually necessary. Today, however, they’re generally not. They can still be a great idea, but if designers aren’t careful, they can often just make the situation worse.
To create a solid mobile site, a designer needs to nail exactly why users are accessing the site on a mobile device. And assumptions on this issue are not always correct. For me personally, when I access a site, generally the first thing I do is search for the “full site” link. This is especially true for Facebook’s mobile site. Why? Because I already have their iPhone app that essentially has the same features as the mobile site. If I’m accessing Facebook via Mobile Safari, it’s because I’m looking for something only accessible via the full site.
If I’m accessing a site via my iPhone that I also regularly visit in a full browser, chances are I know what I want and where it is. Changing anything, regardless of intent, does not help. I already know where everything is—don’t make me find it again.
We can’t reliably determine a user’s intention based on the capability information we collect from her device or internet connection.
Unless you are sure beyond a reasonable doubt that you know exactly what your mobile users want, there needs to be a better way of determining which content to show than simply checking for the type of device.
Remember back when people used to do this awful thing called browser detection? It sounded like a good idea at the time, then we realized it only complicates things.
Developing sites based on set resolutions may work for the time being, but it is important to remember that screens and resolutions, even on mobile devices, will change.
Analytics are your friend
Want to know for sure exactly what mobile users do on your site? You can find out. If more designers looked at actual data before making design decisions, we’d have a lot more excellent mobile sites out there (and a few less bad ones).
Use your brain
In summary, we just need to remember to use our brains. It’s the best design tool we have.
And yes, I am still alive. I realize this is the first time I’ve posted here in almost 2 years, but things have been a little busy. I hope to get back into the habit of posting more regularly, and I can always be caught over on Twitter.