ALA 228: Take the Edge Off

Issue 228 of A List Apart is all about smooth.

User-Proofing Ajax

by Peter Quinsey

Ajax offers the ability to avoid both needless browser behavior like page reloads and useful browser behavior like error handling. When good web apps go bad, Peter Quinsey’s guidelines and techniques can help you and your users stay informed and productive.

Avoid Edge Cases by Designing Up Front

by Ben Henick

Sooner or later, nearly all web projects fall afoul of simple, preventable problems—problems like building the wrong features or creating a platform that can’t be upgraded. A proper process can help you manage scope, develop site features that actually match your objectives, and catch fatal flaws before your site is produced.

[tags]alistapart, ajax, usability, process, webdesign[/tags]

Better Know a Speaker: Steve Krug

You may have heard that An Event Apart is expanding. 2007 will see big, two-day shows in fine, fancy towns like Boston, New Orleans, Chicago, and San Francisco—with more great speakers than before and at a lower ticket price per day.

Steve Krug

Take Boston, and consider but one of our nine featured speakers, Mr. Steve Krug (biography, business website), author of the game-changing usability tome Don’t Make Me Think: A Common Sense Approach to Web Usability, now in its second edition. I can’t believe we got him. I’m still awed that he said yes.

If not for Steve Krug, I wouldn’t so much as speak the word “usability” in the privacy of my home, let alone bandy it about in mixed company. Curt Cloninger memorably expressed what many of us felt when he wrote “Usability experts are from Mars, graphic designers are from Venus” in the July 28, 2000 issue of A List Apart.

Stop and smell the brimstone

Like many design professionals, I rejected usability when I first encountered it. That’s mainly because I first encountered it as a series of rules, put forward by business-oriented, lab-coat-wearing experts who were hostile to the aesthetic component of user experience. Later, the rules would soften. “Only use blue, underlined links” would give way to gentler and more flexible guidelines.

And even before this softening, there was much in the early, fire-and-brimstone approach to usability that was actually of value to web designers. I should have been open-minded enough to benefit from the helpful bits and wink at the rest. But I was too busy defending my creative turf (not to mention reliving old battles with badly run focus groups and cocky account execs) to look closer and see that usability mainly means designing for the people who use my site.

And then along came Mary

Don’t Make Me Think. Starting with his book’s very title, Steve Krug made me see. Advancing from one low-key, guilt-free, common-sense premise to the next, Don’t Make Me Think made me think. And think. Above all, it made me rethink.

Icon from archived Happy Cog projects page (non-hover state).

Consider an archived Happy Cog portfolio page. Ignore the problem of orange-on-orange, which falls more under accessibility than usability. Focus on the page’s unusual means of presenting written content. When you click an icon, relevant text emerges. Click again, and it disappears. For instance, when you gently tap Cate Blanchett, you get text about the Charlotte Gray website we designed for Warner Bros.

It’s nifty stuff—at least for a non-Flash, pre-Ajax site. Or is it? I had fun designing it; other designers had fun reverse-engineering it and adding the same show and hide effects to their pages. I even shared the code in the first edition of Designing With Web Standards, mainly to prove how easy it was to use CSS, JavaScript, and the DOM to create playful interfaces that roughly mimicked the behavior of applications and kiosk-based presentations.

But the page’s usability is awful. How could a visitor possibly know that she is supposed to click an icon to reveal pertinent hidden text? She couldn’t. Hence the explanatory text at the top of the page. If you have to explain how your interface works, maybe you need to rethink the whole thing.

Steve Krug didn’t drop by my house to tell me my design was overwrought and under-thought. And he wouldn’t have put it that way, anyway. He’s way too nice a guy, not to mention way too experienced a consultant, to base his tutelage on insults. But his book woke my conscience and reshaped how I approach my craft.

His book, which you can read during a business flight, makes a convincing case for studying your audience, learning their needs, creating pathways of experience that you hope will meet those needs, and then testing, testing, testing.

Krug convinces because he is witty, and charming, and humble, and mostly because his ideas make sense and ring true. Boiled down, the essence of usability is the same as the essence of all good design: Think more so your users don’t have to think at all.

Design, after all, is about solving problems. Start with your user’s.

Please come to Boston

An Event Apart Boston 2007

My Event Apart co-host Eric Meyer and I don’t know exactly what Steve Krug will talk about on March 26 or 27 on our stage at Marriott Copley Place. We only know we will be privileged to be among his listeners. Registration for An Event Apart Boston 2007 will open in January, 2007. (A lot) more information about the show will be available very soon.

In coming weeks, in these pages, I’ll share what each of our exciting speakers means to me. Meanwhile, enough about me and Steve Krug. What does Steve Krug mean to you?

[tags]aneventapart, Steve Krug, usability, design, webdesign, boston, conferences[/tags]

Better community through printing

Readers read web pages. Readers print web pages. In 1999, the way to help readers print web pages was obvious to every major site owner: buy a proprietary, multi-million-dollar content management system avec service contract to generate multiple versions of every page. After all, you needed seven versions of every page to handle all the browsers out there; you might as well treat print the same.

In 2001, A List Apart started promoting print style sheets, and by 2003, all the cool kids were doing it. They were also mostly using free or low-cost, generally open-source, content management systems. Yay, open source! Yay, web standards!

