Prepared Docs

Prepared Docs

⌘K

    Loading navigation…

User

  1. Components
  2. Table
  3. Accessibility
  4. Keyboard Navigation

Table

Keyboard Navigation

Keyboard Navigation

Tables support standard keyboard navigation.

Cell Navigation

Navigate between cells using arrow keys.

  • Arrow Right: Move to next cell
  • Arrow Left: Move to previous cell
  • Arrow Down: Move to cell below
  • Arrow Up: Move to cell above
  • Tab: Move to next focusable element outside table

Focus Indicators

Focus indicators show current cell position.

  • Focused cells show clear visual indicators
  • Keyboard users can see current position
  • Focus moves logically through table structure

Header Association

Proper header association ensures screen readers understand relationships.

Column Header Association

Column headers are associated with data cells.

Screen readers announce: "Item 1, Name column, 100, Value column"

Row Header Association

Row headers identify row content.

Screen readers announce: "Product A, row header, Price: $100, Stock: 50"

Colspan Accessibility

Colspan cells maintain accessibility.

  • Colspan headers are properly announced
  • Screen readers understand merged cell structure
  • Users understand which columns are grouped

Previous

Accessibility / Screen Reader Support

Next

Accessibility / Complex Cell Content

On this page

Keyboard Navigation
Cell Navigation
Focus Indicators
Header Association
Column Header Association
Row Header Association
Colspan Accessibility