Suffering in Site Design

Jakob Nielsen was interviewed on CNN.com and at the bottom of the article was a statement about user testing that really hit me:

…And you sit back and you watch them, and you will suffer, because I guarantee when your customers try out your Web site, they will fail again and again, they will complain bitterly about many design elements that you never even thought to question, and that’s why user testing is the ultimate reality check

Here are some things I’ve learned from my seminary classes on hermeneutics. Hermeneutics is not just a theological thing, but an everyday thing that you use. It is required in law school as well as seminaries. Hermeneutics is the science of determining what a text means and how it applies. Hermeneutics has three major steps:

  1. Observe
  2. Interpret
  3. Apply

Now before I lose you, let me make this really practical, if you’re designing a web site, you need to know how your user will do those three things. In speech we communicate in certain ways and listeners observe (listen) to what is said, interpret what is said and then, if there is an application (often the point of speaking) they will hopefully apply what you’ve said. Lawyers need to be able to observe the law, interpret the elements of the law and then apply them in legal cases. Hermeneutics is basic and simple, but if we try to just skim over these steps then there may be a reason why there’s suffering in web development.

Observe
Observation requires asking the questions: Who? What? When? Where? Why? How? Those questions are asked about all sorts of elements of your page. These questions are often critical for writing mission statements and other documents that give direction to companies and projects. Some things on your page don’t have one of those aspects. Below are some things to ponder on these questions.

Who?
If you’re working on a blog, the who is most likely the author of the blog, however, your who may also be the reader or an interviewee. Ask yourself some of the following questions: Who is the page about? Who is the page for? Who will benefit?

What?
This question is often the topic or subject of a page. If this is not readily obvious, then your page is not well designed at all.

When?
I’m not sure how this one fits in with many web pages, other than having some sort of dating on the page may be valuable. If your content cites an article that reviews a product, a date might be valuable. Press releases fall under the category of needing a date. Scripting events obviously need a time element, if you have time oriented content on your page make sure that it is handicap accessible.

Where?
Where you put content is probably a critical issue. Know your audience. If you deal in internationalization (i18n) then you really need to keep track of this because multiple cultures deal with text flow that is not Left-to-Right. Where is the event? Lots of "where’s" exist.

Why?
Why? This is the question that we all must ask, I think it may very well be one of the most common song titles to every be used. I would hazard a guess that one in ten full length albums that are ever released has a song called Why. Enough of the music. Why you placed something on a page, why your CSS adds hovering (you are using CSS for mouseovers aren’t you?) effects, or why it doesn’t? Asking this critical question can make or break your design. Why sites have four major attention grabbing elements on a page is a mystery to me, but plenty of sites do that.

How?
How will the user navigate? How will the user find information? How will they search? How will they pay? How will they receive the product? How will the links stand out on the page? How will this get translated? How will the translation be received?

Remember to ask these questions because they will lead you to potentials for user interpretation of the site. Something that is key in thinking about web design is that every person who comes to the page for the first time has to figure out how the site works. They will be asking at least a sub-set of these very questions regarding the site. A core set of things they might ask are

  • What site am I on?
  • How do I navigate?
  • What is this page about?

Where’s the Beef?
In a fractal-like manner pages are made up of elements (nodes or tags) that should have the same questions asked of them. Why am I using this tag? Why am I using this CSS selector or pseudo class? Why does this link have a hover effect in the navigation, but all of the other links look different [I am not saying this is bad, but just suggesting you ask why it behaves differently]? Why did I style the <abbr> and <acronym> tags that way (you are styling them aren’t you? Remember that Internet Explorer may not render them styled like Mozilla or Opera)?

Interpretation
Most users will find this information by scanning the document starting from top to bottom (Left-to-Right in some countries, with variation by language). Make sure that the page elements complement this style, or at least give visual clarity to distinguish anything that breaks this pattern. For example if your menu is on the right hand side instead of the common left hand side or secondary top (under a banner) then you will want to distinguish it because often advertisements are on the right hand side while navigation is on the left.

As they scan the document they will pick up elements, fragments of data, and assimilate them into a summary of the site, page and content. By first planning out your site structure, page layout and content you will be able to place key elements inline so that users clearly identify those major things with little effort. While some sites use bread crumbs to help distinguish the location on the site, this is not usually a major heading and therefore can lend itself to be a good secondary source for those who further scan the page for more information.

One very strong argument for semantic HTML code is that, unless styled otherwise heading elements stand out and content is easily outlined. Interpretation of the content happens rather rapidly. Remember that if you’ve carefully asked and answered the questions that detail user observation that they will be able to interpret your document and then move onto action or application.

Application or Action
If your page does not cause people to take action or apply some detail to their lives then they will most likely not be interested in the content. Much of what is action oriented is tied to the content, something a designer may or may not have control over. However, action can still be influenced by the designer, if the sites colors don’t cause excitement (check out what colors mean in different countries) and may stir people to action. A common technique for political campaigns in the United States is to use Red, White and Blue to motivate people to vote for a candidate. Those colors mean patriotism and passion.

Conclusion
If you are privileged to do customer usage surveys with real life users this is a really good way to see observation, interpretation and application first hand as a designer or developer. By watching users use the site you’ll see if your planned and (hopefully) well executed not bring you to a point of suffering. The point of usability studies is to give you solutions to reduce the need for confirmation of design choices.

