Printable version of lesson; return to section index when finished.

Writing

Introduction

Writing on the Web is not the same as writing for print; users have different attitudes and also have more difficulty reading from the screen.

Because of this, web sites need to be more concise than printed material, and need to support more flexible reading strategies; it cannot be assumed that users will read the entire text from beginning to end. Web sites should also make it easy for users to tell when material is relevant to them, and when it is not.

Quality of writing in a traditional sense (spelling, punctuation, grammar, etc.) is as important on the Web as in print.

Finally, writing on the Web should include hyperlinks where appropriate. We consider what to link (anything users might want more information about), how to indicate that it's a link (by highlighting the appropriate part of a sentence), and where best to place the link (usually within text rather than in a sidebar).

Differences from print

Writing on the Web should be approached differently from writing for print, even when giving the same information. There are two main reasons for this:

Reading from screen

It is currently more difficult to read from a computer screen than from paper.

These disadvantages combine to make reading text from a screen more difficult. Users will read more slowly and most will find the process less pleasant.

(You might personally think that these disadvantages don't affect you. Personally, I certainly read more text from the screen than from paper, and don't notice my difficulty reading it. However, if an experiment were conducted, it would almost certainly show that I read on-screen text more slowly.)

Although new display technology might reduce these problems, most people will be using standard cathode-ray or (at best) LCD displays for at least the next two or three years.

Impatient users

On the Web, users are more likely to be impatient than when reading print material.

Concise text

Because users have to strain to read on-screen text, you need to make life as easy as possible for them. This can be achieved by adopting an appropriate style of writing; by going through what you've written afterwards to cut it down; and by keeping sentences and paragraphs short so that there are plenty of breaks for the reader.

Keep it short

Keep text to the minimum that will get your information across.

Break text into small focused chunks

Try to keep sentences and paragraphs short. Ideally, each paragraph should get across a clear point, and each sentence should cover one aspect of that point.

This makes text easier to read because:

Using this kind of structure also helps users to get a single piece of information if they wish, without having to read through the entire page in detail.

Don't rely solely on paragraph text

In many cases, a paragraph of text is not the most efficient way to get information across. Lists of bullet-points are often useful. Diagrams can also help.

These techniques should be used wherever they can help to reduce the amount of text needed. They also add variety to the page.

Cut, then cut some more

Even the best writers need to go back over what they've written to polish it. On the Web, you should concentrate again on reducing the amount of text. You can achieve this by simply rephrasing, or by changing the way the text is used (for example, by converting a complex paragraph into a list of a few bullet points).

Group exercise

Consider a site listing walks in the countryside. Each walk includes a route description, map, etc. and is on its own page.

One walk description might contain the sentence: "This nature walk is two miles in distance and is suitable for everybody except wheelchair users, for whom no access is provided."

In the group, try to rephrase that information more concisely.

One possible improvement to that sentence would be to move it to the top of the page, beneath the title or other information about the walk. It could then read "2 miles. Suitable for all, but no wheelchair access," which is less than half as long.

Another possibility would be to include "distance" and "suitability" as two standard pieces of information for each walk, rather than phrasing them as sentences.

Break these rules

Following these guidelines will probably improve most "information" sites. Obviously they should not be used rigidly; for example, there may be times when a sentence can be far more elegant if it includes a few extra words.

If a site is primarily intended for some other purpose (e.g. entertainment), however, then a different style of writing might be more appropriate.

Navigational text

As well as text for the content of the site, you also need to decide on navigational text such as section names, story titles, etc. This is important because users need to understand it so they know what to click on to get to a relevant story.

Clarity over cleverness

You might have ideas for clever section names - using puns, or basing your site around some kind of bizarre metaphor.

This isn't a good idea for most sites:

On some entertainment sites, the use of metaphor might be appropriate (for example a film web site might have a section where you can watch trailers; this could be called "screening room" rather than "trailers"). Even here, though, it's questionable unless the metaphor is fairly clear; the entertainment is supposed to be the site's content, not some hide-and-seek game to find it.

Brevity

Section names and other link titles often need to be very short. Even if they don't need to be short, it's usually good practice to keep them so.

There isn't a magic way to achieve this, although you can begin by removing all words that don't add to the meaning (for example particles like "the"). You can see examples of the technique in newspaper headlines.

If you really can't compress a title enough to fit in the available space, you might have to resort to using abbreviations. Hopefully, when this is necessary, you can also include the full version of the title for use everywhere that it will fit.

Skimming support

