Accessibility for editors

Keeping our website accessible is important for all users. We work towards maintaining the website inline with the latest W3C compliance.

Below are some simple rules you can adopt when creating content on or for the website.

Add proper alt text to images

Use alt text to provide access to the content of images for individuals who cannot see them, including people using screen readers or Braille output devices. Alt text is supported by most document formats, including HTML, Microsoft Word, and Adobe PDF. For more information.

Use headings properly

Use headings and subheadings to form an outline of the page. Do not skip heading levels. They help non-visual users (including search engines) to understand how the page is organised and make it easy for screen reader users to navigate. Reserve H1 for the top of the page. Don't substitute a header with bold text as screen readers can't always pick up this text.

Provide sufficient colour contrast

Be sure foreground and background have adequate contrast for example if you have a light grey background, don't use a grey text. The same goes for images and header banners. If you have a banner with text on, don't add more over the top as this can be really confusing for all users especically those with a visial impairment.

Respect white space

Provide plenty of space between lines and blocks of text. This helps many users to more easily track text horizontally, and generally makes text easier to read.

Create accessible PDFs

Use "tagged PDF", the only type of PDF that supports headings and alt text for images. Use the PDF Accessibility Checker that’s provided by Adobe Acrobat. Before uploading a PDF always make sure it has a document title as this will appear in the top of an internet browser.

Know when to use PDF

PDF preserves a document’s appearance across operating systems and devices. If this characteristic is not essential, consider using another format such as a webpage within Umbraco. This can often make documents more flexible for updating too.

Use text, not pictures of text

Use text instead of pictures of text, and control its appearance using CSS. Pictures of text become blurry when enlarged, take longer to download, and are inefficient for the editor to change.

Use descriptive links

When you add a url to your page there is always the option for a link title. Add this and make it descriptive, for example "click here to go through to the International pages".

Think about the words you choose

Keep your content simple to read and understand. Often editors use larger words and longer sentences than is really necessary.

What else are we doing to stay compliant and accessible?

Using ARIA landmarks
On our website we use the W3C Accessible Rich Internet Applications (ARIA) specification making it possible to produce accessible interactive web applications. As an editor you don't need to worry about this as we've made sure they are added to all the content you produce on site.

Add labels to form fields
We have added HTML label elements so screen reader users will know which labels or prompts are associated with which form fields.