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:
- Users have to read from a computer screen, which is more difficult than reading print.
- Users are likely to be wanting information very quickly; they will be less patient.
Reading from screen
It is currently more difficult to read from a computer screen than from paper.
- Computer screens have a resolution of approximately 96 pixels per inch, whereas books are printed with around 2400 dots per inch and even laser-printed documents have 600 dpi or better. This means that text on a computer screen is less well-defined and not as accurately spaced.
- Computer screens do not have as much contrast between the text and the background colour as paper. Again, this makes it more difficult to distinguish words.
- The glare from screens may irritate eyes. Other common problems are flickering, fuzziness, reflections, interaction with fluorescent lighting, etc. Paper suffers from none of these problems.
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.
- They are more likely to be searching for a particular piece of information.
- They may not know whether your site has the information they seek; they will want to find out as soon as possible so that they can go elsewhere if need be.
- They may be looking for a single piece of information, uninterested in anything else your page might contain.
- In some countries users may be paying per-minute for Internet service, which naturally adds a certain tension.
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.
- Use a simple, brief style of writing.
- Avoid sidetracks and irrelevancies: if you were going to put something in brackets, it probably isn't necessary at all.
- If only a small minority of users need certain information, link to that rather than including it in the page.
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:
- White space (gaps between paragraphs) gives the page a distinctive shape and helps the user to keep track of their place.
- Users need to keep less in their mind at once.
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:
- Users want to get to their information quickly and easily, not have to try every single option to find where it might be.
- The Web is international, and foreign users might have difficulty understanding non-literal text; it's vitally important that they can at least follow the navigation.
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:
- Academic papers include an explicit "abstract" section before the text, usually of around 100-250 words.
- Stories from press agencies (Reuters, PA) are always summarised in their first sentence.
- Articles in magazines often begin with a summary paragraph in larger type.
- Another magazine technique is "pullquotes" (quotes taken from the text of an article, printed in a large font intended to catch the eye of potential readers). These are intended to summarise the content of the story, although they're not as detailed as traditional abstracts.
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:
- Why the user should read the article.
- Why the user should not read the article.
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:
- email (e-mail is acceptable, E-mail and Email are not)
- Web (web is acceptable)
- Internet or Net (net and internet are acceptable)
- intranet (Intranet is not acceptable)
- Web site (Web site and web site are acceptable, Web site is not; internet site is not if you're talking about a Web site)
Consistent phrase types
Headings and list bullet points should be consistent with each other. For example, this list is particularly poor:
- an item
- Another item
- A third item.
- inconsistently.
- item 4
- blue
- What about all the other items?
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
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:
- The BBC's web designers smoke really high-grade crack.
- Lawyers made them do it.
Wired News
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):
- I studied at Durham University. [Link to university's site.]
- I studied at Durham University. [Link to a page about the town.]
- I studied at Durham University. [Link to a page about studying in general.]
- I studied at Durham University. [Link to a page about studying at Durham University - this is getting a bit long, so it could also have been just the word "studied" again.]
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.
- Durham University - a well-respected university in North-East England; situated in probably the most picturesque university town in the country.
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:
- The technique can confuse users who are new to the Web
- Both major browsers allow users to open any link in a new window if they choose, so why not leave the decision to users?
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.