Tag Archives: usability

Putting Lipstick on a Pig

Closeup photo of a pig, Courtsey of Brent Moore, Flickr.com
Courtesy of Brent Moore, Flickr.com

I recently took a trip that involved multiple hotel stays. One of the hotels reminded me of a certain type of internet experience. The hotel described itself as a luxury hotel, and indeed it had the amenities of luxury—the plush white robes waiting in the closet, the thick towels, the Gilchrist & Soames toiletries. However, only one burner of the kitchen stove was functional, the television played only snow, and the pillows were without pillowcases. And the fundamental structure of the building itself was flimsy and old.

Having committed to the hotel, both financially and logistically, I tried to make it work. I made my coffee using the one working burner. I watched movies on my laptop. I found pillowcases. And I tried not to look too closely at the stains, dirt, and cracked paint.

This worked for about four days, at which time I cancelled the remaining three days of my reservation and left. Satisficing ultimately wore me down, to where I dreaded returning to my room—plush robes notwithstanding.

As a web designer, sometimes my job is to dress up poorly conceived and architected websites and web applications—also known as putting lipstick on a pig. Perhaps this self-awareness is part of what made my hotel experience so uncomfortable. It was like I was living inside one of my less glamorous projects—a bit like Being John Malkovich, but without the humor.

If the basic framework is a pig, lipstick does not a luxury experience make. My guess is that this hotel has a high bounce rate, with visitors checking in, staying a few nights, leaving or leaving early, and never returning. They would be better served spending their luxury dollars on providing a solid baseline of service and cleanliness, and making their facilities fully functional. Who wears bathrobes, anyway?

The same holds true for web experiences. A clean interface that supports basic usability and functionality wins out every time over a luxurious yet buggy design (fortunately, there were no bugs).

The experience served as a good reminder. For interaction design, I need to focus on the essentials and do them extremely well, and resist the urge (or the push from clients) to reach for the lipstick until I’m sure it’s not for a pig.

Web design articles for Peachpit

Screenshot of Peachpit article page

Peachpit is one of the most well known publishers in the design and technology industry. In particular, their New Riders imprint is the stomping group for the field’s most prominent experts, through the “Voices That Matter” series. I have had the honor and privilege of publishing a book, Access by Design, and many articles under the Peachpit masthead.

My most extensive series of articles has been for Peachpit’s Web Design Reference Guide. Alongside web gurus such as Andy Clarke, Robert Hoekman, Jr., Molly Holzschlag, and Dave Shea, I published 20 articles for readers interested in learning best practices for web design. For the most part, my articles focus on usability and accessibility concerns, including usable forms, flexible layouts, and data tables.

More recently I published two articles with Peachpit on user-directed design: one on making the case for user research and a second describing the components of a project charter.

Access by Design

Access by Design book cover

My work as a web designer became more meaningful when I became involved with web accessibility. I found using design to address issues facing people with disabilities more rewarding than focusing on aesthetic concerns of flash and visual impact. And in learning more about universal design in other disciplines, I learned that accessibility and good design go hand in hand.

When I first became aware of web accessibility much of the attention  was in the form of guidelines and best practices. I was interested in integrating accessibility into design rather than considering it as an afterthought or as part of a validation process. All too often, accessibility is brought to the table at the end of the design cycle.

Usability through user-centered design was also gaining a foothold in the years leading up to Access by Design. Slowly but surely, design requirements for web sites and applications were being defined by user needs rather than the preferences of those making design (or business) decisions.

Access by Design integrates concerns for usability, accessibility, and universal design into a design methodology—universal usability. Human-computer interaction pioneer Ben Shneiderman defines universal usability as “enabling all citizens to succeed using communication and information technology in their tasks.” My goal in writing Access by Design was to provide practicing user experience professionals with a toolkit for achieving universal usability on the web.

As with Web Style Guide, the complete text and illustrations from Access by Design is online, along with additional resources to support further exploration and understanding.

New York Times article on web accessibility

Photo from office window with brick wall obstructing the view
The view from the window in my old office, obstructed by a free-standing brick wall

 

In the spring of 2002 I had an idea for an article. For several years I had inhabited an office in Berry Library at Dartmouth College. The office was nice—large window, high ceiling, new construction. But outside the window was a brick freestanding wall that obstructed my view. I tried not to let it rankle me, but every time I had a visitor she or he would make some comment like, “Nice view.” Thanks.

I heard through some source that the wall had to be that height—something to do with the golden ratio and classic proportions. But the reality is that every window on the first floor of the north facing side of the building looks out on brick instead of the beautiful New Hampshire landscape. And to top it off, the wall is purely aesthetic—it has no structural purpose.

At the time I was getting more involved in web accessibility. I found myself arguing against elements, such as Flash and dropdown menus, that were unnecessary and could potentially create barriers.

That’s when I finally found a purpose for the wall outside my window. I could use it as an illustration of how design decisions can result in unnecessary barriers. No one who visited my office ever praised the wall or saw its value despite the drawbacks. If I created a parallel using this unnecessary and obstructive wall, perhaps people would arrive at the same conclusion about barriers on the web.

The idea had traction. I wrote a rough draft and pitched it to an editor at the New York Times who had given Web Style Guide a favorable review. She connected me with the editor of the New Economy column and I was off to the races. The article, New Economy; Eye-popping graphics can spice up Web sites, but they also create barriers, was published in paper and online on June 10, 2002.

This article is one of my proudest accomplishments. The writing came together nicely and went out to a broad readership. I was able to raise awareness of the barriers facing people with disabilities at a time when web accessibility concerns were not well or widely understood.

Web Style Guide

Web Style Guide book cover

The first version of Web Style Guide was a web site called the Yale C/AIM Web Style Guide, posted in 1993, just as the world outside computing and academia began to notice the new medium and the Internet in general. The early web was sorely lacking in aesthetics but exploding with potential. Web Style Guide provided much-needed guidance on structure and design based on several decades’ worth of experience with print, hypermedia, and multimedia design and authoring.

In 1997 my co-author, Patrick Lynch, and I updated the Web Style Guide site to reflect the maturing design trends and changes in web technology. This was a time of significant progress in visual design and interface sophistication, but at the cost of standardization and accessibility.

In 1999 we produced the first print edition of Web Style Guide. The web site had gained a significant following as more and more organizations turned to the web as their primary means of communication. People with little or no background in design were assigned the responsibility for web site development, and they looked to Web Style Guide for calm, reassuring, and practical guidance.

Since its inception as a web site in 1993 and into its third edition, Web Style Guide has presented solid design advice based on classic design principles.  In the second edition we focused on solid design practices, acknowledging the growing attention to web standards and accessibility. In the third edition we were able to move away from issues like cross-platform compatibility and adaptation for people with disabilities, and instead provide solid planning, design, and editorial guidance for a more stable, accessible, and sustainable web site.

Web Style Guide is a classic. It has been translated into more than eight languages, and is commonly used as a course text for web design classes. Despite the availability of a book version of the guide, we deliberately chose to continue to make the web site materials freely available.

Screenshot of Web Style Guide page

“A style guide for the interface with real long-run value, showing us deep principles of design rather than simply fashion and technology.”
—Edward R. Tufte

“An Elements of Style for Webmasters.”
—J. D. Biersdorfer, New York Times, Circuits Section

“At last a book on the design of web sites with the viewer in mind. Non-technical, yet informative and lively: it delights as it informs.”
—Donald A. Norman, The Nielsen Norman Group