Appreciating web design; setting type

We have what we think is a special issue of A List Apart for people who make websites.

  • Every responsible web designer has theories about how best to serve type on the web. In How to Size Text in CSS, Richard Rutter puts the theories to the test, conducting experiments to determine the best of all best practices for setting type on the web. Richard’s recommendation lets designers reliably control text size and the vertical grid, while leaving readers free to resize text.
  • And in Understanding Web Design, I explain why cultural and business leaders mistake web design for something it’s not; show how these misunderstandings retard critical discourse and prevent projects from reaching their greatest potential; and provide a framework for better design through clearer understanding.

Plus, from October 2001, we resurrect Typography Matters by Erin Kissane, the magazine’s editor, who is currently on sabbatical.

[tags]webdesign, css, textsize, type, typography, sizingtype, sizingtext, understanding, typedesign, architecture, newspaperdesign, posterdesign, bobdylanposter, erinkissane, richardrutter, zeldman, jeffreyzeldman, alistapart[/tags]

Please and thank you

An Event Apart thanks its attendees, speakers, and sponsors for a great 2007, and announces dates and locations for 2008. Please join us next year! New Orleans, Boston, San Francisco, Chicago.

[tags]aneventapart, aea2008, neworleans, boston, sanfrancisco, chicago[/tags]

Testing designs for color-blindness

What toll does color-blindness take on design usability? Even experienced designers and art directors, assuming they think about color-blindness at all, can find it hard to predict how their work will appear to someone with, say, protanopia, the most common form of red-green color-blindness.

Enter Sim Daltonism (donationware), a color-blindness simulator for Mac OS X. Its floating palette filters your web page in real time, showing how the area around your mouse cursor looks to people with many different kinds of color-blindness, including rare as well as common types.

Windows and Linux users, or Mac users who would rather view complete pages than floating palettes, should check out the Colorblind Web Page Filter. In our studio, we use both tools. Here is Happy Cog as its front page may appear to a person with protanopia. (Allow time for the page to load, and don’t all click at once.)

[tags]colorblind, colorblindness, design, accessibility, usability, software, tools, apps[/tags]

To be of use to others is the only true happiness. Although a 160 GB iPhone would also be nice.

I was hoping Apple would announce a new generation of iPhones with hard drives sufficient to hold an entire music collection plus a handful of videos. Failing that, I was hoping Apple would announce a new generation of iPods that were exactly like iPhones (sans the phone), with hard drives sufficient to hold an entire music collection plus a handful of videos. What Apple announced was an iPhone without the phone.

So I bought a 160 GB iPod Classic. I already have an iPhone, and you can borrow it when you pry it from my cold, dead fingers.

The Classic holds my digital music collection (currently, 31 GB) plus five or six movies digitized at high enough quality to play on a Cinema Screen, and has acres of drive space to spare. I feel that I will never fill it up, although I’ve thought that about every hard drive I’ve ever owned, and I soon filled them all.

The Classic is new and shiny and I almost never use it because the classic iPod interface feels prehistoric after using an iPhone. (Indeed, half the things I do on a computer feel awkward compared to doing them on an iPhone. Click on a friend’s street address in your iPhone. Wow! Now do the same thing on your computer. Ick.)

There are about five movies my toddler loves on the Classic, but she won’t watch them on the Classic. She wants the iPhone and asks for it by name, like cats do for Meow Mix.

The Classic is good for plugging your whole music collection into your stereo. Or it will be when the dock arrives. The Classic does not ship with a dock, and no dock is made for it, but you can order a $50 Universal Dock from Apple. The order takes four weeks to process plus another week to ship. Be kind and call those five weeks a month. A month after unpacking my new Classic I will be able to hook it into my stereo and charge it at the same time—something I expected to be able to do on the day it arrived.

The frustration of that wish is not tragic, but it is not particularly smart marketing, either. This, after all, is a product for people who ardently wish to carry their entire music collection plus a handful of movies in their pocket. Wish fulfillment is the product’s whole reason for being. (Well, wish fulfillment plus the execrable state of air travel, which can turn a jaunt between Chicago and New York into an odyssey of despair and boredom. Carry a Classic and those five hour delays fly by, even when nothing else is flying.)

The guaranteed nightmare of even the shortest business trip aside, what do you do with the Classic? Well, I sometimes bring it to the gym. Because sometimes at the gym, it takes a while to find the right groove. The iPhone’s 7.3 GBs aren’t enough to hold a sufficient musical selection to ensure a great workout.

