Build Better Content Readability

Accessibility Interactions

  • Text: Poorly formatted page text itself can harm your page's readability. For example,  long paragraphs are difficult to read on digital screens. Similarly, poor text spacing, such as word spacing created by justified text, makes pages hard to read for people with dyslexia.
  • Text Magnification: People use assistive technology, such as screen magnifiers or browser-based accessibility tools, to make our content text larger, alter the font, or text line spacing.
  • Lists: Assistive technology announces the presence of numbered or bulleted lists as they are encountered in the reading. It also states the number of items in the list before reading the individual items.
  • Readability: Literacy research has concluded that half of American adults can’t read a book written at an eighth-grade level. Thus, we need to carefully watch how our sites are written for maximum comprehension.

Best Practices

Text size and appearance

  • Use sans-serif fonts: San-serif fonts for paragraph text are easier to read for users with low vision. Serifs, the brackets at the tips of the letters, can help people with good vision read print text more quickly, but the serifs can distort the shape of the letters for people with low vision online.
  • Font size: For website body text, use 16px or 1.0-1.2em font size where possible. Use at least 18px font size if the user cannot change the font size using keyboard commands or other assistive technology.
  • Use relative text sizes: Use relative text sizing whenever possible — such as small and x-large, or 1.5em and 90%. Relative sizes allow the browser built-in assistive tools to gracefully enlarge your text.
  • Avoid underlined text: Underlined text can make the text appear to run together. The text can also be misinterpreted as a link.
  • Avoid italics for emphasis: Use the bold button in your content management system for emphasis. In HTML, use the <strong> tag instead of <b> for bold text.
  • Case: Avoid using all capital letters and uppercase letters for continuous text.
  • Color contrast: Ensure good color contrast for text — ideally dark type on light background. See our color page for details.

Paragraph formatting

  • Text alignment: Left align text to keep word spacing consistent. Avoid justified text as it frequently results in irregular word spacing that make your text harder to read.
  • Font choice: On a given page ideally use only one heading font and one paragraph font. Avoid mixing fonts within the same paragraph. 

Lists

  • Use numbered (ordered) lists for lists requiring stepped order such as recipe instructions.
  • Use bulleted (unordered) lists for other purposes. If order is not critical then using the bulleted list tool works perfectly.
  • Use the built-in tools on your formatting bar to build ordered (numbered) and unordered (bulleted) lists.

Language and Readability

  • Use the most appropriate language and writing style for your audience. A corporate library would use language and terminology found in the company’s field. A public library would likely not use the same language.
  • Write in shorter, clear sentences and paragraphs.
  • Use headings to break your articles into readable sections of text.
  • Avoid jargon and figures of speech. Similarly avoid using unnecessarily complex words and phrases. If this is unavoidable, consider providing a glossary for terms readers may not know.
  • Expand acronyms on first use. For example,
    • “The Web Content Accessibility Guidelines (WCAG) are the source for many of these writing tips.”
  • Consider illustrations (images, video, audio) to help clarify meaning.
    • Don't forget to include alternative methods for understanding illustrations such as alternative text for images and closed captioning/transcripts for video.
  • Use inclusive language and avoid ableist words
    • Use conversational, concise plain language and avoid phrases like crazy, dumb, and lame which have anti-disability connections.

Testing

  • Zoom your fonts: Use Command + or Control + to enlarge your type to at least 400%. Is your page still functional? If not, examine how your fonts are sized and/or talk with your website manager about the overall site. (Control-0 returns you to normal size). Here's a video that describes zoom testing.
  • Editing is fabulous: Having someone else critique and/or edit your work before publishing is the perfect way to catch readability issues.

Learn More...