Please Comment:
In an upcoming article I hope to write basic reviews of sites that have paid attention to these details and remained simple without looking elementary in design. If there are sites that you see, use or know of that meet these requirements, please post them in the comments as I’m truly interested to hear your thoughts. Are their points that are not clear in this article? Do you disagree? What technique, philosophy or approach do you use to build a site design?

How Not to Use Flash

Dave Barry just announced today a new book that he and another fellow wrote: Peter and the Starcatchers. This book’s web site is one of the worst uses of Flash cursors (mouse pointer in layman’s terms) I have ever seen! Do I use the point of the sword (like I use the point of the mouse), or the butt of the sword? Well, it turns out you use the butt of the sword. Why! Why have a cursor so large at all?

This is not a book review though, because I have not read, nor do I want to project about the quality of the book.

Registration Day II

I am here and the line is long. I’m writing this on my cellphone while I wait. I have seven numbers before mine, 92. However, it’s raining beautifully outside and the woman behind the counter has peacock like hair, so I’ve at least got a couple of reasons to smile while here.

Confession

I’m in love with my wife.

I know you know that she knows I love her, but I just had to tell everyone. Again. She’s the (blonde) bomb(shell) that I always dreamed of except Jessica has brains, a tender heart and an obsession with whether or not her pants make her butt look big. I should have been dreaming of the brains and tender heart, but when you’re a young adolescent your priorities are often screwed up by your hormones.

Jessica works so hard to keep Abby growing, maturing and learning. She keeps the house up (as much as one can with a crazy, cute two year old running about shreaking, "Here I come!"), she makes great food, she likes great food when we go out and she knows just how to tickle my fancy.

I’m a blessed guy 🙂

Speed Up Your Site

Speed Up Your Site (Buy it at Amazon.com), by Andrew King, is a great addition to any web developers library. I heartily recommend it for the depth and breadth of the topics covered. This is another great book in the catalog of New Riders collection of programming and web development books.

By using the techniques in this book I have been able to really speed up the client side code for multiple projects and have gotten great feedback from users. The section of JavaScript optimization alone is worth the price of the book. Areas I have yet to explore in optimization include graphics and Flash work. I don’t do any Flash, but am considering trying that out in the future (for some things) and the graphics that I use on sites are often pretty sparse to help increase load speeds. Kudos to Andy for the great book that will be off the shelf until it’s completely committed to memory.

Registering My Car Part I

I have to register my car, I’ve put it off for some time and so today I went to do it because I’ve almost run out of time before all of my Texas stuff expires. What a screwed up setup they’ve got here. Now, I know what you’re thinking, "There’s something stuck in my teeth." But you’re also probably thinking about how the government always has things screwed up. You’re probably right.

Anyhow, you should note that you must get your car inspected for emissions. I don’t know why, I know my car emits things, usually fumes that if I breath too much of I’ll die. Then, because I’m from out of state I had to have a VIN confirmation done. This is a check that costs an extra nine dollars. I figured it was cheaper than some checking systems because they must have to use computers to check to see if the car was reported stolen, or if there’s some issue with the car in the government records. If you were thinking along the same lines, you’re wrong, and so was I. Instead this check involved a gal looking at the VIN on my dashboard, the VIN on the side of my driver’s door [actually, it was the car’s dashboard and door] and the odometer reading. She signed the paper, I gave her my money and in $10 minutes flat she’d made just under $1.00 per minute. No computer checking software, no government database access, just two eyes, a pen and some paper and I was ‘legal’.

The fun didn’t stop their either because I had to go register the car now that it had been scientifically proven that my car emitted things from its tail pipe, the VIN numbers matched on my door and dashboard and my odometer was not showing 2 miles. I had to go to a building that was approximately 3 miles away and wait in a line to prove that I could pay more taxes and fees to own my Honda. I went up to the information desk and asked roughly how much registration might be. I had foolishly assumed that there might be some flat tax/fee that you pay and then they let you show that registration paper to the police if they so desire to see it. wrong. She told me it could be anywhere between $100.00 and $150.00 but she wasn’t sure, the computers would tell me [Sure use computers here].

The gal kindly called my number (the ticket said B29), "29." I rapidly stood up because all of the people working behind the counter called out numbers like it was an auction and I didn’t want to be skipped. One gal called out 24, waited (I’m not making this up) 3/4ths of a second and then called 25… So anyway I’m at the counter, she asks for my papers, I show them to her and she says after about 30 seconds, "Do you have registration that’s newer?" I told her not with me and so she sent me off and tomorrow I get to go again. The part that chaps my hide is that I already passed the VIN inspection which would in my humble opinion need the registration paperwork to prove that I’m me and that I own the car (or am making payments on it). So, tomorrow morning, bright and early I’m heading over there to register this car, I will do it, and I’m getting there before 7:00 AM, when they open.

The Three Musketeers

I just finished reading The Three Musketeers (buy this on Amazon.com) and am rather impressed. While it was not quite as good as The Count ofMonte Cristo, it was pretty darn good. It had a few parts that were surely more sexual than TCoMC but compared to any modern literature I’ve read, they were merely innuendo. I’ve had to read this book slower than my other reading because I’ve been busy with various other work related things, but I made sure I had time to read it because I like to have some play time at home, alone.

The characters in this book are interesting and the ending was at the very least a surprise. Threads were being woven through out the book that I didn’t see coming together at all, and the character often called ‘Milady’ is just astonishing. After you read TCoMC you should read this one. I assume we’ll go to the library soon where I’ll pick up The Man in the Iron Mask.