ALA 221: Navigation and writing basics

Building better website navigation. Engaging readers with writing that keeps them coming back. Issue 221 of A List Apart is all about the basics.

Where Am I?

by Derek Powazek

It’s 2006 and we’re still messing up global navigation. Derek Powazek gets back to basics and offers a few simple guidelines for getting it right.

Gentle Reader, Stay Awhile; I Will Be Faithful

by Amber Simmons

Bloggers and copywriters take heed: it takes more than daily publication to build relationships. Amber Simmons provides advice on engaging readers and keeping them coming back.

Authors

Working the web since 1995, Derek M. Powazek is the creator of many award-winning websites, a couple of which still exist. Derek’s claims to fame include designing the Blogger “B” and the Technorati identity, writing Design for Community, and cofounding JPG Magazine. He is the cofounder and chief design officer of 8020 Publishing.

Amber Simmons is a freelance writer and a web designer at the University of Texas at Austin. In her free time, she writes about religion and ethics at Breathless Noon. She can occasionally be found wrangling with code at Technical Poet.

About A List Apart

A List Apart explores the design, development, and meaning of web content, with a special focus on web standards and best practices. Explore ALA’s articles or find out more about the magazine. A List Apart, For People Who Make Websites, is published by Happy Cog™.

Credits

Editor: Erin Kissane. Art director: Jason Santa Maria. Semantician: Eric A. Meyer. Illustrator, watercolorist: Kevin Cornell. Production manager: Erin Lynch. Technical editor: Aaron Gustafson. Editorial intern: Henry Li. Production management interns: Andrew Fernandez and Russell Heimlich. Directed by moi.

We hold most of these truths

A copy of the Declaration of Independence in Thomas Jefferson’s own hand is on public view at The New York Public Library. Accompanying it are several of the very first printed versions known to have survived.

Standing in the presence of these yellowing pages is like glimpsing the face of God, for they are the foundation of American democracy, and their core idea underlies all human rights struggles, liberation movements, and emergent democracies around the world.

The version in Thomas Jefferson’s own hand is fascinating not only because it’s in Thomas Jefferson’s own hand, but also because it contains passages that would have ended slavery at the birth of the American nation. But those passages had to be deleted before the Declaration could be signed by representatives of states where slavery was practiced.

Put another way, the client bought a document intended to liberate all humanity, but demanded changes that kept part of humanity in chains. It would take another 100 years and hundreds of thousands of deaths before slavery ended, and the tragic legacy of African enslavement plagues the U.S. to this day. (At The New York Times: a slide show of Freedom Rider portraits, a work in progress by my friend Eric Etheridge.)

So the next time a client requests changes that make your work less beautiful, less usable, or less smart, remember that greater people than you have lost bigger battles over far more important matters.

The Declaration of Independence is on view at 42nd Street and Fifth Avenue now through 5 August and admission to the Library is of course free. If you’re in New York City this summer, the exhibit is worth a look. (Plug: And if you’re in town next week for An Event Apart, the Library is just a few blocks away from the Scandinavia House venue.)

The Power of Positive Whining

I recently had a bad experience on a good website and wrote about it here. Writing about experiences is not the same as writing about facts. A company might spend $40,000 to ensure that its navigation labels can be clearly understood by all users. That they spent the money and conducted the tests is the fact. Yet some users might not understand the labels anyway. That would be the experience of those users. Fact versus experience: not the same thing.

Most professionals who create websites want to know when a user has a bad experience. Most professionals who create websites worry about bad experiences. Most professionals who understand the craft of user experience design spend much of their time thinking about the user. That’s why they call it user experience design.

Thinking about the user means listening and trying and testing and changing. When you are lucky you get it right for a lot of your users. But there will always be some people you fail. When you are lucky, you hear about the failures.

The user is never wrong

If web design were not an art, then we would always get every part right. But it is an art, and, like all arts, it deals with the subjective. The subjective is something you can never get 100% right.

As a web professional, I value user feedback even when it’s exactly what I was afraid of hearing. As a web professional, I value user feedback even when the user is “wrong.” Like, when the user misses the giant red headline and the big fat subhead and the clearly stated error message and the grotesquely large exclamation point icon in the unpleasantly intrusive “warning” triangle.

A user can miss everything you put in his path, and call you on it, and the user is never wrong, even if there is nothing more you could have done to help him understand. The user is never wrong because experience is experience, not fact.

Paths and walls

As a designer I am always collecting data on what went wrong for one user or another. It helps me do better on the next round.

As a designer who interacts with websites, airport and subway signage, nasty little cell phone interfaces, and other variously successful communication attempts by designers and engineers (in short, as a user), I not infrequently write about my user experience—especially when my experience is not what the designers and engineers intended.