On the other hand, I can’t answer a business call on my iPod. So even though the Classic gives me lots more music to choose from, I mostly bring my iPhone to the gym.

No iPod is an island, or should be.

Did I mention that the iPhone has a gorgeous, high-resolution screen and the iPod does not? Then there’s the whole gesturing with your fingertips business. How nice that feels, and how weird and slow and un-Apple-like it now feels to go back to the clickwheel that once felt so poshly smart and modern.

I tell you this. If Apple can put a capacious, chunked-out hard drive on the iPhone—even if doing so makes the phone a tad clunkier—the company will have on its hands its hottest convergent technology box yet. And I’ll be the first in line.

Only 95 shopping days ’til Christmas, Steve.

[tags]apple, ipod, iphone, comparison, shopping[/tags]

An Event Apart savings end tomorrow

$100 savings on our final Event Apart conference of the year end Saturday, September 15. If you’re planning to attend An Event Apart San Francisco, reserve your seat before the price goes up.

Zeldman.com readers can save an additional $50 by entering discount code AEAZELD in the appropriate field during checkout, reducing the cost of the two-day event to $745.

What does that get you? Two days of web standards, best practices, and creative inspiration (not to mention parties, meals, snacks, and swag) with these visionary industry leaders:

  • Joe Clark, author of Building Accessible Web Sites (a coup! Joe publicly retired last year; we dragged him back)
  • Douglas Bowman, of Wired News and Blogger design fame and interface design director at Google (a coup! Doug has been missing, and missed, since he joined Google)
  • Aaron Gustafson, contributor to AdvancED DOM Scripting and Web Design in a Nutshell (a treat!)
  • Jina Bolton, co-author of The Art & Science of CSS and UI developer at Apple (a thrill!)
  • Jared Spool, founder of User Interface Engineering (a delight!)
  • Kimberly Blessing, group lead at The Web Standards Project and veteran of enterprise standards adoption (a pleasure!)
  • Erin Kissane, chief editor at A List Apart and Happy Cog (a joy of joys!)
  • Jason Santa Maria, art director for A List Apart and creative director at Happy Cog (just so great!)

And of course your hosts, Eric Meyer, master of CSS, and blogger no. 27, Jeffrey Zeldman (hey, that’s me!).

Seating is extremely limited, first come, first served. Don’t let the sun go down on you.

Comments off.

[tags]aneventapart, sanfrancisco, aeasanfrancisco07[/tags]

Event Apart Chicago wrap-up

The sights, sounds, and sense of An Event Apart Chicago 2007. Thank you, Chicago. You rocked. (Literally.) An Event Apart San Francisco is our next and final show of the year.

An Event Apart Chicago 2007 Photo Pool
Those who were there share photos in and out of the conference.
Blog reactions to An Event Apart Chicago ’07
Via Technorati.
An Event Apart ’07 Extended Mix
The interstitial playlist from the show.
Middle West
Speaker Dan Cederholm’s recap of the event.

One track continues to rule. It rules because you don’t have to decide where to go and what to miss. But it also rules because the conversations in the hallways and pubs can be centered around the same sessions. There’s no “ah, I missed that one because I saw ______ instead”. There’s a complete shared experience between all attendees, and that’s a very good thing.

Seven Lies in Chicago
Liz Danzico recaps her presentation and answers questions about information architecture.
Best Practices for Web Form Design
Slides from the powerful and incredibly useful talk by Luke W. “I walked through the importance of web forms and a series of design best practices culled from live site analytics, usability testing, eye-tracking studies, and best practice surveys. Including some new research on primary and secondary actions, and dynamic help examples.”
Design Your Way Out of a Paper Bag
Luke W: “Jason Santa Maria’s Design Your Way Out of a Paper Bag highlighted some of his creative process when working on the redesign of popular Web destinations.”
Search Analytics
Luke W: “Lou Rosenfeld’s Search Analytics talk at An Event Apart outlined ways designers and developers could utilize search query logs to uncover insights about their site’s audience and needs.”
7 Lies about Information Architecture
Luke W: “Liz Danzico’s talk at An Event Apart dissected seven often-cited information architecture rules and highlighted counter examples that exposed why these rules might be better suited as design considerations.”
Selling Design
Luke W: “Zeldman discussed the soft skills that enable designers to get great work out in the world.”
KickApps at An Event Apart
Dwayne Oxford: “It’s difficult to walk away from an event like this without a fresh perspective on CSS and the DOM, a head-full of elegant design techniques, and enough inspiration to catapult our work to the next level.”
On An Event Apart Chicago 2007
Brain Freeze on AEA: “Never a boring moment.”
She car go
Speaker, developer and author Jeremy Keith shares his experience of An Event Apart Chicago.

