Skip to main content

Fonts and text styling

  • Sans-serif fonts like Open Sans, Roboto and Arial are much easier to read as body text, especially with longer digital documents, as compared to serif fonts.
  • Serif fonts like Times New Roman, Frank Ruhl Libre or Playfair Display can be a good choice for titles and headings. Serif fonts are preferred for longer printed documents.
  • Avoid overly decorative fonts like Comic Sans, Abril Fatface or Rubik Glitch Pop. They can be used sparingly for logos or special text but may need to be accompanied by a more readable version.

Choosing the right font for your project with universal design in mind is all about making sure it's accessible and easy to read for everyone. You've got a message to communicate, but it won't reach many people if it's not useable. Here are some tips to help you select fonts:

  1. Legibility: Pick a font that's easy to read. Sans-serif fonts like Arial, Verdana, Tahoma, Calibri or Helvetica are usually good choices because they have clean, simple lines.
  2. Size: Make sure the font size is large enough. For body text, aim for at least 12-14 points. For headings, go even larger. Whatever medium you choose, the Web Content Accessibility Guidelines (WCAG) guidelines require that users can enlarge your text up to 200% without losing functionality.
  3. Contrast: Ensure there's a strong contrast between the text color and the background. Black text on a white background is a classic example; white text on a black background has the same contrast ratio.
  4. Avoid Fancy Fonts: Stay away from overly decorative or script fonts for body text. They can be hard to read, especially for people with visual impairments. Limit the use of underlines, italics, or strikethrough text.
  5. Consistency: Use the same font(s) throughout your project to maintain a clean and professional look. Make sure that headings, navigation menus, and other elements that have a similar function are styled the same way.
  6. Test It: Try your font choices on different devices and screen sizes to make sure they look good everywhere. Share your draft with colleagues, stakeholders, and community members and use their feedback to improve.

Learn more about font selection: How to Choose ADA-Compliant Fonts in 2024: A Complete Guide - accessiBe