I do this not as complaint, which is of no use to anyone, but as critique and information-sharing. It is critique when, by examining a specific case, it illuminates a point of interest or failure in many designs. When it’s less broad in implication it still has value as data about a particular path that hit a particular wall.

If the designers and engineers see what I’ve written, they may think about their product in a different way that is helpful to them and to some of their other users. If other designers and engineers see it, they may think differently about their own designs, especially if their designs are informed by the site or product I’m writing about. Write about a usability error at Amazon, and 100 sites that copy Amazon will improve.

Why we fight

I am a walking edge case. If an operating system upgrade goes smoothly for everyone I know, some part of it will go wrong for me. The written directions from Manhattan to Rye may convey you safely and serenely between those locations, but the way I read the same words, I will end up on the dodgy side of Yankee Stadium. I suffer so you don’t have to.

Writing critiques is a thing I sometimes do on my site. I’ve been sometimes doing it on my site for eleven years and will keep at it. Some of these posts can be characterized as pointless, misinformed grousing, while others contain spelling errors. A few have had mildly beneficial effects in the wider world, and that’s good enough for me.

DWWS 2e Cover Preview

Today, with a couple of minor corrections not shown in the following sneak preview, we approved front and back cover art (PDF, 161 KB) for Designing With Web Standards, 2nd edition. And with that, the last bit o’ the book flew off to the press. Somewhere a bell bonged and an angel got his wings.

You may notice that the second edition’s cover is green, and may recall that the cover of the first edition was orange. Boy, was it ever orange. Boy, is the second edition ever green. Peachpit, editor Erin and I discussed all kinds of possible cover art makeovers, but in the end I decided to change only the color.

Actually in the beginning I decided to change only the color. Then I pretended to keep an open mind while alternatives were discussed—my favorite being the Dorian Gray notion that my photo would age while the rest of the cover stayed the same.

Writing this second edition showed me that when it comes to web standards, some things have changed and others haven’t.

Things change, things stay the same

Since I wrote the first edition, the community of standards-aware designers has mushroomed. Better best practices have emerged, replacing the second-best practices with which we launched the revolution. More designers, developers, and content people preach and practice accessibility, and more clients request it. You find semantic markup, unobtrusive scripting, and CSS layout where you never expected to find them, and increasingly you find them coupled with good design, good usability, and even (eek!) good writing.

Without much hoopla and with even less press, web standards are powering findability and the “Web 2.0” applications that have made the web hot again for investors and shallow journalists.

All this is new and most of it is good, yet too many sites are still inaccessible, and too many clients and bosses (not to mention too many designers), if they know about standards and accessibility at all, still have it dead wrong. It is for them, even more than for you, that I wrote this book.

Today someone asked how she could persuade a colleague to include accessibility and standards compliance in the requirements for a major site redesign. I can’t meet with every hostile boss and nay-sayer on the planet, gently persuading each of them to see the light. But I can talk to them through the quiet pages of DWWS 2e, if you would like me to.

The pitch

Save 37% off the cover price when you pre-order Designing With Web Standards, 2nd edition at Amazon. Please note that Amazon’s listing currently shows the wrong cover art, the wrong table of contents, and the wrong excerpts. Not to worry. It’s the right book (and Amazon will correct the error soon).

[tags]zeldman, dwws2e, webstandards, web standards, newriders, peachpit, designing with web standards[/tags]

My Count of Monte Cristo

Summer means warm lemonade, sunburned shoulders, and Field-Tested Books at Coudal Partners — with reviews by a double dozen writers who “read a certain book in a certain place.”

The Count of Monte Cristo, field-tested on Mohawk Mountain, Connecticut, is my contribution to this year’s collection.

You can buy an elegantly designed 2006 Field-Tested PDF “book”, including all field-tested reviews from this year and years past, cross-indexed and formatted for portability and printability.

Wrapping Chicago

An Event Apart Chicago has wrapped. It felt like the best one yet. Everything clicked.

There were as many designers as coders in attendance, as many Chicagoans as out-of-towners, as many agency people and freelancers as in-house folks, and nearly as many women as men. They engaged at “good morning” and stayed involved all day, asking shrewdly penetrating questions and sharing their own insights and experiences. Energy flowed not only between the floor and the seats but also from one seat to another. It felt like community.

This was the third time out for Eric, Jason, and me. Our talks were sharper and shorter — looser and more relaxed, yet also more focused than before. The rhythm was better. The balance between technical and aesthetic subjects, how much time was alloted to each, the way one theme flowed into another — the music of the day — felt tighter and truer than at events past.