[tags]aeachicago07, aneventapart, aneventapartchicago, chicago, design, web, webdesign, conference, conferences, ux, userexperience, dancederholm, simplebits, lizdanzico, jimcoudal, derekfeatherstone, lousrosenfeld, jeremykeith, lukewroblewski, jasonsantamaria, ericmeyer, zeldman, jeffreyzeldman[/tags]

San Francisco, here you come

San Francisco. California’s jewel. America’s prettiest city. Cool fog and hot startups.

I last left San Francisco on September 10th, 2001. It was a good day for flying. I had gone there to speak. Normally when I present at a conference, I stick around, listening to the other speakers and chatting with attendees. But I saw little of that conference and even less of San Francisco, for accompanying me was she who is now my wife. Even from the heights of Coit Tower, I only had eyes for her.

On October 4–5, 2007, I return to the city by the bay for the fourth and final Event Apart conference of 2007. The schedule of presentations, published Monday, outlines a holistic approach to web design rarely seen on conference stages.

There are sessions on writing the user interface and developing effective content strategies (art direction for words, if you will). Sessions on designing and redesigning brands, adding ’zazz to tired layouts, and creating designs that scale to accommodate a thousand users or millions.

Someone who’s actually done it (and at a big company, yet) will share insights on promoting and nurturing standards adoption in the workplace. We’ll find out how CSS really works and what IE7 means to developers. And we’ll learn how to design and structure forms to maximize accessibility, improve semantics, and allow for more flexible styling.

The world’s foremost expert on the subject will tell us what’s wrong with online video captioning (a concern in our increasingly YouTubed world) and how to do it right. And from one of the founders of the usability movement, we’ll gain clues into how people follow the scent of information—and how that knowledge can help us connect users to the content and functions they seek:

…how the quality of links affects whether users click on them; how longer pages actually help users get where they are going faster; the three types of graphics; how users follow a scent; and four ways your design could be blocking their smell.

An Event Apart San Francisco presents one of our most striking speaker line-ups yet: movers from Google and PayPal, shakers from Apple and A List Apart, passionate leaders and experts, all. Plus two big parties, sponsored by Adobe and (mt) Media Temple, where you can network, job-hunt, swap horror stories and phone numbers, or just boogie the night away. Plus breakfasts, lunches, and snacks on both days, and a dandy bag of swag. All for $795 (reg. $895) during the earlybird savings period through September 7th.

Readers of zeldman.com can take an additional $50 off by using the discount code AEAZELD. Enter that code in the discount coupon area of the registration form to get all of AEA San Francisco for $745. Seating is limited and this opportunity won’t last forever. Don’t leave your seat in San Francisco. Tell your corporate overlord or generous uncle about An Event Apart San Francisco 2007 today.

[tags]aneventapart, aeasf07, design, webdesign, webstandards, conferences, seminars, sanfrancisco[/tags]

What Apple copied from Microsoft

hCard couldn’t do it. Basecamp couldn’t do it. Web apps from Google and Yahoo that integrate seamlessly with Apple’s iCal, Address Book, and Mail couldn’t do it. My iPhone has done it.

My iPhone has made me stop using calendar, contact, and e-mail applications I’ve used day and night for over a decade, and switch to the free—and in some ways less capable—applications that come bundled with Macintosh OS X.

Changing years of work habits is not easy. Migrating data, in some cases by hand, takes time I don’t have to spare. Yet I’m making these changes of my own will, and happily.

In short, Apple has finally copied something from Microsoft. Or, if you prefer, Apple has learned the marketing psychology lesson that Microsoft got first. For many consumers, convenience is of greater value than choice. A platform built of parts that work together seamlessly beats a self-curated collection of apps that don’t.

That syncing feeling

Microsoft knows this, Adobe knows it, and Apple had learned it by the time they launched the iTunes/iPod cartel. The iPhone creates a similar value proposition for OS X’s bundled communication, contact, and calendar apps.

