The Elements of Style for Designers

With some exceptions, what is good for words is good for pictures too.

The creative act of writing is always bounded a bit by the audience: journalism is not writing a novel. The same can be said of design: it is not art. Yet the materials are the same—words and pictures—and it is no big surprise that what is good for fiction is good for nonfiction. The surprise comes when one discovers that, with some exceptions, what is good for words is good for pictures too. And thus we discover The Elements of Style is just as relevant for young designers as for young writers.

E.B. White finishes The Elements of Style with a “List of Reminders.” It could have easily been “Ten Rules for Clear Writing” or “A Writer’s Manifesto” or even “Hanging Commas 99% Bad” but he opted for the gentler term: reminder. He did so because rules were meant to broken—learned first, but broken. And so he reminds us as we innovate and play what those rules were in the first place, and reminds us that breaking a rule can sometimes be hard to pull off. In that spirit, I will try to translate his writing reminders into design reminders. After reading them, you can go off and exuberantly ignore them.

1. Place yourself in the background.
Write in a way that draws the reader’s attention to the sense and substance of the writing, rather than to the mood and temper of the author.

You’re the best designer in your graduating class; you had three job offers the instant you started looking. Now you are designing a bank site, and someone tells you to use blue. What do they know?

Of course you are good, but no one is so good that her whims should override the conventions and constraints of the design. Just because you have a flamboyant style doesn’t mean it is right for every project. If someone can spot a site and know it’s yours, perhaps you are getting in the way of the work.

2. Write in a way that comes naturally.
Write in a way that comes easily and naturally to you, using words and phrases that come readily to mind. But do not assume that because you have acted naturally your product is without flaw.

The seduction of fashion, the desire to impress or stretch your skills are all pitfalls unless you temper them with your natural skills and temperament. Still, talent is not enough.

3. Work from a suitable design.
Before beginning to compose something, gauge the nature and extent of the enterprise and work from a suitable design. … Design informs even the simplest structure, whether of brick and steel or of prose. You raise a pup tent from one sort of vision, a cathedral from another.

It’s worth saying twice, both in the thin book and in this article, because it is so often forgotten. Context is everything.

4. Write with nouns and verbs.
Write with nouns and verbs, not with adjectives and adverbs. The adjective hasn’t been built that can pull a weak or inaccurate noun out of a tight place.

The nouns and verbs of web design are objects and widgets. If you have chosen the wrong widget, no amount of help text or arrows will fix the issue.

5. Revise and rewrite.
Revising is part of writing. Few writers are so expert that they can produce what they are after on the first try.

It’s painful when a client or a boss rejects your first design. Sometimes that initial effort seems perfect. But revision is a way to reach a better design. Or sometimes—and only sometimes—shed light on the perfection of the first. When this odd event occurs, it’s best not to be upset because no one recognized your initial brilliance. Instead, remember that design is as much process as result, and part of your job is to get everyone participating in the design to the end goal.

6. Do not overwrite.
Rich, ornate prose is hard to digest, generally unwholesome, and sometimes nauseating.

Beware of gratuitous use of flash, AJAX, and gradients.

7. Do not overstate.
When you overstate, readers will be instantly on guard, and everything that has preceded your overstatement as well as everything that follows it will be suspect in their minds because they have lost confidence in your judgment or your poise.

How many Verisign and trustE logos do you need in your sidebar? How many awards plaques?

8. Avoid the use of qualifiers.
Rather, very, little, pretty—these are the leeches that infest the pond of prose, sucking the blood of words.

In web design, the “qualifiers” are often styling. Just because you can create your own look and feel for a scroll bar doesn’t mean you should. Many of the browser defaults work quite well; do not overburden your users with your desire to show off your mastery of CSS.

9. Do not affect a breezy manner.
The volume of writing is enormous, these days, and much of it has a sort of windiness about it, almost as though the author were in a state of euphoria. “Spontaneous me,” sang Whitman, and, in his innocence, let loose the hordes of uninspired scribblers who would one day confuse spontaneity with genius.

Here White speaks to fashion. Just because Jeffrey Zeldman did it doesn’t mean you should. Or Jason Freid. Or IDEO. When you see a hyper-simple site, or one with scrolling photos, or one with 64 point type, ask yourself if you can and if you should pull it off.

10. Use orthodox spelling.
In ordinary composition, use orthodox spelling. Do not write nite for night, thru for through, pleez for please, unless you plan to introduce a complete system of simplified spelling and are prepared to take the consequences.

White goes on to quote Strunk:

The practical objection to unaccepted and oversimplified spellings is the disfavor with which they are received by the reader. They distract his attention and exhaust his patience. He reads the form though automatically, without thought of its needless complexity; he reads the abbreviation tho and mentally supplies the missing letters, at the cost of a fraction of his attention. The writer has defeated his own purpose.

Web standards. Don’t Make Me Think. Pattern language. Enough said.

