Writing for the Web

Graphic designers get highfive.com, id, must-c, and Communication Arts. Programmers get webreference.com, webmonkey, and Web Techniques (and that’s just a few of the W’s). Even entrepreneurs get online and printed pubs aplenty. But look for a tutorial or an awards showcase dedicated to online writing, and you’ll find nary a word. We aim to change that.

When Brian and I launched the original LIST APART in January ’98, we had two goals: to create a noise-free, high-level discussion list for the web; and to cover all the bases of webmaking—from pixels to prose, coding to content. Posts in the digest have begun that work. It continues with this article, the first in a series.

The scarcity of online writing about online writing is baffling when you consider that most websites consist of words. The web was built with hypertext, not hypergraphics. Most people use the web to get information (stocks, news, sports scores: words). A smaller audience enjoys creative web content (entertainment sites, game sites, personal storytelling sites like The Fray).

Design gives a site its space and contributes to its identity; coding gives it application-like power; multimedia objects can enhance a site or provide its focus. But most sites are built to deliver WORDS.

In this article, we’ll talk briefly about two tiers of writing that go into every site: the much-neglected navigational text I’ll call Guide Copy (which includes the art of naming) and the primary content itself.

Navigating the Navigation#section2

A lot of the writing on the web falls under the heading of navigational text, or “guide copy,” by which I mean the words that guide you through the site. There’s an art to this kind of writing. It’s neither journalism nor advertising, though having a background in either (or both) may help.

No other medium requires this kind of writing. Magazines don’t have to explain their table of contents. Books don’t explain their linearity. We understand the conventions in these media.

But every website is someone’s idea (or some group’s idea) of what the web is supposed to be. So unless it’s trying to be cryptically arty, the interface needs to explain itself, not only with intuitive graphic elements, but also with words.

Before you even get to any “pure” writing which may live on the site, you need to tackle this issue of Guide Copy.

Successful guide copy will work on two levels. First, it must do its job of helping visitors find the content they seek. If it fails there, it is useless. But good Guide Copy will also set the site’s tone and reinforce its overall brand or identity.

On an entertainment site, it will entertain. A comic site requires comic text; a site devoted to a serious issue must convey that seriousness with every carefully-chosen word. A rap music site should not sound like it was written by a white man from Darien, Connecticut. A web design firm attempting to excite potential clients with Flash or Java applets should not bore these clients to death with account-speak penned from the self-important perspective of the company CEO.

Guide copy can shape and focus a site. Batman-robin.com was divided into satellite sites, one for each main character (MrFreeze.com, Robin.com, etc.). There was no primary writing to speak of; each satellite site presented a variety of photographs, storyboards, and multimedia files related to its character.

To bring these disparate elements to life, I wrote each site in the voice of its character. Mr Freeze was written as if Arnold was speaking the lines. At the top of his photo page, he might say, “Don’t hate me because I’m beautiful.” He made bad puns, just like the movie character. He was sullen and bragadacious. Likewise, Batgirl was written in the voice of that character (crossed with a web grrrl’s diary page) and so on.

This approach transformed the potentially dull experience of reading “click to download the 3-D image file” into something entertaining and cohesive. It wasn’t great literature, but it enhanced the site’s entertainment value.

I’m currently working on another movie site involving mobsters and psychiatrists. Think of the rich comic potential of those two worlds. Think of the fun for the writer (and hopefully, the reader), presenting a photo gallery in gangster-speak, or building an interactive engine that lets you talk to a therapist.

Bad Guide Copy, of which we get too much, ignores these issues. Good Guide Copy embraces them. In fact, this principle should drive all the writing on any website.

A Serious Plea for Lightness#section3

Lightness and wit are often key. Not in an extended story or a news article of course; but in Guide Copy, and in longer, technical passages, wit is often needed to help the medicine go down. We need to come at it a little sideways, we need to entertain, lest we put our readers to sleep – or encourage them to leave before our exciting graphics have downloaded.

What is acceptable in print can be dull as death on the web. It’s the 3-minute pop-song mentality. Shorter attention spans need quicker punchlines. Fast, witty, out.

Just because text is serving a utilitarian purpose – or the subject is technical – does not mean it should be dull.

On The Web Standards Project, we talk about a serious issue affecting every web builder. As the site’s designer and copywriter, I didn’t dare touch the group-approved mission statement or things of like nature. But wherever I could, I put in those “touches” that liven things up: little phrases, little grace notes, off-the-wall things to keep the momentum going, and help the reader relax.