Maybe all Windows users won’t switch to Macs, but many Mac users will dump Entourage, Eudora, and the like once they sync an iPhone to their computers. What “free” wasn’t enough to achieve, “seamless” just might be. If I can change work habits, anyone can.

Victory is suite

As part of a sexy, seamless software/hardware package, Apple Mail triumphs over more sophisticated e-mail applications for much the same reason Word beat WordPerfect and Adobe Illustrator trumped Macromedia Freehand. (True: Adobe bought Macromedia and chose to discontinue Freehand. But they’re burying Freehand due to lack of resources, not because they fear it.) Word is part of the must-have suite for business professionals, and Illustrator is part of the must-have suite for creative and visual professionals, and you can’t beat the suite. That is what Apple has learned.

What no one can teach Apple is how to make user experience beautifully intuitive and elegant, lending a spirit of fun to even the most mundane task, such as getting contact phone numbers into a phone. With Address Book and an iPhone, it’s not only automatic, it’s a near-physical pleasure.

Nobody does user experience as well as Apple, and nobody but Apple in the consumer market combines beautiful software with drool-inducing hardware. Except during the cloning years, when Apple lay in the abyss, Apple has always combined hardware and software. It killed them during the 1990s OS wars, but it worked like nobody’s business for the iPod and a similar synergy is driving the iPhone.

That I could be persuaded to spend money on an iPhone is unremarkable. After all, the phone shows websites and I’m a web designer; it’s tax-deductible research. What is remarkable to anyone who knows me is that I’m willing to abandon long-used tools and shortcuts to capture these new synergies. This suggests a longer and deeper market for the iPhone than just the gadget-obsessed and early adopters with sufficient disposable income. It’s even possible that, with continued use, the beauty and utility of the iPhone will help sell Macintosh computers to PC users.

It helps that the interface is beautiful as well as intuitive, and that many of the alternatives are neither.

An interface only a mother could love

Discontinued Eudora, the program I’ve abandoned in favor of Mail, is the crone of e-mail, with an interface only a mother could love. Now Up-To-Date and Contact are overly complicated, underly beautiful, and have long showed their age. None of these programs closely follows Apple’s Human Interface Guidelines (HIG). Never mind that the Aqua HIG is incoherent, that many of Apple’s own programs violate or ignore it, and that it neglects to offer modern UI designs and controls, prompting independent developers to create a new set of Human Interface Guidelines to supplement Apple’s. The point is, even in the Classic OS days of mandatory HIG compliance, the three programs I’ve mentioned did not work as Macintosh programs were supposed to. They were cross-platform and proud of it, and a Mac user had to meet them halfway. Nevertheless, they did things other programs couldn’t do, and I used them for that reason.

I continued to use them as time and change and market share conspired against them. I worked like a farmer who refuses to accept that his field has gone fallow.

When Basecamp sent work schedules to my iCal, I manually copied the dates into Now Up-To-Date. When my own web pages spat out standard contact information via hCard, I siphoned the data into Address Book, and then manually copied it into Now Contact, line by line. (Since the fields between programs didn’t match, I could not automate the process via scripting. Now Software made a free mini-application that used to port data between Now Contact and Address Book, but it never worked all that well, and it stopped working altogether in Tiger.)

Computers are supposed to make our lives easier, but everyone knows they do the opposite, and I was so deep into my rut I thought of it as a groove.

The incredible lightness of e-mailing

Change begets change. For years, in Eudora, I kept every e-mail message I received. I kept them all in tidy, named folders and wrote filter rules to automatically sort messages as they were received. Every client, every employee, every friend, every project had its own folder and its own set of filters. I spent at least an hour a day simply managing my e-mail, which is different from reading or responding to it. When the number of open folders became overwhelming, I dragged messages into a new folder called “urgent” or “deal with this” (and then failed to deal with them).

And now? So far, in Mail, I’m answering messages as they come in, and deleting all but the most salient. A client letter outlining technical requirements, I’ll keep. A bunch of messages asking whether we should meet at 9:00 or 10:00, I delete. I feel ten pounds lighter already. I’d like to thank God and the Academy.

[tags]Apple, Address Book, iCal, iPhone, Mail.app, design, interface design, UI design, software design, uidesign, Adobe, Microsoft, integration, suites, hardware[/tags]

ALA 241: better UI, scriptless trick ponies, and the deathly hallows

In Issue No. 241 of A List Apart, for people who make websites:

Never Use a Warning When you Mean Undo

