Web style guide
Web writing
Writing is part of optimising
There are three key considerations that ensure the optimal experience for the audience when creating content for any website.
- Web content (text, images and media)
- Search engine optimisation (SEO)
- Web accessibility
This section covers best practices in writing for our websites.
- Content: All information pertaining to a webpage. This includes media, documents, forms, buttons, and metadata.
- Copy: Text.
- Metadata: Key phrases and words that web users would typically use in search tools and engines to find your page.
- Web users read differently from people reading text on print.
- They are heavily task-oriented and scan web pages with purpose, skipping over words until they find what they are looking for and hone in.
- Sight readers use their foveal (central) vision to focus on a word while using their peripheral vision to decide where to jump next.
- Sight readers anticipate the next line while moving their eyes horizontally along a line; so, their eyes are drawn down the left edge of the text.
- This flicking between horizontal and vertical motion results in the F-shaped reading pattern.
- Scanning on the web does not always take the shape of an F. Good layout and design on a page can overcome that.
- As a guide, expect to produce half the word count of writing for print.
- Write precisely and cleanly, using plain English where possible.
- Avoid redundant words.
- Avoid modifiers, quantifiers and intensifiers (e.g. very, almost, nearly, quite).
- Avoid empty phrases and jargon.
- Have a brainstorm of search terms and phrases that your audience might use when trying to find information on your page. Try and weave these terms in, especially in your opening paragraph.
- Lead web users to content based on their personal objectives.
- Try to avoid leading with program names that mean nothing to web visitors coming in cold. Imagine your visitors have no background information about your content.
- Example: 'Xchange Program' vs 'Short-term study abroad'.
Web users are highly task-oriented. They scan pages for information much more than with print. They tend to skim a page for information hooks and drill down from the highest level until they have enough.
- Write in an inverted pyramid: Start with the conclusion.
- Begin with the meatiest, most important information at the top and reveal more detail as you go.
- With each paragraph, introduce the subject, then add the detail.
- Begin with the meatiest, most important information at the top and reveal more detail as you go.
- Meaningful headings: Help users and search engines scan your page to pick out the information they want.
Large paragraphs onscreen reduce readability and cause reading fatigue. To increase the readability of your content, break large bodies of text into smaller paragraphs and sentences.
What is a chunk
- Each chunk addresses a single topic or task. Example: Company profile
- Each chunk is context-independent. Example: Board of Directors
- Avoid chunking too small so you end up with fragments.
Headings
- Use 1-6 word headings to focus readers.
- Keep keywords near the beginning of the heading.
- Avoid generic terms like 'Introduction' or 'Background'.
Paragraphs
- One idea per paragraph.
- The first few words are crucial for context and meaning setting.
- Avoid run-on sentences. Break up long sentences into shorter sentences.
- Keep your line lengths between 45 to 75 characters including spaces and punctuation.
Break long sentences listing attributes into bulleted lists
- Bullets: items that have no logical sequence
- Numbers: items with logical order
Hyperlinks take readers away from your page. Their labels should give web users an accurate indication of where these links will take them.
- Within the paragraph, link 1-6 word phrases that are descriptive and distinctive on their own.
- Avoid: You can see more examples here, here, and here.
- Better example: You can learn about our evolution through our history page.
- Avoid words and phrases like “click” or “hit the ‘Register now’ button below”. Calling attention to the mechanics of web use is now considered inelegant and superfluous.
- Instead, hyperlink the call to action and make the label explicit.
- Example of button text: Register for Research Festival
- Example of link name: XYZ Society Facebook Page
- Instead, hyperlink the call to action and make the label explicit.
- The phrase ‘Learn more’ is dangerous when used alone because of its ambiguity and poor information scent.
- Avoid: Learn more
- Use: Learn more about our history
This style guide site will grow as we add more web features to our environment and as global web standards continue to change. If you have questions, feedback, or requests for support areas, we'd love to hear from you.
