Introduction: Visual design and colours

About visual design and colours

This module covers topics to help make user interface design and visual design more accessible to people with disabilities. Topic includes colour, contrast, positioning labels, text spacing, CSS-generated content, hiding content, and exposing content on hover or focus.

Accessible visual design benefits everyone including people with disabilities:

  • People with partial sight and colour-blindness benefit when information conveyed by colour is available in other visual ways.
  • People with low vision and colour-blindness can read text that meet minimum contrast ratio.
  • People with dyslexia may increase space between lines, words, and letters to improve reading.
  • People using screen readers benefit by accessing text alternatives of CSS-generated content.
  • People using screen readers benefit from hiding inactive and redundant content.

These visual design concerns are discussed in module 3:

Related WCAG resources

Related WCAG resources

Success criteria

Back to top