Inclusive Design Tip : Blurred vision

A visual tip

Why do it

People with impaired vision struggle to read small text and low contrast colours.

What to do

Things to check

  • How does your site look?
  • Can you still read your menus, calls to action and text?

Things you could change

  • Use a bigger base font-size. 100% is a good minimum.
  • Use text that users can adjust (e.g. let users change text size and colour). Don’t have lots of text embedded inside images: rather use text with the image as a background.
  • Make sure text has good foreground/background contrast. See the Web Content Accessibility Guidelines (WCAG) 2.0 on colour contrast. A ratio of 4.5:1 gives you WCAG AA compliance (“you’re doing great for Web Content Accessibility”) and 7:1 for WCAG AAA compliance (“you’re doing amazing for Web Content Accessibility!”)