But a problem remains: all those ponderous 1999 websites have trained readers to expect a “print this page” button and subsequent in-browser preview. How can you satisfy this basic user expectation while still enjoying all the benefits of web standards?

In Issue 226 of A List Apart, for people who make websites, Pete McVicar shows one very good way to do it. His “Print to Preview” combines alternate stylesheets and scripting to…

show how the page will look when it’s printed, perhaps display a preview message explaining what this new view is about, and then automatically print the page.

McVicar’s method isn’t the only way to do this—others will likely be mentioned in the comments—but his technique is straightforward and clean, and it takes care of users without making the mistake of trying to educate them about something in which they’re profoundly uninterested (namely, web development).

Also in this issue: “How to be a Great Host,” by John Gladding. These days, many people’s web business plan looks something like this: “Ajaxy goodness + ???? = Profits!” Other straw men seem to think five blog posts plus text ads by Google plus discussion board software guarantees a buyout by Google. It doesn’t.

Building a community takes time and work. No amount of social bookmarking and tagging can rush that process. But you can learn to avoid mistakes. And you can save time by following time-tested approaches. (Learning from your mistakes is overrated.) Gladding’s article is filled with smart, “first do this, then do that” tips that can help you grow your site’s audience with discussion that works.

Better printing. Better community-building. Better read A List Apart 226!

[tags]alistapart, webstandards, community, forum, printing, stylesheets[/tags]

ALA 223: tricks, guides, and giggles

A guide for the first-timer. A new trick for the size-conscious designer. And a bit of a giggle. Three pleasures await you in triple-thick Issue 223 of A List Apart, for people who make websites:

The ALA Primer: A Guide for New Readers

by Erin Lynch

New to A List Apart? Welcome! ALA’s own Erin Lynch has picked out a selection of articles that you may want to start with.

Text-Resize Detection

by Lawrence Carvalho and Christian Heilmann

It’s still hard to create page layouts that don’t break if the user increases the type size by more than a few settings. Chris Heilmann and Lawrence Carvalho serve up a way to detect your visitor’s font size settings using JavaScript.

A Standardista’s Alphabet

by Jack Pickard

“A is for Aaron, who fell down the stairs. K is for Kevin, menaced by bears.” No wait, those are just the notes from our last staff meeting. Jack Pickard offers a lighter look at the world of web standards.

[tags]design, a list apart, alistapart, textsize[/tags]

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.

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.

My friend Flickr

My Flickr Pro account has returned, along with the vanished photos and sets. Welcome back, photos! I’ve also learned a few things:

  • Flickr emails users before their accounts expire. They therefore emailed me, although the message didn’t reach me. (Using Flickr mail in addition to traditional email would help avoid heartache.)
  • As a Pro account nears its expiration date, Flickr posts warnings on your home page, advising you of the coming purge and suggesting you top off the account before it ends. I didn’t see these warnings because I never log into my home page; I go straight to my photo page. You never know what a user will do.
  • Discreet warnings were also placed on the photo page, I’m told. I didn’t notice them, possibly because their posting coincided with big changes to the Flickr interface. The designer who formatted the warnings may also have erred on the side of understatement. Designing error and warning messages is tough. Make them too big and users gripe; too small, and nobody sees them.

It will be interesting to see if Flickr changes the way it reacts to a lapsed Pro account in the future. Here’s hoping.

Most sites I use (and a few I’ve had a hand in creating) cause frustration because of poorly considered usability and design decisions. A very few sites, products, and applications delight us precisely because their design and usability are so good. Flickr is one of these rare delights. Like Apple, it is a company whose occasional lapses (or seeming ones) bug us, even as we forgive (or barely notice) the screwups and mediocrity of other companies. We hold these companies to a higher standard. But, hey, they’re the ones who set it.

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.

ALA 213

In Issue 213 of A List Apart, for people who make websites:

Flywheels, Kinetic Energy, and Friction
by Nick Usborne
You want your users to do something—buy things, beg you to work for them, learn how they too can achieve inner peace. So how do you get them to do what you want? Try getting out of the way.
Getting Started with Ajax
by Aaron Gustafson
In this excerpt from O’Reilly’s Web Design in a Nutshell, 3rd Edition, ALA production editor Gustafson takes you aside for a little chat about the birds and the bees. Or maybe about Ajax.

An Event Apart Atlanta

Messieurs Eric Meyer and Jeffrey Zeldman are pleased to announce An Event Apart Atlanta:

On 3 April 2006, America’s favorite pastime (designing with web standards) will come to the 755 Club at Turner Field, as the famed ballpark’s spectacularly furnished club hosts An Event Apart Atlanta.

An Event Apart is a concentrated, one-day learning session on modern web design. Check the Event Apart Philadelphia page to get a sense of how the first event, held in the Franklin Institute, went down. Transpose from Philly to Atlanta, think ballpark instead of museum, and you get an inkling of what to expect.

Online registration starts soon; seating will be limited. Subscribe to An Event Apart’s RSS feed to stay ahead of the curve. Can’t make Atlanta? Event Apart seminars in Seattle, Chicago, and Los Angeles are up next.