Web content style guide
We have a legal obligation to provide digital content that is accessible to everyone.
‘Accessibility’ is an approach that starts at the concept of creating material for the web. If you are a student or staff member, you have a vital part to play in delivering accessible content.
Guidance for creating and publishing web content
This guide discusses the LJMU website content requirements for:
- style
- layout
- formatting
- spelling and grammar conventions
The guide is arranged in alphabetical order. This is a long guide, and we recommend that you familiarise yourself with the content. We expect you to dip in and out of this guide to help you develop your content.
The Web content style guide is managed by the Web Content Team. Internet and accessibility standards are continually developing, so this guide is a work in progress. We recommend that you return regularly to this guide to keep your knowledge up-to-date.
If you have a suggestion or question about the style guide, please contact the Web Content Team via the HelpMe Portal.
This page is part of a series of guides. Please use this guide alongside the:
Faq Items
A
Abbreviations and acronyms
The first time you use an abbreviation, explain it in full and then refer to it by initials in the remaining page’s content. You need to do this for each webpage.
For example, The Executive Leadership Team (ELT) met this week. The ELT will meet again next week.
Exceptions include:
- well known abbreviations or acronyms such as UK, or BBC
- banner headings when the heading would be too long to fit the banner – spell the acronym in full in the first mention in the body copy
Do not use full stops in abbreviations. For example, BBC, not B.B.C.
It is acceptable to use the acronym LJMU without first spelling it out in full if you are writing on a recognisable LJMU platform such as the LJMU website.
Accessibility
By making LJMU’s website accessible, we aim to ensure that all users have a good experience and can find and understand our information. How we write the content is as important as how we format and build the pages.
This Web content style guide contains guidance to help you produce accessible content.
It is important that you also make yourself familiar with the Making your content accessible guide that describes different file formats.
Visit the World Wide Web Consortium's (W3C) Web Content Accessibility Guidelines (WCAG) 2.1 to get a deeper insight into the recommended criteria.
Ampersand
Do not use ampersands (&) – use ‘and’ instead. The only exception is when the ampersand is part of a name or logo.
Asterisk
Do not use asterisks in your content because they:
- are a visual prompt that cannot be read by a screen reader
- make your user move away from your main content to look for the meaning of the asterisked item
- risk losing the user’s engagement - because they may find it too difficult to return to the correct part of your main content and continue reading
If something needs clarifying, then write it clearly within your content in the first instance.
Also see the ‘Footnotes’ section.
B
Bold
Only use bold sparingly. Using too much bold will make it difficult for users to know which parts of your content they need to pay the most attention to.
Do not use bold in other situations, for example to emphasise blocks of text.
To emphasise words or phrases, you can:
- front-load sentences
- use headings
- use bullets
Bullet lists
Also see ‘Numbered lists’ in this guide.
You can use a bullet list to make content easier to read. Creating a series of items as a list also enables:
- screen readers to inform their users that they have landed on a list
- screen readers to provide extra information such as the number of items in the list
- screen readers to inform the user when the list ends
- keyboard users to jump from item to item
Presenting a 'wall of text' and long paragraphs in a document or website can discourage reading. Instead, present key concepts as bulleted lists where possible.
Do not use the tab key or spacebar key to visually indent content.
There are two ways for writing bullet lists.
Bullet list 1
This bullet list is the most used format.
It is a list with a lead in line. These lists look like this, and they:
- always have a lead-in line with a colon
- make grammatical and contextual sense when each item is read on from the lead-in line
- always start with a lower case
- never start with a capital letter
- do not have ‘or’ or ‘and’ after the items
- don’t use more than one sentence per bullet point - use commas or dashes to expand on an item
- do not have display the whole item as a link - if it is a long phrase, link the descriptive keywords
- mustn’t have a semicolon or comma at the end of an item
- do not have a full stop after the last bullet point
Bullets should normally form a complete sentence following from the lead text. But it’s sometimes necessary to add a short phrase to clarify whether all or some of the points apply. For example, ‘You can only register for an event that is (one of the following):’
Bullet list 2
Only use this format for a pure list that does not have a lead in line, or a for a set of steps and instructions.
- Always start each item with a capital letter.
- Always use punctuation.
- The preceding paragraph always ends in a full stop.
C
Call to Actions (CTA)
A Call to Action (CTA) is an instruction to the user to encourage them to act. We use them to guide our users through a journey.
There are many different types of actions:
- links
- buttons
- forms
- email links
- polls
Limit your CTAs per page, and make them clear, specific, and persuasive so users know what to do next.
You can use a button as a CTA, but only sparingly. We recommend one button per page or large content block.
A button CTA at the top of the page will encourage the user to move to the next stage quickly. A button CTA at the bottom of the page allows your user to read your content before they use the CTA.
Use clear, concise and descriptive text for your CTAs. This allows the user to know what is expected of them or where they are navigating to.
If you need to include a customised CTA in your content, please contact the Web Content Team through the HelpMe Portal.
Capitalisation
DO NOT USE BLOCK CAPITALS. IT'S HARD TO READ.
Always use sentence case, even in page titles. Exceptions to this are the full title of a school, faculty, or the university.
For example:
- Staff are the heart of Liverpool John Moores University. The university has a distinct place in the city.
- The School of Education offers high quality teaching. Graduates are prepared for a career in education.
- The Faculty of Business and Law prepares students for the workplace. The faculty has extensive links with the business community.
Subject areas should be in lower case. Specific course should be upper case.
For example:
- She wants to study sport science.
- She enrolled on the BSc (Hons) Sport and Exercise Sciences course.
Titles should be upper case when used alongside someone's name.
For example:
- The award was presented by Professor Jane Doe.
- Jane Doe is a professor.
Use lower case for job roles held by more than one person. Use upper case for a job title referring to a specific person.
For example:
- Each of the pro-vice-chancellors were invited to the event.
- The Pro-Vice-Chancellor of Education will be in attendance.
Do not capitalise the first word after a colon unless it is a proper noun.
Colour
Coloured background
Do not use coloured backgrounds. This is inaccessible to someone who is blind. It can be confusing or inaccessible to people who are colour blind or have other visual impairments.
Coloured text
Do not use coloured text for emphasis, such as using red for important messages. This is inaccessible to someone who is blind.
Worldwide, approximately 1 in 12 men are colour blind and approximately 1 in 200 women. Using colour for emphasis is confusing or inaccessible to someone who is colour blind and can confuse people with dyslexia.
Colour contrast on non-web pages
If you are creating an attachment or document that will be delivered and viewed on screen, it must be accessible. See ‘Download documents’ for guidance.
If you cannot avoid having two colours together, they must have an acceptable contrast ratio so that the content is easy to read.
There are many free online tools that will tell you if your colour combination passes accessibility standards. Two examples are:
You must achieve an AA pass to be accessible. An AAA pass is a higher level again, and more accessible.
Different factors will influence your pass result. For example, tweaking both font size and colour may help to reach the minimum AA standard.
Contractions
Avoid negative contractions like can't and don't. Many users find them hard to read or misread them as the opposite of what they say. Use cannot, instead of can't.
Also avoid should've, could've, would've and they've. These can be hard to read.
D
Dates
Do:
- use upper case for months: January, February
- format a date as day-month-year: 6 June 2005
- express a range of years in the format: 2005/07
- express an academic year or a sporting season in the format: 2005/06
- refer to a specific century in the format: 19th Century
- use lower case when referring to a century without a number in the format: ‘by the end of the century’
- use 'to' in date ranges - not hyphens, en rules or em dashes, for example:
- Monday to Friday, 9am to 5pm (put different days on a new line, do not separate with a comma)
- 10 November to 21 December
Do not:
- use a comma between the month and year: 28 July, 2018
- use ‘the’ before date
- use ordinal numbers in a date, such as 31st March
Download documents
A document is sometimes called an attachment and is something that the user will download from your page to view and use.
Do not use a document as a shortcut to get information on to the intranet.
We recommend that information is presented as a webpage rather than an attachment. This is for several reasons:
- the content within a document cannot be found by the website search engine
- downloaded documents are often saved to personal desktops and reused by the user - they will not be updated when the central message is updated
- the document may not be accessible
- the document takes the user away from the web-based content and they may not be able to navigate back
Examples when an attachment would be appropriate include:
- a letter that a user needs to print off and use as a paper document
- a poster or a leaflet that a user can print or forward on
Please see the guidance about accessible file formats on the Making your content accessible guide.
Duplication of content
We recommend that you do not duplicate content or pages. Instead, signpost to the existing information with a brief introduction or a visual (section) link.
We recommend that you do not spread an idea or context across multiple pages. Write the information in a single place and link to it from other related pages.
If duplication is necessary, discuss using a component with the Web Content Team. The single component is reused in multiple places. So, when the component is updated, the information will cascade to all the other instances.
If you cannot avoid duplication, ensure that the Digital Services Team update the robots file to exclude the duplicate content from search. Also, exclude the item from site search within the CMS.
Always write a unique synopsis or summary for each page. Do not copy and paste your synopsis from elsewhere. The synopsis is visible in the search results and helps the user to identify the unique page they are searching for.
Do not duplicate keywords and phrases when writing meta descriptions. This will not help the search engine to identify your unique page – use fewer, more unique phrases.
E
eg
eg sometimes reads aloud as 'egg' by screen reading software. Instead use 'for example' or 'such as' or 'like' or 'including' - whichever works best in the specific context.
Email addresses
Avoid spelling out email addresses within your context. Instead, use a link across descriptive words that make it clear where the email will be going.
Good example: Please email the Web Content Team to find out more.
Bad example: Please get in touch with us to find out more.
When writing an email address in full, use lower case. For example, staffdevelopment@ljmu, not StaffDevelopment@ljmu.
Emphasis
Bold
Only use bold sparingly. See 'Bold' section.
Capitalisation
Do not use all caps. See the 'Capitalisation' section.
Italics
Use italics sparingly. See the 'Italics' section.
Underline
Do not underline text for emphasis. See the 'Underline' section.
Important information
Do not use boxed text, coloured text or entire paragraphs or sentences of bold to add emphasis to short piece of important information.
We have created a style to be used consistently across the website to emphasise important information within a webpage.
Please note
The important style looks like this. The left and right margins are indented, and a solid bar appears on the left-hand side of the paragraph. Discretionary use of bold can be used to add extra emphasis to keywords and phrases.
There is further detailed guidance on the CSS ‘Important’ font style page.
Advice for Sitecore editors
Do:
- use the CSS style ‘Important’ to give emphasis to essential information
- add the phrase ‘Please note:’ or ‘Important’ or something similar to the start of the information followed by a soft return so that the main message starts on the next immediate line
- make the starting phrases such as ‘Please note:’ or ‘Important’ bold
- only use bold within the message to emphasise specific keywords, if necessary
Do not:
- apply bold to the whole paragraph – just the opening phrase and any specific keywords
- overuse the style, because it will reduce the emphasis, and users will start to ignore it
Advice for website contributors
If you need a paragraph or statement to be emphasised as important information, please let your Sitecore editor know.
etc
etc can usually be avoided. Try using 'for example' or 'such as' or 'like' or 'including'. Never use etc at the end of a list starting with these words.
F
FAQs
We recommend that you do not use FAQs. If you write your content by starting with user needs, you will not need to use FAQs.
FAQs are discouraged because they:
- duplicate other content on the site
- cannot be front-loaded (putting the most important words first), which makes usability difficult
- are usually not frequently asked questions by the public, but important information dumped by the content author
- suggest that content is not where people expect to find it - useful information needs to be in context
- can add to search results with duplicate and competing text
Font sizes
You do not need to change font size in your content. All font sizes are predetermined by the styles provided within Sitecore.
There is only one style that shows normal text at a larger size, and this can only be used for an introductory paragraph.
There is further detailed guidance on the CSS ‘Large’ font style guidance page.
Advice for Sitecore editors
Historically, h3 headings have been used to make an introductory paragraph appear with larger text. This is an inaccessible practice. Do not use headings for whole paragraphs – use the ‘Large’ CSS style instead. The style can be selected in the ‘Apply CSS Class’ dropdown in the Rich Text Editor.
You cannot replace any headings with the ‘Large’ CSS style. Headings must be marked up correctly so that screen readers can navigate the page correctly.
Advice for website contributors
If you wish for an introductory paragraph to appear with a larger font on the webpage, please let your Sitecore Editor know.
Forms
We discourage using Word document, PDF or other formats for individual forms, and we recommend that Microsoft Forms are used.
Please see the ‘Accessible Forms’ section in the Making your content accessible guidance.
Footnotes
Footnotes are often presented as content with asterisks, numbered or symbolled annotations.
Do not use footnotes in your content because they:
- are a visual prompt that cannot be read by a screen reader
- make your user move away from your main content to look for the meaning of the footnoted item
- risk losing the user’s engagement – because they may find it too difficult to return to the correct part of your main content and continue reading
If something needs clarifying, then write it clearly within your content in the first instance.
Also see the ‘Asterisk’ section.
Front loading technique
Users read very differently online than on paper. They do not necessarily read top to bottom or even from word to word.
Instead, users only read about 20 to 28% of a webpage. When a user wants to complete their task as quickly as possible, they skim even more out of impatience.
Web-user eye-tracking studies show that people tend to 'read' a webpage in an 'F' shape pattern. They look across the top, then down the side, and then read further across when they find what they need.
What this means is you need to put the most important information first to grab their attention. This is 'front-loading', and we apply this technique to headings, sub-headings, titles and bullet points.
Heading example
Write your heading as 'Submitting your application', not 'How do I submit my application?'
Bullet list good example
At the activity centre you can:
- swim
- play
- run
Bullet list bad example
At the activity centre:
- you can swim
- you can play
- you can run
G
Government
Lower case unless it's a full title. For example: 'government policy', and 'Her Majesty's Government of the United Kingdom of Great Britain and Northern Ireland'.
H
Headings
Do not confuse your heading with your page title. Also see 'Titles' in this guide.
Use headings to convey meaning
Use headings to group related paragraphs and clearly describe the sections. Good headings provide an outline of the content and puts the user needs first.
Try to use active titles and start with a verb such as check, apply, request, find out. An active word at the beginning of the heading immediately tells your user if the content is relevant to them.
Avoid:
- 'introduction' as your first section – users do not want an introduction, just give them important information
- technical terms unless you've already explained them
- questions - users tend to only read the first few words of a title and skip to the next
- multiple headings starting with 'What is..., Where is..., How do I... because you will lose their engagement - most users skim read the first few words only - and visually-impaired users who zoom in to the screen can only see the first few words of a sentence before scrolling
- duplications - the main banner headline should not duplicate the body copy headline or subhead - they need to be unique
Use headings to provide structure
Use heading levels and sub-headings to break up your content and give it a sensible reading order. Users use headings to navigate the page and quickly get to the section that they are interested in.
Most users will skim read the page and hop between headings to find specific content.
Screen reading technology also allows users to jump from heading to heading.
This GOV.UK YouTube video explains why you should use the correct heading structure in your content.
Advice for Sitecore editors
In Sitecore, the page title is always H1 (heading level 1), so start your content with a H2 heading.
Headings and subheadings created in Sitecore always follow:
- Heading 1 – H1 - page title (never use heading level 1 for any other headings)
- Heading 2 – H2 - major section heading
- Heading 3 – H3 - subheading of the heading 2
- Heading 4 – H4 - subheading of the heading 3
Do not skip heading levels, for example from H2 to H4. Screen readers use headings to navigate and missing a level can be confusing.
Subheadings
Subheadings should always be short, clear, and concise. Never use a subheading style for a paragraph because it is inaccessible.
Do not use bold text instead of using sub-headings. This is inaccessible because a screen reader will not recognise it as a header.
Grammar and punctuation in headings
Good practice examples include:
- using sentence case
- not using a full stop, colon or semi-colon at the end
- avoid saying the same thing twice (tautologies) - it uses up valuable characters
- Bad example: Applying and submitting your application
- Good example: Submitting your application
I
ie
ie is often used to clarify a sentence, and is not always well understood. Try writing sentences to avoid the need to use it. If that is not possible, use an alternative such as ‘meaning’ or ‘that is’.
Images
Images are not accessible to everyone.
For example, images are not easy to read when people using screen magnifiers to zoom into them. Magnified images can pixelate and need scrolling vertically and horizontally to view them.
Only use images if they:
- provide context for your content
- help users understand information in a different way, like diagrams
- enhance or compliment the subject matter
- inspire and are inclusive
Images must be supplied to the Web Content Team in a high-resolution format. Preferably in JPG format with the resolution as high as possible.
Describing an image
Images must have meaningful descriptive alternative text for people who cannot see them.
We recommend you describe what’s happening in the image in the page’s content and leave the image's ‘Alt tag’ field empty. This means the description is available to everyone. Screen reading software will ignore images without alt text.
Do not duplicate text in the alt tag or image caption if you’ve written a description in the body text. This causes ‘auditory clutter’ for screen reader users.
Image alt tags
Only use the alt tag if you cannot add the description in the page body text.
Alt tag text makes images accessible to:
- screen reader users, because it allows them to hear what the image conveys
- users who cannot download the image, because they can read the alt text that appears in place of the image
- search engines, because alt text helps them decide how relevant the page content is to the search
Images that include some text
Avoid images that use text as part of the image. Write the text in the body text instead.
If it cannot be avoided, for example you need to publish a graphic that includes a campaign slogan, you should repeat the exact words from the image in the body text next to it.
Images with incidental text
If an image contains incidental text that has no purpose for the content, do not repeat the words in alt text or body text. An example of this would be background signage in a photo of something else.
Image colour and contrast
Do not use colour on its own to convey information. Users who are colourblind cannot easily see colour differences.
To understand more about images and alt text, go to the images tutorial produced by the Web Accessibility Initiative.
Visit Microsoft’s guidance for adding alt text to images in Microsoft documents.
Visit Canvas’s guidance for adding images to Canvas.
Important information
See the ‘Emphasis’ section in this guide.
Interactivity and shareability
Consider if your content will lend itself to a more interactive format such as:
- videos
- lists
- step-by-step guides
- animations
Where it is relevant, include social media feeds and references.
You must make sure that your interactive format is accessible. See the Making your content accessible guide for further guidance.
Download the video production process guidance (PDF, 880KB).
Italics
Titles of books, journals, plays, films, and musical works should be formatted in italics if they are a complete published work.
If you are referring to an individual short story, song, or article within a larger publication, use quotation marks.
Avoid chunks of italic text.
K
Keywords and meta description
See the ‘Search Engine Optimisation (SEO)’ section in this guide.
L
Language and writing for the web
Keep your content as focused as possible. Keep your user’s attention and do not waste their time.
Remember that you will be competing with outside factors for people’s attention, and possibly their mood and situation. They may be on a busy train, or in a noisy café, or in any number of stressful and unknown environments.
Language to structure your content
Give shape and meaning to your page by:
- not repeating the summary or synopsis in the first paragraph
- using the ‘inverted pyramid’ approach with the most important information at the top tapering down to lesser detail
- breaking up text with descriptive sub-headings – the text should still make sense with the sub-headings removed
- ensuring paragraphs have no more than 5 sentences each
- including keywords to boost natural search rankings
Language tone
Use plain English wherever possible, and avoid university, sector or subject-specific jargon.
Use the active rather than passive voice. This will help to write concise, clear content.
Addressing your audience
Wherever possible address the student as an individual and reflect their point-of-view, not the university’s.
Try to avoid ‘we’, ‘us’, ‘our’. Instead use ‘you’, ‘your’.
Grammar, spellings and punctuation
Mistakes such as typos, spelling and grammatical errors are damaging to LJMU’s reputation as a quality provider of higher education. You must always proofread your copy before publishing.
This list is not exhaustive. It is an indicator to show you some conventions.
Also see ‘Commonly used words and phrases’ in this guide.
Do:
- use English spellings not American
- use sentence case throughout the website - if necessary, Sitecore editors should change content that has been supplied - the Online Grammar website gives tips
- use abbreviation and acronyms correctly - the first time you use an abbreviation or acronym explain it in full on each page unless it’s well known, like UK, EU and BBC
- use a full stop at the end of a quotation inside the quote marks if the material quoted is a complete sentence - for example: He said “I enjoyed my time at LJMU.”
- place the full stop outside of the material quoted if the quote is not a full sentence - He described his time at LJMU as “very enjoyable”.
Do not:
- use ampersands (&) unless as part of a name or logo
- use slashes instead of ‘or’ – for example, ‘apples or oranges’
- use exclamation marks - they are overused and do not accurately convey tone of voice
- use letter spaces on either side of an ellipsis (...)
- use ‘whilst’
- use semicolons because they are often misread – long sentences needing a semicolon should be broken into smaller sentences
Collective nouns are singular in most cases - for example, ‘the team is improving’.
Language for links
To understand how to write and use a link, see the ‘Links’ section in this guide.
Simple lists
In a simple list, separate each item with a comma, but do not put a comma before ‘and’.
Long, detailed or complex lists should be bulleted to make them easier to read. See the ‘Bulleted lists’ section in this guide.
Layout
The layout of a page should work to enhance the copy and make it easier for the user to understand.
The layout should be consistent across the site.
Do not justify text because it is harder to read. Text should be flush left.
Use testimonials in quote components as a device to break up text. Note that when omitting a word or part of a quote, you should use ellipses to show the omission.
Bring figures or stats out of the text into a rotational Quick Facts component or a key figures component. The Web Content Team will advise.
Do not use tables to lay out a page. Tables used in this manner are not accessible. For further guidance, see the ‘Tables’ section in this guide.
Links
Do not duplicate information. Always link to existing content rather than repeating it.
Make sure all links are provided in context, at the point in the content at which they’re useful.
Do not put all links together at the bottom of the page.
Writing a link
Never use generic text for links, such as ‘Click here’, ‘Here’, or ‘Read more’. Generic links do not make sense out of context or tell users where a link will take them. They also do not work for people using assistive technology, who often scan through a list of links to navigate a page. They do not work for people who use the keyboard's tab key to navigate, find and read the links.
It is important the links are active and descriptive so that they make sense in isolation. The link text must give clues to:
- where you are sending them - ‘the bursary and scholarship guidance’
- what they need to do when they get there - ‘find an undergraduate course’
- why they are going there - ‘to order a brochure’
If your link leads to information, make the link text describe the information. For example, ‘degree apprenticeship information for employers’. Consider using the title of the page that the link connects to as your link text.
If your link takes the user to a page where they can start a task, start your link with a verb. For example, ‘apply for a postgraduate course’.
Do not repeat the same link text to link to different places. This includes making sure you do not repeat link text that is used in the main website header, megamenu, footer and side menus.
Avoid one word links.
Avoid using long text phrases for links. Try to make sure the link is no longer than four to six words. Link only the key part of the phrase, such as: Find out about the Centre’s research into primates.
Do not use naked links (full URLs) as link text because this is not accessible. People using a screen reader will hear the whole thing read out, including any punctuation and special characters.
Placing and using links
You cannot place a link in:
- a title
- a summary or synopsis
- headings
- subheadings
Think about the size of the link users need to select. For users with reduced motor skills, a one-word link could be very difficult to select.
Always check your links work and go to the correct content.
Links help people scan content, so do not:
- swamp them with too many
- repeat links to the same tool or webpage throughout your page
Links should never be empty. They must always contain text. Do not include spaces at the end of your link text.
Linking to external sites
When linking to an external site you must check if the site is usable and accessible (especially on mobile) and if it’s a safe and trustworthy place to send a user. Read the site’s privacy and cookie policies.
Plan how you’re going to maintain the link. The content on the external website can stop being useful. Links break and the design, content and privacy can change without warning.
If you are sending the user to an external site, you must make it clear in the link text that the user is leaving the LJMU site. This helps the user to understand that they are going somewhere else. You must link to a specific page, not the website's homepage.
For example: Find a postcode on the Royal Mail's postcode finder.
This kind of link and link description is preferred because it:
- does not require opening in a new browser tab or window (see 'Linking to a new browser tab or window')
- allows the user to use the back button to navigate back to the LJMU site
- tells the user that they are leaving the LJMU website
If you’re sending a user to a website that needs a password:
- add (log in) immediately after the link
- do not include (log in) in the link text
Linking to an attachment or a document
If the link opens an attachment, it must include the format and file size included in the link text. Example = video production guidance (PDF, 880KB).
Linking to a new browser tab or window
Avoid opening links in a new browser tab or window. This can be disorientating for users and cause accessibility problems for people who cannot perceive that the new tab or window has opened. When a new tab is opened, users cannot navigate back to the previous pages from the new tab. It is also difficult to navigate between multiple tabs and windows on a mobile.
This practice also applies if you are linking to an external site - see the 'Linking to external sites' guidance above.
However, there are some exceptions where it is preferable to open a new tab or window. Here are a couple of examples:
- Online Form
When using an online form that provides extensive context-sensitive help for each form field on a separate page because there is too much text to include within the form. The links to the context-sensitive help open in new tabs or windows will prevent the loss of any form data that has already been entered. - Secure Website
When a secure webpage includes a link to an external page that is outside of the secure session. The link opens in a new tab or window because opening the link in the same tab or window will break or destroy the secure session.
Links that open in a new browser tab or window are programmed to automatically append '(opens in a new tab)' to the link text. For example, the HelpMe Portal.
Bookmark or Anchor links
Avoid bookmark links. Bookmark links are sometimes called anchor links, and they jump over page content to take the user to a particular section of a page.
It’s not good practice to use bookmark links in your content. Bookmark links can be disorientating for some users with access or cognitive needs and who may have problems getting back to the previous page.
For example, screen magnifier users and those with motor function impairments. People using assistive technology may find it hard to see what they’ve missed or realise that they’ve skipped forward.
Instead of using bookmark links, rearrange the structure of your content so that people can navigate the content more easily.
Liverpool John Moores University
Refer to the institute as:
- Liverpool John Moores University
- LJMU
- the university
You should not refer to:
- JMU
- Liverpool John Moores
- the University
M
Meta description and keywords
See the ‘Search Engine Optimisation (SEO)’ section in this guide.
N
Numbers
Do:
- spell out all numbers between one to number nine
- write all numbers from 10 and above in numerals
- write a number in full when it’s part of a common expression like ‘one or two of them’, and where numerals would look strange
- use a number for digit that is lower than nine when it is with a unit of measurement or percentage, such as 4%
- spell out ordinal numbers from first to ninth, after that use 10th, 11th and so on
- insert a comma in numerals over 999 - for clarity: 880,010
- spell out millions, billions and trillions
- start a sentence with a spelled number, such as ‘Twenty people attended.’
- use % rather than per cent
- use % sign with a number: 55%
- use per cent not percent (in words)
- use the telephone number format: +44 (0)151 231 0000
- use Telephone:, or Mobile: - not Mob.:
For monetary values:
- abbreviate millions to m
- abbreviate billions to bn
- abbreviate trillions to tn
Spell out units of measurement in full (such as metres or kilograms). Abbreviate those words when referring to a specific measurement. For example:
- The cost per kilogram was too expensive.
- I bought 10kg of vegetables.
Do not:
- start a sentence with digits
The exceptions for starting a sentence with digits are:
- listicles
- features and blogs headings can start with a digit, for example, '10 best places study spaces', but this only applies to headings not body copy
Numbered lists
Also see ‘Bulleted lists’ in this guide.
Use numbered steps instead of bullet points to guide a user through a process. You do not need a lead-in line.
Steps end in a full stop because each should be a complete sentence.
P
Page length
There is no minimum or maximum page length for the LJMU website. However:
- people only read 20 to 28% of text on a webpage
- the pressure on the brain to understand increases for every 100 words you put on a page
This means that if you get to the point quickly, your target audience is more likely to see your information.
It’s most important that you write well. If you write only a single paragraph but it’s full of caveats, jargon and things users do not need to know (but you want to say) then it’s still too much.
Page content length
Try to keep sentences, CTAs, paragraphs and pages concise. People tend to scan webpages rather than read them.
Try to limit paragraph lengths to approx. 5 sentences.
Break up text with subheadings and bullet points. This helps readers to skim over the page to find the information they need.
If some of the content lends itself to collapsible and expandable dropdowns such as the FAQ component, add this to your page to shorten the page length.
Q
Quote and speech mark
Use single quotes:
- in headlines
- for unusual terms
- when referring to words
- when referring to publications
- when referring to notifications such as emails or alerts
For example: Download the document ‘Map of Liverpool cycle paths’ (PDF, 360KB).
Use double quotes in body text for direct quotations.
R
Reading age
Content should be written as clearly and simply as possible. Web Content Accessibility Guidelines (WCAG) recommends that the reading age is lower secondary level. This means we require a reading age of around 12.
See the ‘Readability’ section on the Making your content accessible webpage for further guidance.
S
Search Engine Optimisation (SEO)
Keywords and metadata are phrases and words that tell the search engines what the topic of the page is. It is important that the keywords and metadata accurately reflect the content of your page.
Generic words and phrases that appear on too many pages will not help your page stand out amongst the crowd. ‘Protractor’ and ‘semicircle’ may not be attractive words, but the users who google exactly those items are far more likely to find your page.
Think from the viewpoint of the user. Consider the words and phrases they would use when they search for your content. Incorporate these and similar words and phrases within your content.
Once you know the most popular keywords you can use them in the:
- title
- summary or synopsis
- introductory sentence
- headings
- subheadings
- meta descriptions
Summaries and meta descriptions are often truncated, so try to keep them to a limit of 160 characters.
Do not duplicate keywords and phrases when writing meta descriptions. This will not help the search engine to identify your unique page – use fewer, more unique phrases.
Do not overload your copy with keywords, using natural language will always work best for SEO.
Writing in the ‘inverted pyramid’ style encourages keywords and phrases to appear in the top of the page’s content. This will help the SEO.
Spacing
Do not double space - only use:
- one space between sentences
- a single line break between paragraphs
‘Summary’ or ‘Synopsis’
The summary or synopsis is the text that appears beneath the page title in search results listings and gives a description of the page’s content. An accurate summary will help your user to recognise your page in the search results. The wording used in the summary will help the search engines match your page with the users search terms.
Content authors or owners should provide an accurate summary when they submit their page content. Including keywords and phrases that you think the user will use to find your page will boost the ranking of your page in search results.
If a summary is too long, then Google can cut it short.
Summaries should:
- be 160 characters or less
- end with a full stop
- not repeat the title or body text
- be clear and specific
T
Tables
Do not use tables to layout and position text and images on your page.
Tables are often inaccessible.
Sighted users can visually scan a table. Someone that cannot see the table cannot make these visual associations.
Tables can be difficult to read by all users. Cross-referencing across columns and rows is confusing for all users.
Listen to this YouTube video about using headings on a table. During the video, you will hear a correctly marked up table being read out loud by a screen reader (1 minute 59 seconds to 2 minutes 30 seconds). Even though this table is accessible, it is still difficult to understand.
A simple table can often be replaced with a:
- series of bulleted lists with headings and subheadings
- single bulleted list
Tables should only be used to present data.
Data tables
The size of a table affects how easy it is for people to read it and understand it. The minimum size for a data table should be 2 columns and 3 rows (including a column header). Yet, if your table is this small it may be better as normal text.
Be aware of the length of your table. The table column headings will scroll up and off the screen as the user works their way down the information, and they may get confused having to remember what the cell data relates to.
If you must create a data table, you must use more rows than columns. A tall, narrow table is easier to read than a short, wide one.
A table must have brief descriptive text explaining the table's content added to the page content. The table description must be place immediately before or after the table.
Advice for Sitecore editors
To be accessible, a table needs to meet certain criteria. See the Editor's publishing checklist for details.
Size of a table
The size of a table affects how easy it is for people to read it and understand it. If you're dealing with a large amount of data that cannot be split, or is complex, it might be better presented as an Excel spreadsheet. Any Excel spreadsheets that are uploaded to the website must be accessible, and they must still be readable and easy to understand.
(To make an Excel document accessible, see the Making your content accessible guide.)
Time
Do:
- use the 12-hour clock with a full stop between the hours and minutes
- use ‘to’ in time ranges (not hyphens)
- use midday (not 12 noon, noon or 12pm)
- use GMT (Greenwich Mean Time) or BST (British Summer Time) when specifically addressing an international audience – do not use punctuation, and only have a single space separating the time and time zone
- describe time in hours and minutes
For example:
- 1.00pm to 2.30pm (with no space between the time and ‘am’ or ‘pm’)
- the meeting will start at 1.30pm and will end at 3pm
- 15 March 2023, 1.30pm to 3.15pm GMT
- 15 March 2023, 1.30pm to 3.15pm BST
- 6 hours 30 minutes
Midnight is the first minute of the day, not the last. You should consider using “11:59pm” to avoid confusion about a single, specific time.
When generally discussing midnight use:
- midnight (not 00:00)
When using midnight as a time marker, use 11.59pm. For example:
- You must submit your application by 11.59pm on Wednesday 29 March.
Do not:
- format time as ’between 9-11am’
- use the 24-hour clock such as 1730hrs
Time-sensitive content
If you are adding content with dates, you must make a note of when the dates are due to pass so you can plan to update the page.
If you can write the content without time-sensitive information, then do so.
Avoid generic phrases such as ‘Coming soon’. The timespan will create expectations in different users. When they return to the page and do not see a change, the page will appear as though it is not maintained. This will break the user’s trust and engagement for the remaining content.
If you do not have content ready to publish, it is better to not publish anything until you have something to say.
If you add a date or time-sensitive content, you must make a note of the timeframe and plan to review and update your content before the time expires.
Titles
You need to grab your audience, so give your page title some consideration.
Do not confuse your page title with headings. See the ‘Headings’ section in this guide.
Titles are important because they inform your user what the page is about. They engage the user to want to read more.
Titles are also used by search engines to find and rank your content, so a short descriptive title containing keywords is important.
Page titles must be unique. This helps the search engine to find the page and to rank it higher in the search results. If you are unsure whether your title is unique, search the LJMU website.
Page titles must:
- be 65 characters or less (Google cuts off the rest of the title at around 65 characters)
- be unique, clear, and descriptive
- Bad example: Room bookings – new process.
- Good example: Book a room in the Student Life Building
- be front-loaded (put the most important information first)
- Bad example: What’s happening in Wellbeing week?
- Good example: Wellbeing week events
- use a colon to break up longer titles
- not contain dashes or slashes
- not have a full stop, colon or semi-colon at the end
- not use acronyms unless they are well-known, like EU
Be aware that a page's title will be the tail end of your page's URL. So, keep it as concise as possible.
Check your title makes sense
The title ‘Instructions’ does not say much, but ‘Instructions for writing a good webpage’ does.
Use a keyword within your title
This helps the search engine to find your content and rank it higher in the results.
See the ‘Keyword’ section in this guide for further information.
Page title structure
Advice for Sitecore editors: The page title is always H1 (heading level 1). H1 cannot be used for any other page heading.
Title tab
Advice for Sitecore editors: match the title tab to the page title. If a page title is too long, then it is permissible to truncate it – but remember that the title tab is the title link shown in Google search results. The truncated title must still describe the page content and use keywords.
When linking to a Twitter account, use the phrase ‘X (previously known as Twitter)’ for the entire link.
You must not use the single letter ‘X’ as a link – this is not accessible. Single word and character links are not easy to use on a touch screen, or for users with limited mobility. They are also difficult to spot within a sentence or paragraph.
U
Underline
Do not underline text for emphasis because underlined text indicates a hyperlink.
Text that uses an underline for emphasis may cause your user to believe that the text has a broken link, and this creates mistrust of the content.
Commonly used words and phrases
The following examples show the correct use for commonly used words and phrases. This list is not exhaustive.
- BA, MA, PhD
- email – one word
- Faculty, School, Centre or Department names should be written accurately and in full – for example, the School of Sport and Exercise Sciences, and the Research Institute for Sport and Exercise Sciences
- Faculty and School - use upper case ‘Faculty’ or ‘School’ only when referring to a specific faculty or school
- faculty and school - use lower case when referring to faculties in general terms: ‘At LJMU we have four faculties’
- full time and part time – ‘The course is studied full time or part time’
- full-time and part-time - when used as an adjective, use the hyphen ‘It is a part-time course’
- Great Britain: is made up of England, Scotland, and Wales; the United Kingdom also includes Northern Ireland
- higher education and further education
- IM Marsh – no space or stops between I and M
- use -isation rather than –ization
- lecturer, not Lecturer
- ‘Liverpool John Moores University’ –use in full wherever possible
- ‘Liverpool John Moores University’ must be written in full when using it for the first time on a page - thereafter, LJMU is acceptable
- LJMU abbreviation – only LJMU is acceptable, not JM or other variations
- Master’s – with the apostrophe
- Mr, Dr, Ms – no full stop after the title
- no one – two words
- North West - use capitals only when referring to the North West. Otherwise, use lower case, such as ‘in the north west of England’ and ‘travel in a north westerly direction’
- online – one word
- practice (noun), practise (verb)
- Professor - do not abbreviate to Prof.
- Professor – use capital P for the title, otherwise use lower case ‘He is a university professor’
- Pro-Vice-Chancellor
- School or Centre abbreviation – write the school’s name in full when it is first mentioned and follow with the abbreviation in brackets: General Engineering Research Institute (GERI). Thereafter the abbreviation can be used.
- a subject is lower case, a specific course is upper case, such as sport science and BSc (Hons) Sport and Exercise Sciences
- under way – two words
- Vice-Chancellor
- webpage – one word
- website – one word
Tools, assets and resources
The Web content tips and support page has a range of tools, templates and assets to help you create user-centric content. This includes videos and webpages that demonstrate the different experiences of different users.
From time to time, we provide sessions and demonstrations to support the guidance. The notes and supporting documents for these sessions can be found on the Web content tips and support page.
We update the tips and support page in line with developing the website, so please check it regularly to keep up to date.
Web Content Community messages
Emails that we send to the Web Content Community are stored in the Web Content Community Hub Teams group.