DONATE

General accessibility guidelines

This guide will help you to create content that is accessible and inclusive for as many people as possible.

Screen readers

Screen readers convert text and image content into speech or braille. They help people with visual impairments or conditions such as dyslexia to interact with a computer, phone or tablet without needing to see a screen or use a mouse.

Screen readers read content from left to right and row to row, so it’s important to use headings to structure your content in a logical way.

A screen reader will not read text in a logical order if the content is spread across a page without structure.

Alt text is a simple description of an image that is read aloud by screen readers. The description should be brief and in context.

There’s no need to write “Image of…” or “ Picture of…” – the screen reader will do this automatically. If the image contains a graph or other numerical data, include key points from the data in the alt text.

  • Instead of: An image of a cow in a field of grass and dandelions.
  • Try: A cow in a field of grass and dandelions.

Read our full alt text guidelines

Images and graphics that aren’t essential for understanding the content, such as background graphics, icons and generic images, should be marked as decorative.

This will tell a screen reader to ignore them when reading page content.

It helps screen reader users avoid unnecessary audio ‘clutter’ when they’re trying to navigate a page, enabling them to focus on the most important content.

You should also mark an image as decorative if it already has a caption that contains the information you want to convey. Alt text that contains the same information as the caption is of no benefit to screen reader users.

To mark an item as decorative, type empty quote marks (“”) into the alt text field. Some software also has a ‘Mark as decorative’ check box in the alt text pane.

Read our full alt text guidelines

Screen readers can’t read text that is embedded in an image.

This includes labels on graphs and charts. It will need to be included in the alt text.

Hyperlinks should convey clear and accurate information, describing where people will go if they click the link.

People who use screen readers may scan through a document looking for links, so avoid using link text such as ‘click here’, ‘learn more’ or ‘link’. These are meaningless when read out independently, because users won’t know what they link to.

  • Instead of: Read more
  • Try: Read our general accessibility guidelines

Use a different colour to highlight the hyperlink text and underline it, so people who are colour blind can recognise that the text contains a link.

  • Does the screen reader read the content in a logical order?
  • Are any sections of the text skipped over?
  • Is it easy to reach the main content? There should not be a lot of ‘blank’ entries read out before the main content begins.
  • Is anything additional read out at the end of the content? This should be avoided wherever possible.
  • Can the user easily establish where they are in the content?
  • Is it easy to use menus or a contents page to navigate the content?
  • For websites, is it easy to find the search function or get to the home page?
  • Are all elements easy to access using keyboard shortcuts only?

Text

Check that the fonts are clear and the letters in words have adequate spacing between them.

Text for websites and documents should be at least 12 point in size.

Text for PowerPoint presentations should be at least 20 point.

Designs that use only one or two typefaces, weights and styles are usually easier on the eye.

Too many different typefaces can create a confusing visual layout, particularly for people with reading difficulties such as dyslexia.

Aligning all text to the left (in languages that are read from left to right) makes it easier for people to see where each line begins. This includes text in tables, headings and diagrams.

Avoid justified text, where both the left and right edges of each line are aligned with both margins. This creates uneven gaps between words, making it harder to read.

Avoid centred text: this makes it difficult to see where each line begins.

If you add extra spacing or paragraph breaks using the Enter key, these will be read out by a screen reader as ‘space’, ‘blank’ or ‘return’, which can be annoying for listeners.

If you need to add larger spaces between lines, use the paragraph space settings within the software you’re using.

For example, in Microsoft Word:

  1. Click the pop-out arrow on the Paragraph menu
  2. Click the ‘Indents and Spacing’ tab
  3. Use the up and down arrows in the ‘Spacing’ section to increase the space before or after each paragraph.

Only capitalise the first letter of a sentence (this is known as sentence case).

Avoid words written all in upper case: they can be problematic for people with dyslexia and visual impairments.

Upper case can also be tricky for screen readers, which may interpret consecutive upper-case letters as acronyms. For example, if you write ALL, a screen reader may spell it out as ‘A, L, L’.

  • Instead of: World Health Organization Launches Innovative NEW Campaign
  • Write: World Health Organization launches innovative new campaign

