KM Design System
  • KM Design System
  • Getting Started
  • Create An Article
    • Standard Template
    • FAQ Template
    • How-To Template
    • KCS Template
    • Known Error Template
    • Known Issue Template
    • Service Description Template
    • What Is Template
  • Contribute To the Design System
  • Requesting Help
  • Writing
  • Accessible Writing
  • Fonts & Typefaces
  • Grammar & Mechanics
  • Headers
  • Meta Tags
  • Title Capitalization
  • Web Components
    • Accordion
      • How-To Apply Accordion
      • Accordion Bug
    • Horizontal Rule
    • Images
    • Links
      • How To Apply Link Variant
    • Tables
      • How To Create Accessible Tables
      • Styling & Formatting (coming soon)
  • Patterns
    • 3 Card Layout
      • Article 3 Card
      • Category Desc 3 Card
  • Release Notes
    • March 18, 2021 Release
Powered by GitBook
On this page
  • 1. Creating your table using the editor toolbar.
  • 2. Designate your header cells.
  • 3. Apply a caption to your table

Was this helpful?

  1. Web Components
  2. Tables

How To Create Accessible Tables

Follow the steps below and learn how to make your tables accessible for screen readers.

PreviousTablesNextStyling & Formatting (coming soon)

Last updated 4 years ago

Was this helpful?

1. Creating your table using the editor toolbar.

Select the table button in your toolbar. Mouse over "Table" and configure the number of rows and columns that you require to display your data.

2. Designate your header cells.

Place your cursor inside of a header cell. Select the table button and navigate to Cell > Cell Properties. Under the "Cell Type" dropdown menu, select, "Header cell". Repeat this process for every cell in your table. This applies to headers at the top of columns AND the beginning of rows.

3. Apply a caption to your table

A table with two columns and nine rows being created.
A cell having the "header" cell property applied.