Visual Design and Colors

Visual Design and Colors (WCAG 2.1)

Already enrolled? Login now.

Technical level: Intermediate (knowledge of HTML required)

Duration: 1 hour 15 minutes (online self-paced class, estimate)

IAAP Education Credits: 1.25 (This course counts toward renewal of IAAP certification)

Course Synopsis:

Techniques for accessible visual design, including use of color, color contrast, visual layout, visual focus indicator, etc.

Course Topics:

  • Color
    • Color that Conveys Meaning
    • Color to Distinguish Links from Text
    • Color to Distinguish UI Components
    • Allowing Customizability
  • Contrast
    • Text Against the Background
    • Non-Text Contrast
    • Focus Indicator
    • Boundaries Between UI Components
    • Testing for Sufficient Color Contrast
    • Windows High Contrast Mode
  • Visual Layout
    • Visual "White Space"
    • Visual Proximity of Labels
    • Layout Design to Enhance Visual Discoverability
  • Target Size
  • Reading Order, Focus Order
    • Reading Order
    • Focus or Tab Order
  • Typography
    • Legibility of Fonts
    • Spacing of the Lines and Paragraphs
    • Column Width
    • Line Justification
    • Visual Customizability
  • CSS-Generated Content and Hidden Content
    • CSS-Generated Content
    • Visually Hidden Content