Website accessibility advice: our experts answer your questions

On our recent webinar on 'What to include on the accessibility help page on your website' we shared advice and information about making your website accessible to people of all abilities. There were a lot of great questions asked on the webinar about accessibility help pages, but also about best practice for digital accessibility in general. Sadly we were unable to respond on the webinar to all of these - in this blog our experts give their answers. A recording of the webinar is also included below incase you missed it.

Are there any specific font recommendations for accessibility?

Best practice for accessibility and usability is to choose a sans-serif font - a standard font which does not have extending features called 'serifs' at the end of strokes. It's also important to ensure the font size is coded as relative (e.g. ems, %) rather than fixed (e.g. pixels). More information on the accessibility of fonts is available on the WebAIM website.

What is semantic mark-up?

Semantic HTML or semantic markup is HTML that introduces meaning to the web page rather than just presentation. For example, a <p> tag indicates that the enclosed text is a paragraph. This is both semantic and presentational because people know what paragraphs are and browsers know how to display them. Consider a screenreader that announces text on a page aloud to a blind person - if your content is not using the correct markup it will not be announced correctly.

Where should the accessibility help page sit in relation to the accessibility statement. Are these two separate things?

A vector graphic of a desktop computer with a website on screenAn accessibility help page provides a useful stepping stone on a user journey, offers practical help to your customers and shows them that you have thought about their access needs. The accessibility statement on your website can be a part of your accessibility help page, a page level below or within the same section. Your accessibility help page could give all details in one go or you could break it up into smaller sections, with a separate accessibility statement providing full details. See Kent County Council's accessibility statement and Barclays' accessibility statement for some different examples.

What about the requirements for HE and Public Sector organisations to create an accessibility statement as part of new legislation?

AbilityNet has hosted two webinars recently on this very topic- our May 2019 webinar on the new UK Web Accessibility Regulations for HE and Public Sector and there is also our July 2019 update webinar on the UK Web Accessibility Regulations and specifically the requirement for an accessibility statement.

Can AbilityNet recommend any way of finding real life testers for our website?

Having people test your website is important, as it will give you a real-world view of the accessibility and usability of your site. We can help you with diverse user testing – AbilityNet has hundreds of user testers with a wide range of abilities and access needs to accommodate diverse user testing. Please get in touch with sales@abilitynet.org.uk for more information about our user testing services.

Do you have an example of a video using transcripts and how they do it?

Captioning videos and having a transcript is ever important for blind people, but also for those watching a video on mute. Google have some good instructions on YouTube video transcripts. Essentially you will need to write and provide them yourself for any video content you create. You can use some speech-to-text software to help speed up this process though.

My Computer My Way sounds great. Is there a charge for embedding it?

My Computer My Way is your guide to every accessibility feature on every computer, tablet and smartphone. For My Computer My Way to be embedded within your own site’s help section, it requires some collaboration to generate suitable content for your audience. There is consultancy and time associated with this which does incur a cost – please contact sales@abilitynet.org.uk for more information. You are of course welcome to link to any helpful My Computer My Way pages on your website for free.

General advice:

To ensure your website is as accessible as possible try to use semantic markup and avoid custom components. By this we mean - if it looks like a heading code it with a suitable tag (<h1>, <h2>, <h3>, etc); if it looks like a table code it as such (<th>, <td>, etc). Where you are struggling with this, WebAIM's online resources for developers and designers will be useful.

A tip for images – only informative images need alt text. Screen readers don’t need to know about decorative images (e.g. the picture of a girl holding a balloon) so give them a blank alt attribute (alt="") - this is important so that screen readers ignore them; otherwise they will announce an unknown image. If the image is informative or includes text, ensure the meaning is replicated in the alt text.

A great win for accessibility and usability is good colour contrast – use online tools which check colours meet the minimum requirements such as Tanaguru Contrast-Finder. It will provide you with suitable alternatives if your colour contrast ratio is too low.