Web user guide
The work we create represents the College of New Caledonia to our staff, students, and the community. It’s important that we convey professionalism and pride in our institution. Use this guide to keep the CNC website consistent, correct and useful.
You can improve your writing for the website by considering your audience and the way they access your content.
Don’t make assumptions about the reading level of your audience. Many people suffer from conditions that make it difficult to understand written information, such as attention deficit disorder, or dyslexia.
Additionally, computers provide an unfriendly way of interfacing with information. There is no way for the device to interpret or communicate the subtle forms of human communication, such as body language and tone of voice.
Use a personal tone in your writing. Aim to be trusted and reassuring.
Use the clearest and simplest language appropriate. Avoid jargon and technical language. Do not assume that your visitors understand the terms used by your department.
Communicate to the visitor instead of speaking generally. Imagine that you’re speaking to a person; what would you tell them? Content on the site often makes a direct appeal to get involved or take action, eg “You can contact us by phone and email” or “Sign up for Convocation.”
- use contractions (eg can’t) – except “should’ve”, “could’ve”, “would’ve”
- use the active rather than passive voice
- avoid patronizing your audience
- not let caveats dictate unwieldy grammar – eg say “You can” rather than “You may be able to”
- use the language people are using
- not use long sentences with complicated sub-clauses
Front load information
Summarize the purpose of each web page at the top.
Write each paragraph so the main point is first. Each paragraph should be short, and make only one point. This aids both user scanning and comprehension. If it’s longer, the user should get the gist from the first sentence.
Keep it short
Usability expert, Steve Krug recommends in his book “Don’t Make Me Think!: A Common Sense Approach to Web Usability” that a copywriter should take his copy, edit it down to half its original length and then half it again.
Remove repetition, marketing speak, and content with no real substance.
Keep each individual sentence as short as possible.
When possible, break up content so each block of text can be associated with a heading or sub heading.
Make sure text is gender neutral when possible. Use “them”, “their”, “they” etc.
Don’t write full sentences and paragraphs in all-caps. Overuse of capitalization is difficult for those with reading difficulties. It also gives the impression of anger or shouting.
Titles and headings should be capitalized normally, not in title case.
Use plain English. Don’t use formal or long words when easy or short ones will do. For instance, use “about” instead of “approximately” and “like” instead of “such as”. Don’t write institutional buzzwords and jargon. Often, these words are too general and vague and can lead to misinterpretation or empty, meaningless text. Get rid of buzzwords by breaking the term into what you are actually doing. Be concrete and specific.
All audiences should understand your content; this isn’t ‘dumbing down’, it’s making information available to all.
Abbreviations and acronyms
Spell out acronyms when first mentioning them, unless they’re well known.
The first time you use an abbreviation or acronym, explain it in full on each page, and then refer to it by initials. For example – Career Technical Centre, then CTC. Don’t use an acronym if you’re not going to use it again later in the text.
Don’t use full stops in abbreviations, unless required by the institution. Use CNC, not C.N.C.
Don’t use Americanisms. You “fill in” a form, not “fill out” a form. It’s enrol, not enroll.
Use “and” rather than an “&”, unless it’s in an area where space is at a premium, such as a table.
How to use bullet points to make text easier to read:
- always use a lead-in sentence
- bullets should always make sense running on from the lead-in sentence
- use lower case at the start of the bullet
- don’t put “or”, “and” after the bullets
Dates and times
Use ‘to‘ in date and time ranges – not hyphens, en rules or em dashes. For example
- year 2011 to 2012
- Monday to Friday, 9am to 5pm (put different days on a new line, don’t separate with a comma etc)
- when space is an issue, eg tables, publication titles etc, you can use truncated months: Jan, Feb, Mar, Aug, Sept, Oct, Nov, Dec
- 10am to 11am (not 10–11am)
Follow proper grammar rules. If in doubt, don’t use a hyphen unless it’s confusing without it.
Write numbers in Arabic numerals (including 1 to 9), unless doing so would make a sentence awkward.
When a number starts a sentence, write it out in full, except where it starts a heading or page title.
- For numerals over 999 – insert a comma for clarity. “It was over 9,000.”
- Spell out common fractions, such as one-half.
- Use a % sign for percentages, ie 50%.
- Use ‘500 to 900’ and not ‘500–900’ (except in tables).
Keep titles short. A max of 8 words will appear in search results. Be concise. Avoid stop words like of, in, at, for, and. Search engines ignore these terms so if you use them, make sure they’re not taking up the space of a keyword (but make sure the title makes sense).
Front-load keywords. It will make titles faster to read.
Include variations and abbreviations if they are popular in search.
Be specific so users can differentiate from other titles in search results, and so they make sense out of context.
Colour, emphasis, and text styling
Don’t change text from the default colour in the CMS editor.
You can effectively use colour for emphasis, but it needs to be done carefully and consistently. If you believe part of your content requires extra emphasis, contact the Web Design team for assistance.
Text should not be underlined. This is important because web browsers traditionally underline hyperlinks. Underlining other text is confusing.
Use bold text sparingly, only when emphasis is necessary.
Don’t use italics. Use quotation marks if referring to a document, scheme or initiative.
Use only 1 space after a period, not 2. This is both for consistency, and for readers with dyslexia. Unnecessary spaces can create rivers of white space that cause difficulties reading.
Use ‘Telephone: 250-800-9000’ or ‘Phone:’ not ‘Ph:’.
User hyphens as a separator. Here are the different formats to use:
- (1) 250-800-9000
- 250-800-9000 ext 5505
Use images when appropriate, to add context, personality, and information.
- Images must include a description in their alt tags, so that assistive technologies are able to understand their contents.
- Images add to the load time of a page, so please consider whether or not each image adds value.
- Images should be cropped and resized for viewing on the screen before they are uploaded to the CMS. Free software exists online to let you optimize images: Pixlr . If you’re uncertain, please contact the Web Design team for assistance.
- Get photo releases signed by each recognizable person in a photo before posting it online.
Use icons to add context to page content, and to communicate complex ideas.
For example, a phone address may be complemented by an icon of a phone receiver, in order to quickly communicate its purpose to someone skimming the contents of a page. Icons are not read by assistive technologies, so they should not be used to replace text.
Insert icons using the snippets button in the CMS.
Copyright and privacy
Don’t publish copyrighted information or graphics without permission.
Seek permission before publishing personal information, or photos where people are clearly identifiable. Remember everyone in the world will be able to see information you put on the site.Logo use and colour palette
Please refer to the Visual Standards guide.
Accessibility and devices
Try to accommodate the widest possible audience with whatever content you put on the website.
Avoid content that may be difficult for certain devices to view, such as complicated tables. Many users now browse the website via their phone.
Use browser built-in supported technology for vital content (HTML text, jpeg images, etc.) rather than proprietary formats such as Shockwave and PDF, whenever possible. Otherwise, provide alternative methods to access the same content.
Provide alternatives to all materials, such as text alternatives for images (use
If you have questions about how to ensure your content is accessible and behaves responsively, please contact the web design team.
Links and navigation
Write linked text concisely and accurately, to give a clear indication of where the link will lead. Instead of writing “click here for more,” which can’t be understood out of context, write “read more about CNC’s history”.
Don’t type out a link in full (no http:// www ). It’s more valuable to provide the title of the page, or the action that you’re recommending to the visitor.
Front-load your link text with the relevant terms and make them active and specific. Always link to online services first. Offer offline alternatives afterwards (where possible). Avoid references to the way the link will be activated. People on touch screen devices won’t “click here” for example, and neither will people unable to use a mouse for accessibility reasons.
Don’t create links that disable the back button or other basic browser functionality.
Text that has been hyperlinked in the CMS is automatically styled to appear as a hyperlink. You don’t have to do so manually.
Linking to another website can be seen as an endorsement. Ensure that every link you make is to a trustworthy source.
Regularly test every link and make sure that they work, and that the linked website is still useful and relevant. Remove any link which is no longer helpful.
Planning and maintenance
Think about the website from the user’s standpoint: What do they want to do, or what do they want to learn? How can your site help to accomplish their goals?
Keep the site current. If you’re not able to routinely update information, it’s better to remove it than to distribute outdated information.
Don’t use elements that blink, float over content, or harass the viewer in any way.
Check spelling and proof read all information.
Credit: Much of this document’s content and direction is courtesy of Boagworld’s Advice for CMS Users and Gov.UK’s style guide.
Last Modified: February 11, 2014