In Response to Responsive Web Design
After receiving such high praise from those who have earned my high praise, Ethan Marcotte’s article on Responsive Web Design quickly hit my must read list. If you haven’t had the chance to read it I suggest that you do. Not only because the rest of this article will make no sense to those unfamiliar with the article but also because we all have a lot to learn from it.
After reading what Ethan had to say I immediately had this itch to throw in my opinion. Maybe I am just long winded but I knew that a comment on the post itself would be a poor medium for me to explain what I had to say. Unfortunately my opinion was quickly buried under a sea of responsibilities and deadlines. Thankfully Jeremy Keith came to the rescue yesterday when he posted some expanded thoughts on the topic. Once again a suggested read. Jeremy started to touch on what really irks me about this subject but didn’t quite hit the nail on the head for me.
Responsive Web Design is Incomplete
Responsive web design is a fantastic idea and practice, something that I hope will become a normal practice not only for myself but for web design in general. However, I find these two articles to be a one dimensional solution to a multi-dimensional issue. Both Ethan and Jeremy discuss the importance of having a fluid and flexible layout when creating a web site. Something that can adapt itself not just so it can fit your iPhone or your Droid but so that it makes the best use of available space in any environment.
I believe an important part of responsive web design is that we understand the big picture. The big picture here being that fluid web sites are not just designed in order to be effective for the devices and technology we have today but also for what we might have in the future. My question with all of this is why are we so focused on the site layout when different devices have other implications as well?
Different Devices = Different Content Needs
I do a decent amount of web browsing on my phone and I do a lot more on my desktop machine. While the mobile web is growing and getting a lot better I still don’t have a strong desire to do a lot of web browsing on my phone when I don’t have to. It is much more a convenient tool to use when a computer isn’t an option. Because of this, my goals for browsing a web site on my phone are entirely different than they would be if I were on my computer. So why does the website I see on my phone show me the same content?
Now before I go on I’m sure a lot of people will jump at me here and talk about how mobile sites are often stripped down to the basics and do display a different environment for the user. However, mobile sites and responsive web design don’t really agree with each other do they? No, what I want is content that is focused to my situation on a layout that plays well with whatever device I am using.
This whole argument is best showed in an example. For the sake of consistency I am going to go back to the St. Paul’s School web site that Jeremy uses in his post, hopefully he doesn’t mind! First let me say that the design and layout of the site is beautiful and well done. This site can serve as an excellent example of how a fluid web site should be created. The flexibility of this site on multiple devices is great but if we factor in the additional implementations of mobile browsing some issues may start to arise.
If I am visiting this school for the first time and I am confused as to where I should park I would consider my phone a resource for solving this problem. If I were to visit the school web site to search for information about parking I would find that I need to navigate to Facilities then Location and then find there is a PDF I can download showing parking facilities for visitors. On my desktop this setup is perfectly fine, the information is not hard to find and pretty quick to get to as well as being in a logical place. On a mobile device it becomes a bit of a hinderance and not an ideal way to get my information.
I should probably follow this example up with a disclaimer that clearly St Paul’s was not my client so I have no idea now many people actually need to access their parking resources.
Expanding Responsive Web Design
The point I am making here is how can we take this genius practice of responsive web design and make it even better? How can we use resources like media queries to not only build a web environment that displays great everywhere but also targets the different needs of different devices? People using their phone to browse the web need different information than people browsing on a desktop and the same can be said for tablets, TV’s, readers, and the entire array of devices that now connect to the internet.
We need to look beyond responsive web design as the fluid layout and start seeing it’s potential as a fluid experience.