Users are likely to skim through web pages in search of relevant information. You should make this as easy as possible.

Relevant techniques include the use of subheadings and highlighted words. Breaking up the text into many paragraphs (discussed previously) also helps.

Subheadings

Including frequent subheadings in your text - up to one per paragraph - can make it very easy to skim documents.

The subheading for each subsection (group of paragraphs) should indicate clearly what the paragraphs are about. It can be a useful feature even for those who read the entire text, because it sets their thoughts in the context of what's about to be discussed.

Highlighted words

Some sites highlight particular words so that the information can be directly accessed that way - users can skim the page looking at highlighted words and jump into a paragraph that contains what they're interested in.

This is particularly useful when there is a regular system so that it's clear what will and won't be highlighted. Users then understand what to look for, and whether they can use that access method to get what they need.

DVD File

http://www.dvdfile.com/news/editorial/

This site is about films released on the DVD video disc format that's currently replacing VHS and laserdisc. The site's main feature is a news column with daily updates.

The column contains a lot of text, but it's been made suitable for skimming using both techniques above. Each paragraph or few paragraphs constituting a news story or topic have their own small subheading. And film titles are always highlighted in bold so that those interested in a particular film will notice right away if there's relevant news.

Abstracts

Abstracts are brief summaries included before longer texts.

Most long sections of text should begin with an abstract in some form. Including an abstract allows users to decide immediately whether the text is relevant to them.

Including an abstract

There are different styles of abstract. Here are a few:

These styles are equally valid and will be appropriate in different situations - most web pages do not need a 200-word abstract!

Good abstracts summarise the entire content of the article or text, including any conclusions. Although it's obviously necessary to decide what to leave out, a general guideline is that if you're leaving anything out purely because you want people to read the article to discover it, then it should be included.

As an example, this page itself begins with an abstract. That abstract summarises three things: basic information (description of abstracts), conclusion (long sections of text should begin with an abstract), and reasoning (abstracts let users decide whether documents are relevant).

Reasoning for abstracts

Abstracts are necessary because they help impatient users to make the "read/don't read" decision quickly.

An abstract should (implicitly) answer two questions:

