Accessible editorial content

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.

In order to meet legal requirements, we follow the recommended government standard for web accessibility: WCAG 2.0 AA

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:


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.


Images

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:

Example of alt text being used 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

Example of alt text being used in Site Editor
Example of alt text being used in Site Editor
Example of alt text being used in Site Editor

Learn more about including image attributions and copyright.

Videos

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:

Chloe Bolton talks about her experience at Kent
Our students talk about the University of Kent (view 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.

How to create subtitles in YouTube videos

Learn more about creating videos.


Word, PDFs, Powerpoint and spreadsheets

Learn more about preparing accessible digital formats.

University resources

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.