Screen readers do not always recognise symbols, so it’s usually safer to use words instead. For example, use ‘per cent’ instead of %. The exception is currencies (£, $, €).

Underlining and italics can make words difficult to read. Use regular fonts for your main text, and bold for headings and to highlight key words if necessary.

Large passages of bold text are hard to read, and some screen readers will shout out words in bold, so use them sparingly.

Ensure there enough contrast between normal body text and text that has been highlighted for emphasis.

As well as using a different colour, you should also use a different font weight (such as bold) to make sure the emphasis is clear to everyone.

Ensure the number of characters per line of text is appropriate for the format.

For example, depending on font size, print and web text should be kept to a maximum of about 60-70 characters per line. Video captions should be a maximum of 40 characters per line.

This will ensure the text is as easy to read as possible.

Visual

Good colour contrast between text, images, logos and the background will make your content legible and easy to identify.

People with colour blindness may not be able to tell the difference between certain colours such as red and green, so black text on a white background is usually the first choice for maximum legibility.

The Web Content Accessibility Guidelines state: “Text and interactive elements should have a colour contrast ratio of at least 4.5:1. This ensures that viewers who cannot see the full colour spectrum are able to read the text.”

How to check colour contrast

There are several ways to check the colour contrast of your work. You can use Adobe Contrast Checker (you will need to enter the hex code of each colour to check the contrast), or by viewing your work in greyscale. You should also check that your work can be viewed in dark mode, too, which is often preferred by people with low vision or light sensitivity.

How to find a hex colour value in Microsoft applications such as Word, Excel, PowerPoint and Outlook

  1. Open a file in your chosen application
  2. Highlight the text or object you want to check
  3. Select the Font Color button in the ribbon and click More Colors
  4. Click the Customs tab. You will now be able to see the RGB values and hex colour value
  5. If your version only shows the RGB values, enter them on an online RGB to hex converter to find the hex colour value

How to view your work in greyscale

  1. Open System Settings on Mac or Windows
  2. Head to Accessibility and Display (Mac) or Ease of Access (Windows)
  3. Mac: at the very bottom, click the toggle next to ‘Color filters’ (Grayscale is the default)
    Windows: at the very top, click ‘Turn on colour filters’ (Grayscale is the default)
  4. Viewing your work as a set of shades of grey will enable you to see whether there is sufficient contrast between the colours

How to view your work in dark mode

  1. Windows: navigate to Settings, Personalisation, Colours and then select Dark
  2. Mac: navigate to System Settings, Appearance (in the sidebar) and then select Dark

Include a background tint on PowerPoint presentations.

A pure white background can cause problems for people with visual impairments or neurodiverse conditions. A very pale grey often works well.

  1. In PowerPoint, click the Design tab
  2. Click the Format Background option on the right side of the Design tab
  3. In the Format Background pane that opens, choose Solid fill
  4. Use the drop-down Color box to choose the colour you want to use

Charts and graphs must be clearly labelled and should not solely rely on contrasting colours.

Use additional patterns or data labels to make it easier for readers to differentiate each piece of data.

People with low vision or colour blindness usually find it easier to differentiate segments of a chart or graph if contrasting tones and shades are used.

If graphs contain axis labels or other text explaining the data, make sure the text is large enough to read.

Where possible, use crisp, clear, high-resolution photographs, and ensure they accurately reflect the information they’re portraying.

When placing text over a picture, ensure the text contrasts sufficiently with the background to make it legible. Avoid low-resolution, blurry images.

Add alt text to images, including photographs, charts, icons, logos and diagrams.

This will allow people using screen readers to recognise them.

Read our full alt text guidelines

Ensure logos have enough contrast so that they stand out against the background.

There should also be sufficient white space between logos and surrounding text. Separating elements in this way will allow your content to read much more easily.

Language

Complicated writing can be confusing and hard to understand. It can be particularly difficult for people with dyslexia, autism or other cognitive conditions, or for people whose first language isn’t English.

When writing, think about the words you use when having a conversation. Remember that our brains take in information more easily when it’s broken into small chunks.

