Useful Accessibility Tips for Content Editors to stay Legal

Web accessibility guidelines aim to give equal access to the content of your site to people of all abilities and disabilities. There are a number of technical issues that will form part of the website code. This article focusses on the accessibility issues associated with content editing as you can do in WordPress.

Correct use of Heading Tags (H1,H2 …H6)

Firstly, do use headings when there is more than a few paragraphs on a page. Headings make content easier to understand, they organize and break content down into digestible chunks.

Use meaningful descriptive headings to break up your text and make your content easier to scan.

Keep text simple

Keep your text as simple and straight-forward as you reasonably can. Use plain language and avoid technical jargon. Short words, short sentences, short paragraphs are easier for us all.

You can deal with complicated matters, just don’t make them more complicated than they need to be. Write clearly and concisely so that you are easily understood.

If you have a lot you want to say then,

• Divide it into short, logical chunks.
• Add plenty of subheadings to signpost the way and make your writing easier to scan..
• Use bullet or numbered lists to help split up information into bite-size pieces.
• Provide summaries at the beginning of important points to make it easier to understand from the start.
• Include simple definitions of technical or unfamiliar terms.

It is easy to make text complicated, it is much harder to convey the same message simply.

Make text formatting easy

Do not underline text

Underlines indicate links so don’t use underlines just to emphasis normal text.

Use bold sparingly

To make words stand out more use Bold (sometimes called Strong). But use Bold sparingly, not for whole paragraphs. Too much bold impacts readability.

Use italics sparingly

Italic text is harder to read for everyone and can be problematic for people with certain visual impairments or dyslexia, as the slanted letters can be harder to distinguish. Smaller italic text can appear blurred on low-resolution screens.

Short phrases or single words in italics are generally fine, but long passages can strain the eyes.

Serif fonts can be harder to read in italics compared to sans-serif fonts.

Avoid all-caps

All-caps (uppercase) text is harder to read. Lowercase letters are more familiar and shapes vary more so normal mixed-case is much easier to read and quickly recognise words.

Uppercase for whole sentences interferes with our ability to read and understand, forcing us to read carefully and slowly due to the unfamiliarity.

People with visual impairments or dyslexia may find all-caps text particularly challenging.

Also, using all-caps too much can be perceived as shouting and can be off-putting for readers.

Links do’s and don’ts

Most browsers allow you can navigate from link to link using the “Tab” key and “Enter” selects the link. This is helpful to people who are keyboard users. Screen readers provide a list of links and jump from link to link to quickly scan what is available.

Links should be descriptive

Links that just say “Link”, “Here”, “Click Here“, “Read More”, “Find Out More” etc are not very helpful if all you “hear” is the link text. The link itself should provide the context and describe what comes next without being lengthy.

Links that do not describe what will happen when they are clicked stop some users navigating your content effectively.

WordPress automatically sets up “Read More” type links for list of posts etc to get to the full post. But they are following on from what you are reading and will have a link in the post title which should be descriptive.

Also Note: poorly described links hurt your SEO.

Links should stand out (and not just by colour)

Inline links (links within your main text content) should be a different colour to the other text and underlined. This will be set by default within the design by the CSS. However you could change individual links in WordPress if you wanted to (you can easily change text and background colours in the Block editor). If you do ensure the colour still stand out.

Don’t put too many links in a page

Avoid putting too many links on a page. This makes scanning through the content, link by link, hard work for users of speech browsers as each is read aloud.

Don’t open new windows

This breaks the browser ‘back’ function leaving people who just rely on the keyboard no way back to the previous page.

If you must do this, make sure the link text states “opens new window” otherwise the user may not know what has happened.

Be clear with downloads

The download link should indicate what is going to be “downloaded” and ideally which format (PDF, DOCX etc) and size of file. This will mean less surprises and unwanted results for everyone.

With WordPress the download link text will default to the file name. So giving thought to changing to a sensible descriptive file name before uploading the file. This may save you from having to do some fiddly corrections afterwards.

Be clear with anchor links

Anchor links let you link to a specific point within a page.

This can be used for same-page links (linking to another point in the same-page), or linking from one page to a point deep within another page.

Same-page links are useful for long pages. These are helpful for keyboard users because they can jump down a long page instead of having to tab down. Adding “Back to top” helps keyboard users navigate back to the top of the page.

Be careful linking from one page to an anchor link in another page: This can be confusing. So use with care and be clear about what is happening.

Be careful not to create redundant empty links

It is relatively easy to set 2 links side by side that do exactly the same thing, one with link text and the other empty and not see this has happened. Pay attention to the text you select to be the link text and set the link once.

Provide alternative text for images

All images that form part of the content (rather than design backgrounds etc) require a short text description in the Alt Text tag. If the image is purely decorative and plays no part in providing information in the content it needs an empty Alt Text tag.

You will find a full explanation of using the Alt Text tag in this separate article: Images should have good descriptive text alternatives (alt text tag).

Other non-text content should also have Alternative Text descriptions. So videos and slides should have full text transcriptions to deal with sighted issues and sound transcripts (captions / subtitles) for people with hearing issues. See How to Make Your Videos Accessible: A Guide to Inclusive Content Creation.

Good colour contrast

Good use of colours and contrast helps people with sight impairments. Take care with colour combinations for people with colour blindness issues. Good contrast helps everyone with reduced eyesight.

This is dealt with in the design and CSS but not exclusively. In the WordPress Blocks Editor you can change text and background colours. WordPress may warn you if there is not sufficient contrast between the text and background colours you choose.

Sufficient contrast is a mathmatical calculation with a pass or fail level. Having made your choices you can test your web page online at for example WAVE Web Accessibility Evaluation Tool which includes contrast tests. If you have contrast problems then I find the Tanaguru contrast finder useful as it will test your colours (you will need to input your colour codes) and provide close alternative suggestions that would pass the tests.

PDFs should be accessible

PDFs are not a good substitute for normal HTML content and should be avoided if possible.

PDFs are not automatically accessible and need a lot of work to make them so. Primarily they need to be readable through text-to-speech or via Braille assistive technology. All text should be searchable, any scanned portions, images, tables and forms may need attention. The document will need structure and a defined reading order.

See Adobe help on checking and correcting accessibility issues in PDFs.