11. Do not explain too much.
It is seldom advisable to tell all. Be sparing, for instance, in the use of adverbs after “he said,” “she replied,” and the like: “he said consolingly;” “she replied grumblingly.”

A lesson I have learned by working with web search is: if you want people to notice something useful, the worst thing you could do is adorn it with lines, colors, or animation. A light touch actually indicates to users that this is worth paying attention to; blue and underlined is often the most effective. The most usable is often also the most used.

12. Do not construct awkward adverbs.
Adverbs are easy to build. Take an adjective or a participle, add -ly, and behold! You have an adverb. But you’d probably be better off without it. Do not write tangledly.

We can now invent widgets from anything. Anything on the page can open, close, launch, select. Sometimes it is the perfect metaphor for the job—such as clicking a thumbnail to see a larger image—sometimes it just bewilders. Do not design tangledly.

13. Make sure the reader knows who is speaking.
Dialogue is a total loss unless you indicate who the speaker is.

When you read a rapid-fire conversation in a book, often the author drops the “he said” “she said.” But have you ever had to stop and count forward from when quotes stopped being labeled? It is the same with design; it’s better to have a hint unobtrusively available than to ask your audience to memorize and track everything on the site. It’s always a thin line between assuming your audience is a pack of morons and expecting them to remember the shortcut key you offered on the homepage. Try to strike a sensible balance.

14. Avoid fancy words.
Avoid the elaborate, the pretentious, the coy, and the cute. Do not be tempted by a twenty-dollar word when there is a ten-center handy, ready and able.

Yup. Do I need to translate?

15. Do not use dialect unless your ear is good.
Do not attempt to use dialect unless you are a devoted student of the tongue you hope to reproduce. If you use dialect, be consistent.

Are you imitating an established style? Be sure that you understand it, and that you can keep it going throughout. The Onion is the reigning king of this proposition; their adherence to being a respected newspaper goes beyond the content to the design.

16. Be clear.
Clarity is not the prize in writing, nor is it always the principal mark of a good style. There are occasions when obscurity serves a literary yearning, if not a literary purpose, and there are writers whose mien is more overcast than clear. But since writing is communication, clarity can only be a virtue.

Clarity can only be a virtue. Tape that to your monitor.

17. Do not inject opinion.
Unless there is a good reason for its being there, do not inject opinion into a piece of writing. We all have opinions about almost everything, and the temptation to toss them in is great. To air one’s views gratuitously, however, is to imply that the demand for them is brisk, which may not be the case, and which, in any event, may not be relevant to the discussion.

You ought not say anything if you can’t say anything nice. Stick to the minimum to make your point. Just because you don’t want that item on the homepage doesn’t mean you have to make it khaki.

18. Use figures of speech sparingly.
The simile is a common device and a useful one, but similes coming in rapid fire, one right on top of another, are more distracting than illuminating.

Pick your poison: replace the term “similes” with “photos,” “diagrams,” “giant fonts,” “orange,” and so on …

19. Do not take shortcuts at the cost of clarity.
Do not use initials for the names of organizations or movements unless you are certain the initials will be readily understood. Write things out. Not everyone knows that MADD means Mothers Against Drunk Driving, and even if everyone did, there are babies being born every minute who will someday encounter the name for the first time.

How many folks label a button “go” because they haven’t much space, or worse, remove the submit button completely because “everyone” knows you can just hit enter. Bite the bullet and redo the design, and make it clear.

20. Avoid foreign languages.
The writer will occasionally find it convenient or necessary to borrow from other languages. Some writers, however, from sheer exuberance or a desire to show off, sprinkle their work liberally with foreign expressions, with no regard for the reader’s comfort. It is a bad habit. Write in English.

The showy “foreign language” of the web is the language of early adapters. Really, not everyone uses del.icio.us, flickr, Google Earth, and not everyone speaks the language of their interfaces. Be cautious in your adoption of new paradigms.

21. Prefer the standard to the offbeat.
Young writers will be drawn at every turn toward eccentricities in language. They will hear the beat of new vocabularies, the exciting rhythms of special segments of their society, each speaking a language of its own. All of us come under the spell of these unsettling drums; the problem for beginners is to listen to them, learn the words, feel the vibrations, and not be carried away.

In art school, I was asked to copy master works. I didn’t understand why, until I began copying them; when you imitate you do actually learn. You don’t just copy, you understand why the brushstrokes went left then right, you know why bright green was used in a face. And when writing, I always wrote with the voice of whomever I was reading. Hemmingway made me economical, Salinger verbose.

When you work you can try on many hats but in the end, you have to find a way to once again hear your own voice and see your own design.

Your turn
These reminders are just the beginning. Try adding your own as you learn hard lessons, try collapsing some of his into a simpler reminder set. I often use “clarity, brevity, concreteness” to remind myself what I want from my work. It’s up to you to take from this source, or any other source, and incorporate it into your style and your approach.

I’d like to invite all of you now to share the interpretations or lessons you’ve learned that would enhance a list of reminders for designers. No one has all the answers, but by being open to learning from others we can all get a little better.