Thanks to our sponsors at Adobe, AIGA, New Riders, and Media Temple, we were able to give away thousands of dollars worth of software, books, and services. (We’ll be doing the same at An Event Apart NYC next month.)

Guest speaker Jim Coudal‘s leisurely stories were like little grenades of inspiration. He tossed them out casually; moments later, they detonated.

The day formally ended with lively critiques of sites submitted by attendees. We tried this once before, at An Event Apart Philadelphia, with mixed results. This time it felt like it really worked. The day informally ended at Timothy O’Toole’s pub, with a mixer sponsored by Jewelboxing.

Time, and the blog posts of those who attended, will tell if the event was as good for you as it was for us. Sincere thanks to all who attended. Thanks also to Dawson, John Gruber, Amy Redell, Michael Nolan, and Orrin Fink.

And a reminder: the Early Bird Rate for An Event Apart NYC ends June 9th. That’s a week from today! On June 10th, the price will increase by $100. So if you’re thinking of attending An Event Apart NYC — two days of design and code — please register soon.

All in

Three Saturdays ago, my father had a heart attack. Last Saturday, we rushed our baby daughter to the emergency room. In-between, my wife had to undergo scary and uncomfortable medical tests.

Everybody is fine, even my dad (truth in advertising: aspirin really can save your life) but my once-brown goatee has gone shock-white.

Everybody is fine, so take a deep breath and savor the unusually high pollen count.

Something else took place in these same tense two weeks: I finished my book. Designing With Web Standards, 2nd Edition (DWWS 2e) left my hands last night and will reach shelves this summer.

When I agreed to write DWWS 2e, I mistook the job for a quick spruce-up. After all, what I’d said in the first edition about the benefits of standards-based design was still true: accessibility and semantics make your content easier to find and faster and cheaper to distribute. And the browser most people used when I wrote the first edition hadn’t changed in five years, so how tough a rewrite could I be facing? I figured I was looking at an updated screenshot or two, a changed URL, and maybe a couple of sticky notes.

About four months into the grueling (but also magically riveting) process, I realized that what I was doing was writing a book.

A lot of 2e will be familiar to the book’s fans, but a lot is new. And new is work. New is infinite wash-loads of work. Messy, exhausting. At some point in the infinite rinsing and lathering I was told the book had to be finished by last night. And so it has been.

I wouldn’t have made it alone. Erin and Ethan were right in there, carrying me.

I finished. I finished while grappling with sudden existential crises involving the people I love most. But then, my mother died while I was finishing my first book. Books kill.

This is me being cheerful after completing a rather strong second edition.

2e! 2e! My father and daughter and wife are well. My book is good. My song is sung.

Everyware

Adam Greenfield has written one of the most provocative books in years. If the right people read it, Everyware: The Dawning Age of Ubiquitous Computing may do for the coming, computerless computing interface what Don Norman’s The Design of Everyday Things did for design generally. Like Norman, Greenfield argues for good design not as an aesthetic issue but as an ethical and business imperative. There is an urgency and clarity to every word.

Everyware is both a prescription and a warning. Although films like Minority Report have made such ubicomp staples as the gestural interface look a bit silly, these kinds of interactivity are coming soon to a wall or object near you. Depending on who designs them and by what principles, they will work beautifully or badly. Everyware will enhance our lives by anticipating our needs or it will destroy our privacy — or both.

Besides Don Norman’s book, the other piece of writing I sometimes thought of as I read Everyware was Walter Benjamin’s “The Work of Art in the Age of Mechanical Reproduction.” Writing in 1937, Benjamin pondered what the existence of photographic reproduction did to the status of the unique work of art. If the Mona Lisa can be reproduced by lithography, what is the value of the Mona Lisa?

It’s not that Greenfield writes like Benjamin (he doesn’t). It’s that both writers see and can describe changes in the world to which their contemporaries are oblivious. Greenfield is a friend and former member of Happy Cog so I have an interest in seeing his book do well. But if I didn’t know him or couldn’t stand him I would still highly recommend this book to anyone who cares about how design and technology are shaping our time.

Fine Corinthian Leather

