Writing for the web

The rules

  • Structure using major and minor headings, subheadings (H1-H4 tags in HTML)
  • brief, Meaningful titles, headlines and taglines
  • Use less words (50%)
  • No unnecessary adjectives
  • Graphics: relevant and quick-loading
  • Relax: be less formal
  • Use bullet lists (like this one)
  • One idea, one paragraph
  • Supporting content on secondary pages
  • check spelling and grammar
  • use the 'Inverted Pyramid':
    1. conclusion
    2. supporting arguments and examples
    3. background

A web page is not like a print page

People read printed pages but 79% scan web pages. Why?

Dots on computer screens are harder to read than ink on paper.

Web sites are harder to browse than printed matter (books, magazines, leaflets, newspapers).

Sometimes people are looking for a long article with lots of detail and supporting discussion. When they find it they often prefer to print it off and read it like a book. It's uncomfortable to read text on screen; scrolling and clicking to move around the text is harder than scanning and flipping printed pages.

People usually find web pages from a search engine (Yahoo, Google, MSN, etc.) The search results display the page title and some summary information. Make sure these titles and summaries make sense on their own.

The search engines send out robots to "spider" the web: scanning pages for content they can index. Robots don't see everything a human can, so make sure your page looks good to a robot. If your page makes no sense without the images then the search engine won't value it. Generating lots of text or links from a client-side script (like JavaScript) is also invisible to robots. It also makes the page inaccessible to humans who need reader software.

Using a word processor for web pages

Web development tools are not geared to producing fine writing. Unless it's a trivial fragment, you should use a word processor to get the text right before you turn it into a web page.

  • Do use the spelling and grammar checker
  • Do use the Heading Styles (H1 to H4) to structure
  • Do use bullet lists
  • Don't use the font controls (font name and size)

You are using the Word Processor to get the words, spelling, grammar and structure right. That's why it's called a word processor. Let the CSS style sheet get the layout and presentation (colours, text size, margins etc.) consistent across the web site.

You can cut text from your word processor and paste into our Whizzywig web based rich text editor. Whizzywig will get rid of most of the useless HTML the word processor inserted. Click Show HTML to see the resulting HTML.