Accessibility - Best Practice: Text

Writing style

• Always write with accessibility in mind by using short, simple sentences.
• Use plain language, and avoid jargon and abbreviations.
• Break content into small paragraphs with white space for easier reading.
• Make sure your key message is at the beginning of each section or paragraph.
• Use descriptive text to explain the purpose of a button rather than vague language like "click here'.
• Avoid writing in all caps - this can be can be difficult to read as it reduces the visual distinction between letters. 

Text Formatting

• Use a Story panel for any Headings, and ensure a Text panel is used only for body text.
  • Story panels use H2 for Headline, Paragraph for Strapline and Paragraph for Body.
  • Text panels use Paragraph for Body.
• Avoid underlined/bold/italic text, as this can be difficult for dyslexic readers.
• Most screen readers don't announce bold or italic text, so any emphasis is lost on a screen reader, a underlined text can be mistaken for a link.
• Avoid using a font that is too small to read - consider using interactivity, such as a More Information pop-up box, if you would like to add more content.
• Ensure there is suitable spacing between lines, as tight line spacing can cause lines to crowd together, making it harder for users to distinguish between them.

• Ensure there is plenty of white space between paragraphs, headings, and sections. This creates a cleaner, less cluttered appearance and improves readability.

• Add adequate margins around content to avoid the text being too close to the edge of a panel or page.

Font Types

• Accessible fonts should be easy to see, read and understand for everyone.  
• Avoid decorative or overly complex fonts that might be hard to read.
• Use standard web-safe fonts that are widely supported across devices and platforms - suggestions include Roboto, Open Sans, Lato, Nunito/Nunito Sans, Merriweather, Source Sans Pro and Inter. All suggest fonts are available from GoogleFonts.
• Stick to a small set of font families for consistency and readability. Don't mix too many different fonts in one page.

Images

• Avoid images that include lots of text, as this won't be read out by screen readers.
• If text in an image is necessary, ensure that the font is legible, has enough contrast, and is accompanied by alt text describing the message.
• Include alt text for images:
  • aim for 125 characters or less.
  • describe the content of the image without being too wordy.
  • avoid redundant phrases like "image of" or "picture of" as screen readers already know it's an image.