Responsive Design is Everywhere

I recently read an article called The New Rules of the Responsive Web by Matthew Carver on the Webdesigner Depot website. The article started by telling me what I already know – Responsive Design is now a near ubiquitous buzzword on the web. To me that means a lot of people think it’s great (including me) and a lot of people don’t know what it is – but know they need to have it.

The Responsive Design approach is been around for a long time. But it has now gathered enough momentum to be a part of most every web design project. This article lays out four ground rules for how to work on the design of a responsive web design project. The first rule is don’t stop at just a graceful rescaling of the design. Build a site optimized for anything from the desktop to a “tiny cellphone running IE7 on an EDGE network”. Second, there is no easy way out. Responsive design is complicated it calls for a new iterative approach to design and development. Evan Gerber VP of Mobile at Fidelity in a presentation I attended described it as a “Lean UX” approach. By prototyping your wireframes and presenting them to the client you can focus on the site’s layout before the design. Third is to embrace change. You have to change your tools and approach to design fro a responsive design project. You need to go beyond Photoshop and full page mock-ups. The last rule is my favorite – “Remember your roots”. It starts with a quote from Tim Berners-Lee. “[The web] should be accessible from any kind of hardware that can connect to the Internet: stationary or mobile, small screen or large.” This has always been the case. We need to think of how the target audience is consuming our information and make sure is easy for them to do so.

Read the full article for the full details of the rules. There are links to some nice resources and as always the comments on the article provide for some interesting perspectives.

No Lists for Navigation?

Using lists for navigation makes it difficult for blind visitors to navigate your site. This came as news to me. I had always thought that lists and nested lists were the most accessible way to code website navigation. The article Navigation in Lists: To Be or Not To Be by Chris Coyier on the CSS-Tricks website has convinced me otherwise.

The author reports that at a January 2011 Refresh event Reinhard Stebner, who is blind, suggested not using lists for navigation but instead use divs and spans. He uses JAWS as a screen reader and said navigation in lists makes it harder for him. Other attendees add that the list structure is not conductive to the screen reader’s logic and that divs and spans are the way to go as they’re invisible to screen readers.

Read the full article to find out what other attendees at the event had to say. Be sure to read the comments at the bottom. There is a great discussion amongst developers about the topic.