Creating accessible online content

Creating accessible online content means that everyone can interpret our websites in a consistent way, regardless of how they access the content. Whether they use web browsers or assistive technology such as screen readers or voice commands, we want everyone who visits the 丝瓜视频 online to have an informative, inclusive experience. We follow Web Content Accessibility Guidelines (WCAG) 2.2 to the AA standard. These globally recognised guidelines were developed by W3C, the organisation that standardises the internet. The are a legislated requirement in the UK. They also improve search engine optimisation and create a better overall experience for all visitors to our websites.

Your responsibilities

If you create or edit the content on any of our web pages, please use the resources available in this guide to ensure the pages are WCAG 2.2 AA compliant. If you’re working with a third-party supplier on a website for the University, please ensure that the supplier understands and follows WCAG 2.2 AA principles.

You are expected to complete .

Accessibility checklist for content creators

1. Readability

Accessible content improves the user experience for all of our website visitors and relies heavily on a clear copy.

Write in clear, plain English.
Keep sentences short – no more than 25 words.
Use simple language and avoid jargon.
Use sub-headings and bullet points to break up the text.
If you use a language other than English on the page, identify it using the lang attribute – for example, <blockquote lang=”es”> for Spanish.

Common mistakes:

Avoid writing in all-caps text.

2. Page structure

The information on your page should have a clear hierarchy. This helps assistive technologies and search engines, as well as readability.

Give your page a descriptive, informative, and unique page title.
Order your content by importance, with the most important information appearing first.
Use sub-headings to convey structure and meaning. Each sub-heading should be informative and unique on the page.
Use your content management system’s HTML heading functionality. For example, H1 should always be used for the page heading, H2 should be used for sub-section headings, and H3 should be used for headings that come under the sub-sections.
Make sure your content order is logical and intuitive. For example, the H1 header should always come before H2.
Make sure your content order is logical and intuitive. For example, the H1 header should always come before the H2 headers, and so on.

Common mistakes:

Do not use the H1 heading for anything other than the page heading. It should only appear once on any page.

3. Page functionality

If you have interactive or special functionality on your page, it’s important that the functionality is as accessible as possible.

Provide clear instructions for using the interactive content.
If your page has a time limit, there should be an option to turn off, adjust, or extend the time limit. This is not a requirement for real-time events, such as auctions, where a time limit is absolutely required.
If your page has flashing content, it should not flash more than three times per second. Consider avoiding flashing content altogether if at all possible, or providing advanced warning to the users as flashing content can cause photosensitive epilepsy.
If your page has functionality that’s triggered by moving a device (such as shaking or panning a mobile device) or by user movement (such as waving to a camera), users should have the option to disable the functionality, with equivalent functionality provided through standard controls like buttons.

Common mistakes:

Don’t use colour as the only means of conveying information. For example, don’t use green to indicate something is correct, or red to indicate something is incorrect unless you also include an icon or context in the copy. You may want to refer to the Colour section of this guide for more information.
Don’t include instructions based on shape, size, or visual location. For example, avoid directions such as “Click the square icon to continue” or “Instructions are in the right-hand column”.

4. Links

Accessible links are specific and will make sense even when read out of context.

Make sure your link text is clear and meaningful. For example, write “Visit the Department of Film, Theatre & Television website” instead of “Visit the department website here”.
Keep your link text specific and short.

Common mistakes:

Don’t use a URL as the link text. For example, write “Visit the 丝瓜视频 website” rather than “Visit the website: http://www.reading.ac.uk/.”

5. Images

Images are inaccessible to people who can’t see them, so it’s important that we always provide alternatives for image-based content.

Write the alternative text (alt text) for all photos and graphics on the page. The text should accurately describe the image.
Keep alt text short.
If an image is decorative or contains content already conveyed in the text, it should be given null alt text (alt=””).
If your image is a link, make sure you describe the link destination in the alt text.
If you have any complex images, such as a table or graph, provide an alternative way to access the information either on the page or on a separate, linked page.
When adding images to the page, make sure any frames or iframes are appropriately titled.
Do not over use emojis. Avoid using emojis in the middle of a message.

Helpful tip:

Alternative text, or alt text, tells users about the contents of an image. For example, a person using a screen reader would hear the alt text description of an image rather than seeing the image visually. Alt text should be added in the appropriate field when you upload your image to the content management system.

Common mistakes:

Do not use images of text. These are not readable by assistive technologies and they get pixelated when zoomed in by users who require magnification.
Be wary of putting text over images. Contrast can be an issue, and busy images can create a difficult user experience for people with dyslexia or visual impairments.

6. Audio and video

As with images, audio and video are inaccessible to people who can’t see or hear them, so it’s important that we always provide alternatives for multimedia content.

Provide captions and audio descriptions for videos on the page.
Provide text transcripts for audio recordings on the page.
All embedded multimedia should be identified with accessible text.
When adding multimedia to the page, make sure any frames or iframes are appropriately titled.

Helpful tip:

Add video or audio recordings to the page through YouTube so that a transcript can automatically be made available. * Not for Learning Capture content *

Please note that under the Learning Capture policy recordings must not be uploaded to YouTube, Social media or other publicly available platforms without prior approval.

7. Colour

As a content creator, University systems will only allow the use of already selected colours from a set colour palette. Please make sure there is sufficient contrast when you use colour. Refer to the colour contrast guidance. Do not differentiate information only by colour as this will make it difficult for people with colour vision deficiency to use the content. Please refer to the use of colour guidance for more information.

8. Check your work

You can use freely available automatic checking tools to check your work. Refer to Evaluating webpage accessibility. If you are updating the University website, you can get access to a login to check your work for accessibility. Contact the web accessibility team.

丝瓜视频