LJMU online style guide
The following style guide relates to online content managed by the Digital Marketing Team, it is a work in progress. If you have a suggestion or question about the style guide please contact the Digital Marketing Team.
Please use the guide alongside the LJMU brand guidelines.
Tips for online copywriting
- Plan ahead: write a page plan (templates are available from the online copywriting team) before you start writing so you know who you are targeting, what their needs and wants are (and how we can address those), sources of information, appropriate media to accompany the copy, etc.
- Headlines: you need to grab your audience, so make sure you give your headline some consideration. If you’re stuck for ideas you could try phrasing the headline as a question, provide a list, ‘how to’, or step-by-step guide to try to address the reader’s concerns. Use keywords wherever possible. Do not mislead your audience and try to draw them in with a headline that doesn't reflect the content
- Consistency: as there are a number of contributors/editors on the LJMU website, it's important to be consistent in tone of voice, language, terminology, etc. Check this document if in doubt
- Instructional copy: this is probably some of the most important copy you’ll write so give it careful consideration. Is it helpful? Will it guide users on their journey? Go through the activity yourself before you write about it
- Read it aloud: check your copy for sense, does it use natural flow and language, is it engaging?
- Break up your copy: don't give users long reams of text to read, break it up with subheadings, use bulleted lists, insert quotes/images, stats, etc.
- Reduce your text: edit and edit again, keep it as short and to the point as possible (people don't have time to read!)
- Use links within your text: the website is meant to be a journey for users so point people to useful information, especially within our site and useful external sources if we don’t host the information
- CTAs: every page should have a call to action, but try to limit these, so users know what to do next. Keep CTAs concise, active and persuasive.
For main CTAs you can use the blue button. CTAs can be towards the top of the page if you really want them to move to the next stage quickly and then again at the bottom of the page, for those that want to digest all the info first
- Use sentence case across the site
- Page headings should give a clear and immediate indication of what the user can find on the page, subheadings should provide a bit more detail
- Subheads should be used to break up sections of the page. Subheads should give a good idea of what information that section provides
- The main banner headline should not be duplicated word for word on the body copy headline or subhead, they need to be unique
- Ensure you use the SearchResultTitle field if using the same headers across different pages to ensure that in the site search, these headings display instead of the main heading
- There is no need to use a full stop at the end of introductory headers
- As a default use <h4> tags for subheadings within text (although there may be instances when other heading styles are appropriate to use, in particular when trying to match the display of components used on the page, please refer to existing pages for reference)
- Only use one space between sentences – not double spacing
- Only use single para breaks between paras – not double spacing
General copy guidelines
- Use plain English wherever possible; try to avoid university, sector or subject-specific jargon
- Use English spellings not American
- Spell out acronyms that aren’t in common use (exceptions: when in banner headings and the heading would be too long to incorporate, in this case be sure to spell out the acronyms in first mention of body copy)
- Mistakes such as typos, spelling and grammatical errors could potentially be damaging to LJMU’s reputation as a quality provider of higher education so it is essential that you always proofread copy before publishing
- Do not use ampersands (&) unless as part of a name/logo
- Avoid exclamation marks, they are overused and don't accurately convey tone of voice
- Be aware of supplied content using upper case on words that do not require it and change to lower case (the website should use sentence case throughout)
- When separating items with ‘/’ do not put spaces before or after the / e.g. apples/oranges
- There shouldn't be letter spaces on either side of an ellipsis (...)
- Do not use ‘click here’ or ‘here’ as link text as they are not good for accessibility/usability/seo. Instead use descriptive text (note: you don’t need to include the action in the link text, view guidelines)
- A full stop at the end of a quotation goes inside the quote marks if the material quoted is a complete sentence, outside if it is not. For example: He said: “I enjoyed my time at LJMU.” He described his time at LJMU as “very enjoyable”.
- Do not capitalise the first word after a colon unless it is a proper noun
- Government – use capital G only in the phrase the Government, meaning the present or a past government. Otherwise, use lower case – government policy, a future Labour government, etc.
- Avoid using ‘whilst’
- North West – use capitals only when referring to the North West. Otherwise, use lower case e.g. in the north west of England; travel in a north westerly direction
- In a simple list, separate each item with a comma, but do not put a comma before ‘and’. In more complex lists, to aid readability, a comma before ‘and’ may be helpful and is permissible
For example: The Director of the School of Natural Sciences and Psychology, and the Head of the Centre for Entrepreneurship both attended the event.
- Collective nouns are singular in most cases, ie, the team is improving
- Use bullets in place of long paragraphs whenever possible to make the copy more concise and easier to understand
- If the items in a bullet-pointed list do not flow directly on from the lead-in text to form full, self-contained sentences, use an uppercase letter at the beginning of each bullet point
- You can have free one-to-one counselling
- Our trained staff offer study support
- The Student Advice and Wellbeing team provide financial advice
- iPads are available in the libraries
We offer a range of services for students.
- If the bulleted items form complete sentences when put with the lead-in text they should begin with a lowercase letter (unless an initial uppercase letter is required – e.g. proper noun). Always ensure that each bullet point makes sense as an extension of the lead-in wording
Students can access:
- counselling services
- study support
- Liverpool-based medical services
- financial advice
- Do not punctuate at the end of each point (no full stops)
- If a bullet point contains more than one sentence it is permissible to put a full stop at the end of each sentence, but not the last sentence, within that bullet point (so the bullet point ends without a full stop)
- For long lists of bullets (use your judgement, perhaps more than six) split equally into two columns in order to keep the page short (two columns will stack on mobile)
Commonly used words and phrases - correct versions
- full time and part time – “The course can be studied full time or part time”, however when it is used as an adjective use the hyphen: “It is a part-time course”
- higher education and further education
- a subject is lower case, a specific course is upper, ie: sport science vs BSc (Hons) Sport and Exercise Sciences
- lecturer not Lecturer
- use -isation rather than –ization
- IM Marsh – no space or stops between I and M
- Mr/Dr/Ms etc. – no full stop after title
- no one – two words
- under way – two words
- practice (noun), practise (verb)
- Professor (do not abbreviate to Prof.) Capital P is used for the title Professor. Otherwise use lower case – He is a university professor
- online – no hyphen/spaces between
- webpage – no hyphen/spaces between
- website – no hyphen/spaces between
- BA, MA, PhD
- abbreviations – where possible use ‘Liverpool John Moores University’, especially when mentioning it the first time on a page. Thereafter, the only acceptable abbreviation is ‘LJMU’. When mentioning a School/Centre for the first time on a page, spell it out in full – e.g. General Engineering Research Institute (GERI). Thereafter the abbreviation may be used
- Great Britain: is made up of England, Scotland and Wales; the United Kingdom also includes Northern Ireland
- use en dashes within text in place of hyphens (html: –)
- Ensure correct Faculty/School/Centre/Department name is used, eg it is the School of Sport and Exercise Sciences and the Research Institute for Sport and Exercise Sciences
- Use upper case ‘Faculty’ or ‘School’ only when referring to a specific Faculty or School e.g. At LJMU we have four faculties
Numbers, dates and times
- Use commas to separate groups of thousands: 880,010
- Use % rather than per cent
- A range of years should be expressed in the form: 2005/07
- Telephone number format: +44 (0)151 231 0000
- Dates should take the form 6 June 2005 – don’t use ‘the’ before date or th/st after number
- Times should be written as either 1.00pm to 2.30pm or 9.00am – 5.00pm (with spaces before and after the dash and no space between the time and am or pm). Do not use the format “between 9-11am”
- Spell out numbers between one and nine, anything after than should be represented in figures except with abbreviated units of measurement and with percentages (eg: 4%). Never start a sentence with digits (the exception is in the case of listicles, a typical format for features/blogs, whereby headlines can start with a digit, for example, '10 best places study spaces', however this only applies to headlines not body copy)
For emphasis in copy, use bold only. Do not underline text for emphasis; this suggests a hyperlink. Do not use all caps on the site unless this is part of a proper name
Books/films/songs: Titles of books, journals, plays, films, musical works etc should be given in italics if they are a complete published work; if you are referring to an individual short story, song, article etc within a larger publication, use quotation marks
- When linking to an external website ensure the link is set to open in a new window
- When linking to an internal webpage the link does not need to open in a new window
- Ensure links to pdfs are set to open in a new window – this is really important as the user will shut down their browser (our website) when they close the pdf
- Always link dynamically on the website, don’t use absolute/relative links unless there is no other way to link to the page on our website (ie. when linking to a particular search on the course factfile, PGR, PGT, etc.) Linking dynamically is really important as the system alerts users to broken links so the user can relink it and avoid having broken links on the site
- Do not use ‘click here’ or ‘here’ as link text as they are not good for accessibility/usability/seo. Instead use descriptive text (note: you don’t need to include the action in the link text, view guidelines) eg: View Dr Smith’s profile Download the undergraduate prospectus
- Avoid using long link text, no longer than 4/5 words, you can instead link 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 text links (unless it is a part of terms and conditions and similar type of content where there is a requirement to do so)
- Also try to avoid spelling out email addresses within the body copy, instead you could link across the key words such as: Please get in touch with us to find out more. If you do need to include the email address, for a contact us section for example, they should be displayed as all lower case: staffdevelopment@ljmu not StaffDevelopment@ljmu
- If a link occurs at the end of a sentence you should include a full stop but do not include the full stop within the link or link text
- If you’re sending a user to the intranet and a password is required, indicate this by including (log in) following the link but not included in the link text
- Be aware that what you name a page will make up the tail end of your page's URL, so keep it short but also keep in mind keywords for search engine optimisation
- CTAs can use buttons but only sparingly, typically one per page/or large content block
- Keep CTAs concise and persuasive
- Do not use CTAs such as ‘Find out more about…’, unless you have provided sufficient content leading up to that line. Otherwise if it’s the first time the user has been introduced to the topic you should just use ‘Find out about…’
- Try to limit the number of CTAs on a page, but all pages should have at least one
- CTAs should be obvious on the page and also indicate where the user will be taken to
- Layout should work to enhance the copy and make it easier for the user to understand
- Layout should be consistent as much as possible across the site, use existing templates wherever possible
- Use testimonials in quote components as a device to break up text (note that when omitting a word or part of a quote use ellipses to indicate this)
- Do not justify text as this is harder to read, text should be flush left
- For any figures or stats bring these out of the text into a rotational quick facts component or key figures component
- Enter text without non-breaking spaces as once this page is reduced in width (mobile view) the spaces display between text
Addressing your audience
- Ask whether the information you want to add to the website is useful to the audience, if so further examine it to determine what aspects are most useful to narrow it down, decide what questions this user would be asking about the topic – and then answer these in the text in a concise way. Anticipate what might stop them from proceeding further on their journey on the website and address any potential blocks – ie have you provided them with a link to the next steps, every page should have at least one CTA
- 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’
- Pages should inform and inspire, language should be clear and accessible
- Try to keep sentences/CTAs/paragraphs/pages concise, for most types of content people tend to scan rather than read
- Try to limit paragraph length to 3-4 lines
- Break up text with subheadings and bullet points to help readers skim over the page to get to the information they need
- If some of the content lends itself to a collapsible/expandable dropdowns (faq component) add this to your page to shorten the page length
- When writing your synopsis ensure to keep it succinct, especially for news/blogs/features where you should aim to keep it within 150 characters
If you are adding content with dates ensure that you make a note of when the dates are due to pass so you can update the page, or set the page to automatically be unpublished. If you can initially edit to remove any time-sensitive content then do so.
Duplication of content
- Avoid duplicating copy across the site, instead signpost to the existing information with brief introductions or visual links (section links)
- If duplication is necessary, try to add the information into a component so it can be used in multiple places and then if any updates are required it only needs to be changed once to be reflected everywhere
- If duplication can’t be avoided, 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
- Try to write a unique synopsis for each page rather than copying and pasting from elsewhere, likewise when writing meta descriptions
- Your content might best lend itself to more interactive formats: videos, infographics, lists, step by step guides, animations, FAQs, other sharable content
- Include social media feeds/references in text where applicable
- When using image carousels try to use the text elements/captions to explain the image wherever possible
- Images need to be resized/cropped to fit their intended use (depending on whether they are going to be used as section links, banners, gallery images, etc.) Images should be resized to fit the dimensions of the particular section they will be used in a Photoshop before they are uploaded to the website rather than choosing the incorrect-sized image from within the CMS media repository
- As banner images are letterbox in style they should be carefully resized and cropped so that the majority of the subject is on the right-hand side without it being hidden by the blue title bar. Also ensure that 360px height banners (for courses) are uploaded distinctly from 290px height banners.
- Try to use images that enhance/compliment the subject matter. For example, don’t use an image of the interior of an empty building when the topic is about providing support.
- Images, like copy, should inspire and should be inclusive
- Naming conventions: ideally image filenames should be named according to where they are going to be used/subject area and include the dimensions of the image within the name itself, ie RISES_biomechanics_research_1320x290px.jpg, so that on first glance other CMS users can see the dimensions and it gives an idea of where the image belongs/what it is
- Organise images within the media repository in a meaningful way by naming folders according to type/size
- Ensure that any copyright info is included in captions
Alt text is used for screenreaders and if the viewer can’t or chooses not to view the images. The context of the page helps determine what information is useful as alt text for an image. Alt text should generally be short.
Generic illustrative – stock image or photo to illustrate the copy: not necessarily obvious from the copy what this would be so describe quickly and literally, eg ‘Wooden hourglass on wooden surface’, ‘Man’s hands in handcuffs held behind his back’. This is information that is unlikely to be included as a caption so should be included as alt text.
Specific illustrative – if the image is of a specific thing or place it is best to describe it in specifics, eg ‘Canary Wharf at night reflected in the Thames’, rather than ‘Tall office blocks at night reflected in a river’; the former is still indicative of the latter but gives useful extra information. ‘Bandstand in Nice used as a memorial with flowers and French flags’. A caption may provide the specific information, in which case the alt text field can be left blank.
Specific individual – likely referenced in the copy, so the name is usually enough. Extra illustrative information may be helpful if relevant to copy, eg ‘Sandra Edmunds in the field’
Group – either a quick description, eg ‘Large group of students in a workshop room’, or mentioning a specific individual/group already highlighted in the copy if relevant, eg ‘Betty and other students pose for a selfie’, ‘Law student debating finalists’. Again this information may be included in a caption, in which case the alt text field can be left blank.
Useful information about context for images: http://webaim.org/techniques/alttext/
Please see the Web Content Accessibility Guidelines (WCAG) 2.1. These guidelines cover a wide range of recommendations for making web content more accessible for people with disabilities.
- Consider the words/phrases that your audience would use when searching on Google and incorporate these and similar words/phrases within your copy
- Ensure the synopsis and meta descriptions use the keywords/phrases to aid search
- Meta descriptions are truncated so try to keep them to 160 character limit
- Give some thought to the synopses, these are displayed on the internal site search (or as summaries when used in news, features, blogs), they should be concise but descriptive and give an indication of what the user will find on the page
- Do not overload your copy with keywords, using natural language will always work best for SEO
- Write in the pyramid style and keywords/phrases should naturally load towards the top which will help SEO