[Skip to Contents]

Content and language (Writing for the Web)

Writing for the Web :

Listening to your webpage being read by a screen reader can be an educational experience. But this is not the only reason to modify one's writing style for the web. Reading from the screen is a different experience than reading from paper. Users often only scan text for interesting or relevant information rather than read it thoroughly. Therefore it is a good idea to break up text into smaller paragraphs, apply a logical order of headers and subheaders, and use bullet point lists.

Readability and 'scanability' can be increased by "front-loading" paragraphs, stating the topic of the paragraph in the first sentence, and by using a good amount of 'white space' on the page to separate chunks of text. Keep pages uncluttered and keep distractions to a minimum.

Here are some tips:

  • give documents a meaningful page title.
  • keep paragraphs short.
  • limit each paragraph to one main idea.
  • highlight keywords.
  • use meaningful headings and sub-headings.
  • use bullet lists.
  • use clear and simple language.
  • avoid or explain technical jargon.
  • avoid the passive voice.
  • use spell and grammar checkers (eyes often compensate for spelling errors, screen readers don't).
  • indicate language changes (see below).
  • be aware of sensitive cultural issues.
  • label abbreviations and acronyms and ASCII art (see below).
  • provide alternatives to auditory and visual content (see chapter on Multimedia).
  • mark up documents with proper structural elements (see chapter on Structural mark-up).
  • give links descriptive titles (see chapter on Usability).
  • be consistent with link colours.
  • avoid underlining. It is understood as an indication for a hyperlink.

Don't use 'Click here'

Avoid the phrase "Click here", as it is not very descriptive. There are endless alternatives to using this phrase.

Learn more.

Abbreviations, acronyms, ASCII art :

<abbr lang="la" title="et cetera">etc.</abbr> <acronym title="Cascading Style sheet">CSS</acronym> <acronym title="smiley">:)</acronym>

The ABBR and ACRONYM tags are only supported by the latest standard-compliant browsers (see the chapter on Standards). They are simply ignored by older browsers. Up-to-date browsers and screen reader software will, however, make good use of these tags.

Hover your mouse pointer over the following acronym: WAI

In a standard-compliant browser a tooltip should pop up displaying the content of the title attribute: 'Web Accessibility Initiative'. In addition, Mozilla and Netscape 6 show a dotted line under the acronym to indicate that there is more information available. Screen readers will read out the content of the TITLE attribute.

The first time an acronym appears on a page it should be fully and visibly expanded :

  • Web Accessibility Initiative (WAI)

Learn more about the use of and the differences between abbreviations and acronyms at Evolt.org: HTML is not an acronym...

Globalization, localization, language changes :

An important issue to consider is that of globalization and localization. The web revolution has spread to non-english speaking countries, which has triggered a variety of debates about multilingual web design.

In terms of accessibility it has become important to state the language of a document and to announce language changes within a page to avoid getting users of screen readers confused. Screen readers will switch to the according language where required.

The language of a document can be declared by including the LANG attribute in the HTML tag:

<html lang="en">

...by including the appropriate meta tag:

<meta http-equiv="Content-Language" content="en-gb">

Language changes within text can be specified as follows:

<span lang="fr">raison d'être</span>

A useful resource:
Code for the Representation of the Names of Languages [Open link in new browser window.]

Learn more :

A list of relevant links can be found in the Resource section.

Usability

| Access Guide Home | Table of Contents | Definitions | Glossary |