by Aza Raskin

Are our web apps as smart as they should be? By failing to account for habituation (the tendency, when presented with a string of repetitive tasks, to keep clicking OK), do our designs cause people to lose their work? Raskin’s simple, foolproof rule solves the problem.

Conflicting Absolute Positions

by Rob Swan

All right, class. Using CSS, produce a liquid layout that contains a fixed-width, scrolling side panel and a flexible, scrolling main panel. Okay, now do it without JavaScript. By chucking an assumption about how CSS works in browsers, Rob Swan provides the way and means.

Plus, in Editor’s Choice, from 23 November 2001:

Reading Design

by Dean Allen

With so many specialists working so hard at their craft, why are so many pages so hard to read? Unabashed text enthusiast Dean Allen thinks designers would benefit from approaching their work as being written rather than assembled.

A List Apart explores the design, development, and meaning of web content, with a special focus on web standards and best practices. Explore our articles or find out more about us.

[tags]alistapart, aza raskin, rob swan, dean allen, UIdesign, undo, CSS, absoluteposition, liquid layout[/tags]

Let there be web divisions

We are still crunching numbers on the Web Design Survey—with over 32,000 responses to 36 questions, there’s a lot to crunch. But in one area, preliminary data supports what anecdotal experience led us to expect: almost no one who makes websites works in their company or organization’s web division. That’s because almost no company or organization has a web division. And that void on the org chart is one reason we have so many bloated, unusable failures where we should be producing great user experiences.

Ponder. No matter how critical the web experience may be to the organization’s mission, the people who design and build those mission-critical sites work in divisions that have nothing to do with the web, and report to leaders whose expertise is unrelated to web design and development.

It’s a startling fact with profound implications—and as such has gone unnoticed by the business community and press.

IT or marketing

From law firms to libraries, from universities to Fortune 500 companies, the organization’s website almost invariably falls under the domain of the IT Department or the Marketing Department, leading to turf wars and other predictable consequences. While many good (and highly capable) people work in IT and marketing, neither area is ideally suited to craft usable websites or to encourage the blossoming of vital web communities.

Competent IT departments handle a dazzling array of technical challenges requiring deep, multi-leveled expertise. But tasks such as equipping 20,000 globally dispersed employees with appropriately configured PCs, or maintaining corporate databases and mail gateways, don’t necessarily map to the skills required to design great user experiences for the web.

Large-scale systems expertise takes a different mindset than what’s needed to write usable guide copy, finesse markup semantics, or design an easy-to-understand user interface employing the lightest and fewest possible graphic images. Moreover, nimble development and support for open standards are not the hallmarks of large IT departments (although undoubtedly there are noble exceptions). Additionally, developers with a background in IT (again, with some exceptions) tend to create from the point of view of technology, rather than that of the user.

What about Marketing?

Organizations that don’t entrust their website to IT tend to hand it to Marketing. The rationale for doing so is easy to see: Marketing has been briefed on the organization’s business goals (at least for the next quarter), and the division is staffed by communications specialists who know at least something about writing and art direction. If nothing else, they know who to hire to write their copy, and they are comfortable telling the in-house graphic designers to make the logo bigger.

Like IT, Marketing has valuable organizational knowledge (plus certain skills) to contribute to any serious web enterprise. The leaders of Marketing, like the leaders of IT, should be frequently consulted in any web effort. But the skills of Marketing, like the skills of IT, don’t necessarily map to what is needed to create great web experiences.

For one thing, as anyone reading this knows, the web is a conversation. Marketing, by contrast, is a monologue. It can be a great monologue—for examples of which, see The One Show Winners or the AIGA Design Archives. But a monologue and conversation are not the same, as an hour spent with your windy Uncle Randolph will remind you.

And then there’s all that messy business with semantic markup, CSS, unobtrusive scripting, card-sorting exercises, HTML run-throughs, involving users in accessibility, and the rest of the skills and experience that don’t fall under Marketing’s purview.

If not them, then who?

Business and non-profit decision makers, for your users’ good, consider this request. Stop separating the members of your web team. Cease distributing them among various (often competitive) divisions led by people with limited web expertise. Let the coders, designers, writers, and others charged with creating and maintaining your web presence work together. Put them in a division that recognizes that your site is not a bastard of your brochures, nor a natural outgrowth of your group calendar. Let there be web divisions.

[tags]webdesign, webdevelopment, design, development, web divisions[/tags]