What accessibility considerations apply to data tables in UI design?

• A. Use semantic table markup, caption, thead/tbody; provide row/column headers; ensure keyboard navigation and minimal required reading.
• B. Use divs with role='table' exclusively and avoid actual table elements.
• C. Do not provide headers to reduce clutter.
• D. Only provide data in a single row.

Answer: (A)

Accessible data tables rely on semantic markup that clearly communicates structure to assistive technologies. Using the actual table element with a header section (thead), a body (tbody), and header cells (th) lets screen readers distinguish headers from data and understand how they relate to each cell. A caption adds a concise description of what the table shows, which helps all users grasp the context quickly. Connecting header cells to the data cells is essential—placing headers in the top row and/or first column and using scope attributes (for example, scope="col" for column headers and scope="row" for row headers) enables assistive tech to announce the relevant header as focus moves through the table.

Keyboard navigation should work smoothly across the table, with no traps or inaccessible controls inside cells, so users can move and read data predictably. Providing headers and a clear caption also supports minimal reading, letting users get the gist of the table without extra effort.

Using divs with role="table" instead of native table elements can strip away many built-in accessibility features and lead to inconsistent experiences across browsers and screen readers. Omitting headers deprives users of essential context, and data presented in a single row often lacks the structure that makes it meaningful to interpret, especially for assistive technologies.