Because XML and the Document Object Model are not most people’s idea of a picnic, it’s important to coax a relaxation response from the reader … something that helps them say to themselves, “this isn’t so bad, I’ll keep going. I can understand this.”

The Art of Naming#section4

God gave Adam the pleasant task of naming all things. On a website, this task falls to the writer. Good names enhance the total experience of the website. They reinforce the brand identity, they drive home a metaphor (without overdoing it), they entertain and entice.

The Icon Factory is a popular Macintosh icon site whose creators understand this principle. A simple metaphor makes for intuitive navigation while enhancing the site’s sense of fun (and something would be very wrong if an icon site had no sense of fun). New icons are displayed in the Showroom. Older icons are archived in the Warehouse. Visitors send their feedback to The Foreman. The metaphor is a natural – almost a no-brainer.

Good metaphors and good names are like that. They just work. They seem as if they just sprang up on their own. Of course a lot of work goes into them first. And for metaphors to work well, they need to evolve while the site is being planned. If you think about it for longer than a second, you realize that the site’s flowchart and its names evolved simultaneously. Writing is no more an afterthought than design. To work together, writing, navigation, and design must evolve together.

Nearly all corporate sites commit the sin of dullness in their writing. It’s as if the clients and their consultants have finally understood that “design is important” – and nothing else. Maybe some designers can’t write, or maybe they can’t afford a writer. If you can’t write well, then writing is not the place to skimp on your budget. If your graphics are lovely but your words are dull, the whole effort will just lie there like a plate of jello.

Look at all the corporate sites that say “ABOUT OUR COMPANY,” “ABOUT OUR PEOPLE,” “ABOUT OUR PRODUCTS.”

As a reader I say, why should I care about your company and about your products? Seduce me, entice me, entertain me. Don’t be cryptic, don’t be stupid, but above all, don’t be dull.

How interesting are shoes? In a Nike ad, they’re pretty interesting. Nike doesn’t say “about our shoes.” When you’re writing for the web, you have to think like a writer, like an advertiser, like a snake-charmer, like a seducer.

Build a metaphor but don’t flog it to death. The Web Standards Project’s news may be “the latest buzz,” but its core page is the core page – not “the Hive.” Metaphors become silly and amateurish when overwrought. Use with discretion.

And now that you have all that guide copy and all those names, let’s cut to the content itself.

A Short Note on Brevity#section5

Most of the time, an acceptable print paragraph is too long for the web.

It’s a retinal thing. We can stare at a well-designed book for hours without eye fatigue. Staring at a monitor is different. The eye needs to move, to fight that fatigue. So we break longer paragraphs into shorter ones. It’s the same content, spaced differently.

Even writers who are not designers must be mindful of this. In that sense, they have to think like designers to some extent. (Or their editors do.)

The Fray does a good job of breaking text into useable chunks. So does Webmonkey. Many sites do not. Look at the ones that do it right, and apply their lessons to your work.

Along with brevity, it’s important to nail your beginnings and endings.

Now, with leisurely forms, like the novel, you can be more relaxed: “Sunlight fell gently across the veranda …” and all that. Sunlight can keep falling across that veranda for at least the first few pages, if the reader has reason to trust you. (They may trust you because of your previous book, reputation, command of language in the opening sentences, great review.)

With popular fiction, airport novels, you don’t have that kind of luxury. You need something like “The last time I saw my father, he was begging me not to kill him.”It’s like a mechanical hook to grab the attention of the less committed reader. My old writing teacher, John Casey (Spartina), described this kind of writing as “low, vaudevillian cunning,” and to some degree all writing requires it, genre stuff more so (just as genre films have to start with jailbreaks, murders, car chases, and impromptu sexual encounters).

Because of the nature of the medium, most longer-form writing for the web has to work the way airport novels do: grab that distracted reader before she clicks to another site.

There are no rules, of course, and there are many kinds of online writing, but generally speaking, it’s best to think of that mouse, so conveniently located by your reader’s hand. She’s just dying to click it and go somewhere else. If your design is ugly or amateurish, you will lose her right away. And similarly, if your opening remarks meander, she’s likely to meander herself – right over to Yahoo.

We’ll have lots more to say on this subject soon. For now, let us hear from you.