Style guide: Writing online content

Introduction

What does writing online content cover?

When we talk about writing online content, we mean anything to be published on a digital channel - such as webpages, emails, blogs, social media copy, and apps.

Online content is diverse and different types of content need to be approached differently. However, there are some general rules that apply across the board. Whatever content you are creating, these guidelines will help you shape it specifically for a digital audience.

Focusing on the user

Before we talk about actually creating content, it’s worth touching on user-focused content.

There’s no magic secret here – to create user-focused content simply means designing content that best meets the user’s needs.

In almost all cases, when accessing online content users have something they want to achieve. It’s our job to identify and prioritise those needs, and meet them as efficiently as possible.

In order to focus on users, we must think about:

• who the content is for; what do we know about them?
• what they want to find, learn, or do
• what we want them to do. For example, calls to action
• how they behave online – what platforms do they use?
• what their attitudes and behaviours are

If you produce a lot of online content, it’s worth learning more about creating user-focused content. Read our guide to user-focused content design and how content fits into user journeys.

Writing for Shelter

House style

House style is how we present our written information as an organisation. For example, how we use bullets, and how we use quote marks.

We should always follow our house style guide so that all our content is consistent, easy to understand, and professional.

The Editorial team at editorialallusers@shelter.org.uk can help with any questions related to house style and the Brand team at branding@shelter.org.uk can help with other brand or tone of voice questions.

"A range of teams have put a lot of time, thinking and talent into taking Shelter's brand where it needs to be, so that people will know exactly who we are and what we believe - and inspire them to join our movement. Digital is a huge part of that. Our websites, and their content and design, need to strongly embody our new brand, no matter who is doing the publishing." 
Erin Wolson, Senior Brand Marketing Manager

Writing in plain English

Plain English is language that is clear, simple, and concise. It avoids unnecessary jargon and complex vocabulary.

Plain English is especially important when writing for the web. We need to provide information as quickly and easily as possible.

To help us to do this, we should ideally:

• use short sentences  –  if your sentence sounds too long when you read it out loud, then it probably needs breaking up. You could try replacing commas with full stops to do this
• use bullet points where appropriate
• use active language rather than passive language – ‘Sarah ran the marathon’ is better than ‘The marathon was run by Sarah’
• use the verb form of words, not the noun form – ‘implement’ not ‘implementation’, ‘has committed’ not ‘has made a commitment’
• avoid using jargon the audience will not understand

If your language is muddled or over-complicated, it’s a good sign that your thoughts and logic are too.

If we are clear about ideas in our minds, we can express them simply and clearly in plain English.

Shelter is ‘we’

When talking about Shelter we should use the collective ‘we’, ‘us’ or ‘our’. And we should avoid using ‘the charity’, ‘the organisation’, ‘it’, and ‘its employees’.

Doing this helps us come across as warm and friendly – not as a faceless, distant organisation.

For example:

• DO: ‘Shelter won’t stop until we have achieved our aim of ending the housing emergency.'
• DON’T: ‘Shelter won’t stop until it has achieved its aim of ending the housing emergency.’

The user is ‘you’

We should address the user as ‘you’ where possible and appropriate, as opposed to ‘they’. This puts the user at the centre of the experience and directly connects us to them.

For example:

• DO: ‘We need as many people as possible to help us end the housing crisis. And you can do this by supporting our latest campaign.’
• DON’T: ‘We need as many people as possible to help us end the housing crisis. And they can do this by supporting our latest campaign.’

Minimal capitals

Modern digital style is to use minimal capitals as they are often unnecessary. Excessive capitals also make text harder to read, and they place false/unnecessary emphasis on particular things.

If in doubt, leave the capital letter out. See our house style guide for more detailed guidance.

Structuring content

How we structure and present our content is as important as the content itself.  

Scannable text

Scannability is how easily a user can quickly scan a document and decide if they're interested in reading it.

Users read a web page differently to how they read a book. They generally read in an ‘F’ shape pattern - first looking across the top, then down the side, and reading further across some lines as they search for what they want.

It’s important that we all try to do the following to make text scannable so users can easily find what they need:

• Use subheadings to break up our information into chunks of content. (See below.)
• Avoid long paragraphs – they’re not scannable and make our content seem dense and challenging
• Use bullets to break up long paragraphs into easily scannable and digestible points, where appropriate
• Make sure your paragraphs have a logical flow of information, starting with the most important information

Top-loading information

We should always make sure the first few lines of every page include the most important information for the user.

Focus first on what the user needs to know or do, and give them that information or relevant link as quickly and prominently as possible. Gov.uk does this very well, for example on its page about bank holidays.

Background information and further details should come after the essentials.

Subheadings

Subheadings are very important for making text easy to read and scan. Ideally, and where possible, they should be about four to five words, but shorter is fine as long as it clearly tells users what the section is about.

Subheadings act as titles to different sections of your copy.

We can use questions as subheadings, but it's best not to use them too often. This is because questions are not easy for people to scan, and they aren’t very good for search engine optimisation (SEO).

They are also not great for accessibility because screen readers have trouble with them, so they’re bad for users with sight problems.

So, if possible, we may want to use 'Causes of homelessness', rather than 'What are the causes of homelessness?' for our subheading.

Formatting subheadings

When using subheadings on a webpage or blog, ensure they have an HTML tag. Contentful and Wordpress will add this for you automatically, as long as you format the text as a subheading (H2, H3, H4 etc).

Please refer to Contentful’s guidance for more information.

Ask the Editorial team for support if needed by emailing editorialallusers@shelter.org.uk

Links and calls to action

Links

Users should intuitively know where a link will take them based on the linked words. Linked words are the text that takes you to the link destination when you click it. Users shouldn’t have to read the whole sentence to gain context for a link.

Links should also fit in the natural flow of the sentence. This means that the sentence should make sense as normal prose with the links removed. 

For example,  

• DO: ‘If your housing application is denied, you can appeal the decision.’
• DON’T: ‘To appeal a denied housing application, click here.’

Structuring links properly helps SEO, readability, and users with screen readers.

We should try not to link more words than necessary to convey where the link goes, as text becomes less readable when it is linked.

Calls to action

These are links which prompt users to take a specific action (the call to action could also be a graphic element like a button). Getting the user to take this action will often be the main purpose of our content.

Most content we create should have clear calls to action. 

Calls to action are really important to get value out of the user's visit and keep them engaged.

We should always be asking: What is the purpose of this content? What do we want the user to do? What does the user need?

Calls to action could be to:

• make a donation
• share your story
• read a related article
• sign the petition
• sign up for an event

Try to make the wording as simple as possible, with the action and link leading the sentence where possible.

Good examples:

• Sign our petition to end the freeze on housing benefit
• Read our blog on the housing benefit freeze

Bad examples;

• Find out why improving renters’ rights matters by reading our blog
• Sign the petition to improve renters’ rights

If there is no call to action for the user, then we should give a link to a related blog, webpage, or campaign, to continue giving the user a worthwhile visit to our site. 

If a call to action appears at the end of a webpage or blog, it should appear distinct from the main copy. For example, in a bullet point or different visual style. This will help it stand out.

Related content

• Brand hub on InHouse – our brand guidelines, house style guide, links to training and more
• Email writing guidelines
• The gov.uk site has an excellent section on content design

Read our other content guides

Learn the lingo in our digital glossary

Contact us about the digital framework

Have a question or comment? Found a bug? Or maybe you’d like to contribute to the framework? Use our contact form to get in touch.