Tables

Issue: If you don’t use meaningful language in your header and set your top row (and your left column if applicable) as a header, a screen reader will read your table from left to right, line by line and the listener will lose all context for relationships between headers and data.

Who’s affected: Screen reader users (blind).

WCAG standard: Guideline 1.3.1: Information and Relationships

What to do: Create simple, non-nested tables that do not merge rows. Designate headers as headers within the content management or word processing app you’re using. Options for turning on headers varies from one environment to the next. Best practice is to include a caption that succinctly describes the purpose of the table.

M&M Color analysis

RedGreenBlueOrangeYellowBrownWeight
1593391949.79
9171933848.98
1486819450.40
1573816849.16
1037922447.61
Contents of five bags of M&M candies separated by color and weight of each bag

Recommended tools: