The basics you will need to follow when creating content using Site Editor.
Accessible content is just good, quality content which is easy for everyone to understand and use, regardless of any individual’s needs. And the basics are really simple.
Inclusive design is a key principle of the new website templates and a fundamental aspect of user-centred design.
Writing for the web
People don’t read on the web and they really don’t read unnecessarily complicated or wordy content.
Make your content scannable
- cut down your text
- prioritise your top tasks and front-load your content with keywords
- create a logical structure, use correctly nested headings and chunk your content into sections
- use bullet lists rather than sentences where suitable
- use space - keep it simple and let your content breathe.
In Site Editor paragraph widths have been designed to improve online legibility by catering for about 75 - 85 characters per line across different breakpoints.
Writing tools and reference
Improve readability by using these great online tools:
- Hemingway app
- Grammarly browser plugin - for grammar and spell checking
- Comprehensive information about writing for the web from gov.uk
Use descriptive words in links
- This is good: Learn more about accessibility.
‘more about accessibility’ is unambiguous. Someone using a screen reader or scanning the keywords will quickly understand what content it links to.
- This is bad: Learn more about accessibility click here.
‘click here’ link gives no indication about the content it links to.
Don't open links in new windows
Don't open links in new windows, including external sites.
Let your visitors control how they wish to interact with your website. They will click the back button or open a link in a new tab themselves if they wish to.
The exception is on a form, eg needing to view terms and conditions when filling in a form.
Provide document type and size
This is especially important for people using mobiles.
- This is good: Download the 2018 Undergraduate Prospectus (PDF 8MB).
- This is not as good: Download the 2018 Undergraduate Prospectus.
You don’t know what you are downloading or how big it is.
Use ‘alt text’ (alternative text) for images which support the meaning of your content.
This describes the content of an image and is entered in the image description field in Site Editor:
People using the website, often those with visual impairments, may be using a screen reader because they prefer to hear the content, therefore the image needs to be described to the user to understand it.
If the web page is unable to locate an image, this text is also displayed in the browser. Describing the image also improves search engine optimisation creating content that is more informative, searchable and useful.
How much detail should I describe?
There is no perfect description - try capture the concept of the image.
A good explanation from Moz.com website:
"The best format for alt text is sufficiently descriptive, but doesn't contain any spammy attempts at keyword stuffing. If you can close your eyes, have someone read the alt text to you, and imagine a reasonably accurate version of the image, you're on the right track." - Writing good alt text with examples
Are these different from captions?
A caption is optional text that can appear below an image to provide additional context.
Sometimes there is overlap with the image description, but it intends to provide additional relevant information that compliments the image whereas alt text (image description) is a literal description of the image contents.
Image description examples in Site Editor
Learn more about including image attributions and copyright.
Provide closed-captions (subtitles) and/or a transcript file
If you are commissioning videos, ask your video provider if they can include subtitles as part of their quote.
A transcript file is a downloadable transcript of what is said in the video which users can easily access. Prepare the transcript as a text (TXT) file. These can be created by using 'Notepad' in Windows or 'TextEdit' on Mac.
Example video with subtitles and a downloadable transcript:
Creating closed-captions are easy to do in YouTube and helps your video to rank higher in search engines.
Always double check to make sure it’s accurate. In addition you can also manually type subtitles onto the video.
Learn more about creating videos.
Word, PDFs, Powerpoint and spreadsheets
Learn more about preparing accessible digital formats.
These are only the most frequent elements you’ll need to be aware of when creating content in Site Editor.
There is so much more to web accessibility. Awareness of the different disabilities people may have can help you improve your content.
Kent provides excellent resources and information about accessibility.