If your users need an instruction manual, you’re doing it wrong

On last night’s Top Chef (come on, you didn’t think that I wouldn’t be obsessed with that show, did you?), in one of those random throwaway segments that they throw in just before or after the commercials, two of the chefs got into an argument. The argument was about whether customers should need instruction on how to eat a chef’s food.

One chef was loudly insisting that customers need to be told how to eat their food, as if humans hadn’t perfected the art of ingesting calories over the last several thousand years, or as if their food was so bold, so innovative, so completely unique in the way that the flavors were integrated, that there was no way a layperson could possibly understand the proper way to consume it.

Likely, you can guess by now that I was pretty solidly in the other chef’s camp. Food can be innovative, it can be full of surprises, but it should always be *food* – that’s the point of it. Food is not your “artistic vision,” it’s not some intricate puzzle to solve, but a fundamental human experience that you’re creating for another human, and that human should be allowed to experience it without needing a tutorial. To behave otherwise is an insult to the customer.

The reason I mention this is because lately, in my business development research, I’ve been coming across website after website that requires an instruction manual to navigate. Literally, one website I came across *did* have an instruction manual – and the site still didn’t work.

This is the curse of “artistic vision” parading as design. In their enthusiasm to create something visually stunning and innovative, some designers simply forget that they are creating an experience for another human – and that the human they’re designing for has a specific need which has absolutely nothing to do with “exploring the site.”

I’d like to be able to blame this on Flash. Truthfully, many of the worst offenders I’ve seen have been all-Flash sites, or worse, Flex sites (shudder). But it’s not just Flash, it’s also CSS3 and JQuery. Digital experiments are fine; terrific, actually. But when you start doing things like recreating the Fail Whale in markup, using roughly 372 lines of code (most of which were empty <div> tags) and 1273 lines of CSS code in the process, you start creating the same situation that web standards were meant to solve: you’re putting form ahead of function, and tying content to presentation.

Mind you, the CSS3 Fail Whale is an extreme example. But imagine a day when more sites will behave like this – where a client’s logo is no longer an image, but a series of empty divs positioned and rotated in CSS, all of which is placed in markup before the content. What happens on mobile browsers, when they try to download all of that code before they show the page? What happens when a blind person visits the site and the screen reader tries to read all of those empty divs (which can happen in some of the stricter modes)?