Blog.

Article topics

How to Make Your Website More Accessible

Mark Tomkins

How to make a website accessible – tips 1-10

How to make your website more accessible and keeping it that way can be a daunting task if you are new to the concept of website accessibility, especially for busy parish or town clerk. However, understanding the basic techniques of making website content accessible can be broken down into easy-to-follow chunks of information. And once you start to use these techniques, you’ll also likely transfer these accessibility-friendly formatting skills to Word document production.

The following 25 web accessibility techniques are not designed to be the instant way to make a website accessible compliant with any WCAG standards – that’s only possible if the website framework itself has also been built in the correct way – such as the Aubergine Parish and Town Council Website packages. However, they are designed to provide you with ongoing web page formatting methods to follow to make sure the content on the web page more accessible to those with disabilities and who use assistive technology.

Page formatting tips for good website accessibility

  1. Use headings to create structure to a web page and Word document rather than choosing them by how they look – this will help readers understand the sections of the document or page without having to read or trawl through it to find the section they need. For example, the page’s title is the H1 – there should only be one of these per page. You can then use a section with a level 2 heading(H2)  and then a sub section (H3) which provides information that supports that provided in the previous level 2 heading (H2), and so on. It allows the user to navigate through the page without having to read and digest everything unnecessarily. You can read more about heading structure techniques in the earlier article.
  2. Following a good heading structure technique can be also used in MS Word to make sure that documents are also created with structure – you can set up the heading classes in Word easily at the top of the page before starting.
  3. Avoid using colour alone to present important information, such as on a website form. Marking required fields by only using coloured labels won’t help people who use screen readers or who have sight disabilities. Add text, like asterisks and/or “required” to the form so the user knows the key.

    Text & content formatting tips for good website accessibility

  4. Don’t use lots of text embedded into images. The words cannot be read or accessed by those with sight loss or use assistive technology. If you have an image of a poster for an event or piece of marketing, make sure the important information that’s in the image is also added to the text on the page or post so those without sight aren’t being excluded.
  5. Don’t add ‘picture of..’ or ‘image of…’ to ALT text – this will be audibly read by screen readers as ‘image of image of a golden retriever.’
  6. Infographics and graphs are great for those with sight but terrible for those without. When you include infographics & graphics that portray information or data on a webpage or in a document, ensure the same information is in the text, too.
  7. Always add ALT text to an image when adding to a web page, Word document or social post. Not too long, not spammy but descriptive. If the image is a stock image or is purely for decoration, mark the image as “decorative” so the user does experience being audibly read ‘image of green tick symbol’
  8. When adding ALT text to images, don’t make it too long as screen readers will read out loud each image description which may create frustration and unnecessary distraction.

    Document formatting tips for good website accessibility

  9. Lots of PDFs uploaded to websites are simply images of text created by scanning hard documents, such as meeting minutes and agendas. These PDFs cannot be read by assistive technology, such as screen readers. If you have the original Word document, run the inbuilt accessibility checker, address any issues and then save-as a PDF – avoid using the ‘print as PDF’ function as this converts the document to one image. For extra help add both PDF & Word files to your website. The text can then be read by most OCR and screen reading software and the heading structure will be maintained.

    General website accessibility & social media tips

  10. Screen readers will read aloud the text description of an emoji. If you use the “Rolling on the floor with laughter” emoji lots of times in a row, the screen reader will read out loud “Rolling on the floor with laughter” over and over. Limit the number of emojis you use in Tweets and social media posts and definitely avoid their use in web page content.

 

More website accessibility techniques can be found in the next article.