Writing for the Web
Tests have shown that the speed for reading on screen is 20 - 30% slower than it is for print and the reader reads with less concentration and accuracy.
When users are tested via eye tracking it shows that they scan down a page rather than reading from top to bottom.
Your audience wants to find information quickly and expects it to be easy to read. In order to keep your audience’s attention you need to keep it short and stick to the point. To grab their attention make the copy easy to scan by using frequent sub headings and lists.
Writing Style and Tone
- Keep your writing informal and friendly with a conversational tone.
- Keep it precise and to the point, without embellishments.
- Use simple words.
- Short sentences.
- Include contractions.
- Stay with only one idea per paragraph.
- One main theme / topic per page.
- Do not start with a lot of background information and don’t include any unless it is really necessary.
- Do not use acronyms unless you are absolutely sure that all of your audience/users will understand them.
The Mechanics
- Relevant headers and sub-headers using headings (which you can style in CSS).
- Bulleted lists – more than you would use for print.
- Underlined links. Keep in mind that links within the copy, will stop the flow of reading so keep them to a minimum.
- Any text under 16px must be san-serif. Are Your Fonts Always Welcome.
Although it is easy to read print when the fonts are serif, sans serif are easier to read on a screen. - Use ems instead of px then your text will resize according to your user’s requirements.
- Increase leading. Leading is the space between lines of text and can be controlled
in the CSS by the line-height property. - Use negative space (white space) on the page to give the text breathing room. In the Css use padding on your div and margins around images.White Space from A List Apart
- Avoid using all upper-case in the body text because it reduces readability.
- You can use larger or a different colored text within the copy to make a point but you use the <strong> and <em> tags for section 508.
- Use columns to control text width.
- Don't indent at the beginning of paragraphs.
- Use blockquotes for quotes.
- Use smart quotes (this is more of a typography issue but I just thought I would pop this in here). Left is “ and right is ”
Keep them Reading
- It goes without saying that your copy should be geared towards your target audience's level of understanding, interest and technology skills.
- Avoid grammar and spelling errors.
Proof Read
Have someone proof read all of your copy. You are too close to your work, you know what it is you are trying to say but have you really said it. Nothing breaks concentration more than having to keep rereading trying to understand the meaning. Also they can check for any grammar and spelling errors you might have missed.