Sophia Marie Dominey
A very healthy eight pounds, eleven ounces.
Dissecting The Process
or: How an A List Apart Illustration Comes Together, by the illustrator himself, Kevin Cornell.
simplifier lab
Phoebe Espiritu’s fine blog on the quest for simplicity and minimalism in design.
Rogue Librarian: SXSWi Takeaways
Carrie Bickner Zeldman’s writeup of her SXSW Interactive panel on Digital Preservation and Blogs. See also:
Digital Preservation Panel at SXSWi
Librarian Avengers’s notes on the same panel. See also:
Digital Preservation: What and Whom Are We Saving?
Bill Anderson’s notes on the same panel.
Vantan.org
Personal site of Vanessa Tan, devoted Netizen and musician, blogging from Singapore.
Aspen Design Summit
AIGA-sponsored retreat.
This is Powazek
Beauteous and well-written site of cofounder of JPG Magazine (and creator of bunches of other fab web content, none of which I need to tell you, ’cause you know)
Behind the WaSP Redesign
Designer Clarke discusses creative process. See also:
WaSP Annual General Meeting
Transcribed by Muffin Research Labs.
Does Your Blog Have a Business?
SXSW Interactive panel transcribed by Auscillate.com.
CSS Floatutorial
In CSS layout, float is all. Maxdesign’s step-by-step guide shows how to float elements such as images, drop caps, and next and back buttons to create image galleries, inline lists and multi-column layouts.
CSS Tweak
Now with in-page Help! Andy Peatling’s free web-based tool optimizes your CSS files. “It will take any CSS file and optimize the syntax, grouping your style declarations into shorthand where possible. It can also remove comments, and strip whitespace for maximum compression.”
A brief history of the “clenched fist” image
Like it says.
GrayBit v0.5 Beta
“GrayBit is an online accessibility testing tool designed to visually convert a full-color web page into a grayscale rendition for the purpose of visually testing the page’s perceived contrast.”
Interior Desecrations
Horrible home design from the classic halls of Lileks.
George Bush: I Don’t Know Much About Designing Rugs
In Design Observer.
Accessible Web Developers
A public group at ma.gnolia. Creating accessible (and mobile-friendly) sites.
Brit Pack
Proud members.
More Ma.gnolia Marks
See all 345 (and counting) of Apartness’s bookmarks.

Year-end blowout

What makes for a good design book?
Lou Rosenfeld, co-creator of information architecture, is looking for people who like to read. Specifically, he is looking for people who like to read about design and user experience. Are you one of them? Then here is your chance to sound off. What vital topics aren’t being covered (or aren’t being covered well) in the design and user experience books you buy? Where are publishers falling down? What are you dying to read? Let Lou know what you think.
Technorati is hiring
Technorati, a real-time search engine that keeps track of what is going on in the blogosphere, seeks a modern web developer, “proficient in state of the art LAMP (Linux, Apache, MySQL, PHP) development, with emphasis on PHP and Apache.” More to the point, says Chief Technology Officer Tantek Çelik, the company is looking for one who has kept up with CSS, semantic markup, microformats, and unobtrusive JavaScript.
Even more to the point, Technorati is looking for a smart web person who is tired of big-company bureaucracy, secrecy, and in-fighting, and seeks greater emotional and professional fulfillment—in other words, Technorati is looking for a web person who wants to make a difference. Yes, they really do write job descriptions that way, and not only in San Francisco, where Technorati is based. (Tags: technorati, jobs, webdevelopment.)
Freight for sale
FREIGHT (available from Phil’s Fonts) is a superbly detailed font family created by Brooklyn type designer Joshua Darden. Optimized for screen display, Freight is ideal for web interface design. You can also use it as a default font for such daily computing tasks as reading and writing email—makes a tasty break from Verdana and Georgia. Recent Darden fonts include Meta Headline (created at the behest of Erik Spiekermann and Christian Schwartz) and lovely, funky Omnes.
Kids with cameras

In Calcutta’s red light district, over 7,000 women and girls work as prostitutes. Only one group has a lower standing: their children. Zana Briski became involved in the lives of these children in 1998 when she first began photographing prostitutes in Calcutta. Living in the brothels for months at a time, she quickly developed a relationship with many of the kids who, often terrorized and abused, were drawn to the rare human companionship she offered.

Zana held weekly photography workshops between 2000 and 2003. There the children learned camera basics, lighting, composition, the development of point-of-view, editing, and sequencing for narrative. To Zana’s delight, equipped with inexpensive point-and-shoot 35mm cameras, the children produced incredible work. Their images are explosions of color: self-portraits, family pictures, street scenes, stunning tableaus of Bengali life.

Ruby on Rails podcasts
Audio interviews with David Heinemeier Hansson, who invented Rails and manages it as an open source movement, plus Ruby on Rails heavyweights and pioneers including Dave Thomas, Chad Fowler, Rick Olson, and A List Apart’s Dan Benjamin.
Fairplay defined
Everything you ever wanted to know about the digital rights management technology built into Apple’s iPod, iTunes, and iTunes Music Store. (Except how to turn it off.)