In addition to this primary use, an abstract also helps those who do decide to read the article. (You're probably familiar with the "say what you're going to say; say it; then say what you said" doctrine of presentations; the abstract provides the first part of that in written text.)

Quality

A generally good standard of writing is desirable for Web sites; spelling and grammar errors (or typos) are distracting and should be kept to a minimum.

Be honest with yourself. Unless your English is very good, get somebody more language-minded to check your site over, preferably before it goes live. Even if you are near-perfect, it's best to get somebody else to check: most people are very bad at spotting their own mistakes.

Finally, I should note that anybody attending my class who writes "it's" when they should have used "its" will be summarily executed.

Consistency

Consistency is perhaps the most important concept of design in general, and writing (which would probably be called "text design" if it were a less ancient profession) is no exception.

Inconsistent use of terminology can actually confuse readers; some other consistency issues are just ugly.

Terminology

If you use any technical terminology in your writing, it is vitally important to be consistent. For example, in a project I was involved in at work, we were at one point using the word "channel" to mean three different things! (We've now got rid of the things that I called channels, come up with another name for the things that somebody else was calling channels, and told the third person to shut up about the things he called channels.)

One frequent case of this problem in Web sites is when referring to the site itself. People often have problems with "page" and "site", or "page" and "section", etc. Whichever definitions or names you use for these things, stick with them throughout the site.

Internet style

Various words can be spelt in different ways. Your page will look more professional if you're consistent.

Internet-related words seem particularly susceptible to this problem. My personal opinions (not universal facts!) about the "correct" alternatives for a few of these are:

Consistent phrase types

Headings and list bullet points should be consistent with each other. For example, this list is particularly poor:

All those items are inconsistent with each other. Some are capitalised; some have a full-stop; some include 'a' or an equivalent; some do not fit in the same place within the sentence ("inconsistently", "blue", and the full sentence are different from the "item"s and each other). This is bad style and should be avoided.

(On this site, you might notice that I haven't been able to remain consistent with the style of headings. As I mentioned in the introduction, this isn't an example of a perfect web site.)

Hyperlinks

An important part of writing on the Web is the use of hyperlinks. (I'm not talking here about links that are part of the site's navigation, but about links that are relevant to an individual piece of content and are most appropriately seen as "part of" the content.)

The destination of these links should be clear. Mostly this can be achieved by following some simple standards; it's also possible to be more explicit in various ways.

What should be linked?

If users may want to go to another Web site (or another page within your own site) based on something you have written, then you should provide a link.

For example, if you mention any companies or organisations, you should link to their sites (you needn't link from every mention, just the first one will do).

As another example, if in a Web site of country walks, one walk's page included the sentence "Like the walk at nearby Spurn Point, this can be windy at times" - referring to another walk covered on the site - then that should also be a link.

Inline or sidebar links

Some sites don't place links in the main text of their story. Instead, they hide links in a sidebar or a references section at the end of a document, even if those links were relevant to a particular part of the document.

It is sometimes claimed that if a user follows the link then they'll lose the thread of the current document, so links should be placed at the end. This is silly. Users are not forced to follow a link, and they can leave it to the end if they like. It's only courteous to give them the choice.

BBC News

http://news.bbc.co.uk/

Within each story, the links relevant to that story - even obvious links like names of organisations - are hidden in a sidebar which might easily be missed. My train of thought is usually disrupted when I read an article and come across something which ought to be a link but isn't...

There are two possible explanations for this behaviour:

Wired News

http://www.wired.com/

In Wired News articles, the relevant organisations are linked within the text. There are also references at the end of the document, but this is an example of a different and useful technique ("if you were interested in this, you might now be interested in these") which is probably most appropriate at the end of a document.

What text should you link?

Avoid linking text like "Click here" unless you write advertising copy. Apart from making little sense for users of text-only or speech browsers, this gives an amateur feel to the site, and is often used as a substitute for actually describing the link.

Try to keep links brief but descriptive. If links are included within text, simply pick the words that describe the link. Some examples (most of the links do not actually work):

If links are separate from the text, for example at the end of an article or on a separate links page, it's standard to link the title of the web site, and then include a brief description.

Opening new windows

It is possible to make links open in a new browser window instead of in the current window, by setting the target attribute of the <a> tag to "_blank".

<a href="target.html" target="_blank">link text</a>

(This works for most web browsers, but not on devices which don't support multiple windows like WebTV or text/speech browsers.)

Occasionally there are good reasons for doing this, but most sites do it simply to keep users on their site, which is a bad idea:

Indicating link targets

Some Web sites give more information about where the link goes.

A small icon by the link can indicate whether links are internal (within the site) or external (outside the site). Similarly, an icon could indicate whether the link will open in a new window or an existing one (or better yet, could give a choice).

Some Web sites also change the text in the browser's status bar to describe the link. This is normally a bad idea because experienced users often want the URL in the status bar in order to find where they're going. Less experienced users never even look at the status bar, because it's miles away from everything else.

Appropriate links

Group exercise

Each person in the group should write a sentence about some topic. The sentence should contain something (an organisation, a type of object, a person, etc.) which might be linked. Indicate which text would be part of the link by underlining it.

Discuss it in the group to see whether you agree with the choice.

Summary

Writing for Web sites is not the same as writing for printed documents. Users read more slowly and have less patience for text.

Concise

To accomodate users, text on Web sites should be concise. Jakob Nielsen suggests writing 50% less text than you would write for printed material.

Structured

Web site text should be carefully structured into small sentences and paragraphs, perhaps with frequent subheadings to better support skimming the information.

Summarised

An abstract in some form should summarise the content of longer articles so that users can decide whether or not the article is appropriate for them. The abstract should be aimed to help them make that decision - not to encourage them to read the article.

Consistent

Text should be consistent, especially in its use of specialist vocabulary.

High-quality

Web sites should always be proofread by somebody who has a good grasp of English.

Hyperlinked

Links should be included within text wherever appropriate.

References

Writing for the Web (a Roundtable Discussion)

http://home.netscape.com/computing/webbuilding/studio/feature19980827-4.html

An interesting discussion between leading Web designers and Web writers - some worthwhile insights from the professionals.

Be Succinct! (Writing for the Web)

http://www.useit.com/alertbox/9703b.html

Jakob Nielsen's take on writing for Web sites. He recommends writing 50% less text than you would have written for a hardcopy presentation.

Writing for the Web

http://www.alistapart.com/stories/writing/index.html

Zeldman's article on the "A List Apart" webzine has general discussion of the topic.

How to Write Effective Text

http://www.efuse.com/Design/effective_writing.html

A how-to guide to writing text for Web sites, in some detail (but suitable for the beginner).

Web Writing Style Resources

http://www.cio.com/central/style.html

Links to a collection of writing style guides available on and for the Web.