Website accessibility

Important legal requirements

New regulations came into force for public sector bodies on 23 September 2018. They say you must make your website or mobile app more accessible by making it ‘perceivable, operable, understandable and robust’.

You can do this by meeting the web content accessibility guidelines (WCAG). Read gov.uk's 'Understanding WCAG' page for more information.

You must also:

• publish an accessibility statement - this must include details of content that doesn’t meet accessibility standards. You may want to use the NIHR accessibility statement template

• if someone requests it, provide an accessible alternative within a reasonable time for content that doesn’t meet the standards

For more detail, see the government advice on making your public sector website or app accessible.

Things to consider

As you write, consider the following:

• Would this language make sense to someone who doesn’t work here?

• Could someone quickly scan this document and understand the material?

• If someone can’t see the colours, images or video, is the message still clear?

• Would a blind or deaf person be able to understand this material?

• Is the mark-up clean and structured?

• Mobile devices with accessibility features are increasingly becoming core communication tools, does this work well on them?

Avoid directional language

Avoid directional instructions and any language that requires the reader to see the layout or design of the page. This is helpful for many reasons, including layout changes on mobile.

Yes: “Select from these options:” (with the steps listed after the title)

No: “Select from the options in the right sidebar.”

Use headers

Headers should always be nested and consecutive. Never skip a header level for styling reasons. To help group sections, be sure the page title is H1, top-level sections are H2s, and subsequent inside those are H3 and beyond. Avoid excessive nesting.

Employ a hierarchy

Put the most important information first. Place similar topics in the same paragraph, and clearly separate different topics with headings.

Starting with a simple outline that includes key messages can help you create a hierarchy and organize your ideas in a logical way. This improves scannability and encourages better understanding.

Make true lists (bulleted or numbered) instead of using a paragraph or line breaks.

Label forms

Label inputs with clear names, and use appropriate tags. Think carefully about what fields are necessary, and especially which ones you mark as required. Label required fields clearly. The shorter the form, the better.

Add headers to tables

Tables should be used for tabulated data rather than for layout. Titles and paragraphs can be used for most documents i.e. committee minutes. If it is necessary to include a table the top row containing the titles of the data  should be converted to table header cells.

Use descriptive links

Links should provide information on the associated action or destination. Try to avoid “click here” or “learn more.”

Use plain language

Write short sentences and use familiar words. Avoid jargon and slang. If you need to use an abbreviation or acronym that people may not understand, explain what it means on first reference.

Use alt text

Alt text is a vital part of accessibility, and the number one reason why your content isn't accessible. We have prepared a full guide on alt text and image accessibility. Anyone adding images to the NIHR website should be familiar with this guide.

Video and audio

Closed captioning should be available for all videos (except ‘live’ video). Video made after September 23 2020 will need a version that gets the information across in audio-only.

Transcripts for sounds recordings should be made available.

Be mindful of visual elements

Aim for high contrast between your font and background colours. Tools in the ‘Read more’ section should help with picking accessible colours.

Images should not be the only method of communication, because images may not load or may not be seen. Avoid using images when the same information could be communicated in writing.

HTML vs PDF

Content should be published in HTML rather than PDF format, as PDFs are harder to find, use and maintain. For more on why you should avoid using PDFs, or at least supplement PDFs with a HTML version, see this blog from the Government Digital Service.

Learn more about accessibility

• Understanding legal requirements for public sector organisations

• Designing for Screen Reader Compatibility

• WAVE Web Accessibility Evaluation Tool