It’s good practice to read your writing aloud, line by line, removing unnecessary words and rewriting sentences if they seem too long. If you come across large blocks of text, break them up into shorter paragraphs.

  • Instead of: We are a leading NGO with a presence in more than 30 countries, building synergies to facilitate the avoidance of blindness and increasing capacity to promote equality of opportunity for people with disabilities.
  • Try: We are an organisation working in more than 30 countries. We prevent avoidable blindness and fight for disability rights.

Think about the words you use.

Can you use shorter, simpler words instead of longer, more complex ones?

  • Instead of: Commence
    Try: Start
  • Instead of: Discontinue
    Try: Stop
  • Instead of: Facilitate
    Try: Help
  • Instead of: Adjacent to
    Try: Next to

Bullet points can help your audience to read and digest information quickly.

Instead of: The most common signs that a person is suffering from trachoma include discharge from the eyes, irritated eyes and redness.

Try: Common signs of trachoma:

  • Discharge from the eyes
  • Irritated eyes
  • Redness

Do not replace bullet symbols with other icons or characters, as screen readers may read them out, making it confusing for users. If you use a tick symbol, for instance, a screen reader may read the word ‘tick’ aloud.

Jargon and acronyms may only make sense to people who live in a particular region or work in a specific industry.

Make your language as clear as possible by avoiding acronyms where you can. The exception is if the acronyms are more commonly recognised than when spelled out in full: for example URL, DVD or USB.

  • Instead of: We are an NGO that works with the WHO to treat and prevent NTDs.
  • Try: We are an international organisation that works with the World Health Organization to treat and prevent neglected tropical diseases.

If you need to use acronyms, it’s best practice to write the full wording first, followed by the acronym in brackets. After this, use the acronym.

  • For example: We work with the World Health Organization (WHO) to fight disease.

If you’re mentioning a lot of organisations, phrases and words that need to be abbreviated, include them in a glossary so readers can refer to the glossary for more information.

These follow the sequence: subject > verb > object.

Active sentences are direct, easy to understand and close to how people speak.

  • Instead of: Some ice cream is wanted by me now.
    Try: I want some ice cream now.
  • Instead of: The medication was prescribed by the doctor.
    Try: The doctor prescribed the medication.

Digital

This enables people to adapt the content according to their needs and still understand it.

Always use the appropriate HTML header tags for headings and use the correct HTML for all structural elements. All pages should have clear, unique titles.

Use alt text for all logos, photographs, graphs and illustrations.

Alt text is a short description of an image that is read aloud by screen readers, helping people with visual impairments to understand content.

Read our full alt text guidelines

Captions, text transcripts, audio description, sign language and audio-only formats all provide an alternative way to convey the information.

They also enable a wider audience to access your content.

Instructions such as ‘Click the green button’ may be meaningless to people with colour blindness if they can’t see which button is green.

Similarly, ‘Click the button on the right’ won’t be useful for a screen reader user if they can’t see where the button is located.

To avoid this, you should never rely solely on shape, sound, position or size to describe buttons or actions. It’s much better to use several different descriptions, so people have more than one way to identify what they need to do.

  • Instead of: Click the red button
  • Try: Click the red ‘instructions’ button on the right

Layout

When designing layouts, always use style sheets or paragraph styles for headlines, standfirsts, body text and captions.

This helps with legibility and will also tag the headings, enabling screen readers to navigate from headline to headline, instead of reading the whole document word by word. Cluttered layouts with information spread across a page can be overwhelming and hard to follow.

Tagging will tell a screen reader what kind of element it’s looking at – a headline, text, a picture or something that doesn’t need to be read at all.

Text styles within a document can each be automatically linked to specific tag, so the only manual step is to define ‘figures’ (pictures) and ‘artefacts’ (elements that don’t need to be read out by a screen reader). For example, it’s good practice to remove page numbers from tags so they’re not picked up by screen readers.

For more about tagging, see the Portable Document Format (PDF) accessibility guidelines.

Break up content with headings, images, videos and white space to make it more legible.

In long documents, include a table of contents to help readers find specific sections.

Avoid large blocks of text in a video or more than seven bullet points on a presentation slide.

Footnotes and endnotes should be the appropriate size for the format.

These should be a minimum of 12 point in printed formats (there may be exceptions for academic publications). Footnotes should appear at the bottom of the page.

For more ways to be accessible, see all our topics

Accessibility home page