← Back to Test Site

Page 6: Tables & Data Structure

This page tests accessibility issues related to data tables, lists, and semantic HTML structure.

Table Without Proper Headers

Issue: Table has no th elements, only td elements. Headers not marked as headers.
Product Q1 Sales Q2 Sales Q3 Sales
Widget A $50,000 $62,500 $75,000
Widget B $30,000 $35,000 $40,000

Table With Incorrect Header Associations

Issue: Table cells reference headers that don't exist or are incorrect.
Month Revenue Expenses
January $150,000 $100,000
February $160,000 $105,000

Table With Duplicate Headers

Issue: Table has a caption that duplicates the summary attribute text.
Sales Data Summary
Department Budget
Marketing $500,000
Engineering $1,000,000

Incomplete Data Table

Issue: Large table (>3x3) without sufficient header associations.
Metric 2021 2022 2023
Users 10,000 25,000 50,000
Revenue $1.2M $3.5M $7.8M
Growth — 150% 100%
Market Share 2% 5% 12%

Structure Issues: Definition Lists

Issue: Definition list items exist outside a dl container.
Term 1
Definition of term 1
Term 2
Definition of term 2

Structure Issues: List Items

Issue: li elements used outside of proper list containers.
  • Item 1
  • Item 2
  • Item 3
  • Should be in ul
  • This is semantic error

    • Correct Examples

    Properly Structured Table

    Sales Data (Correct)
    Product Q1 Q2
    Widget A $50,000 $62,500

    Correct Definition List

    HTML
    HyperText Markup Language
    CSS
    Cascading Style Sheets

    Correct Lists

    1. Ordered item 1
    2. Ordered item 2

    Summary of Issues