Empty Table Headers in Drupal
Table headers play an important role in accessibility. They help screen readers communicate the relationship between rows and columns, making it easier for visitors to understand the information in your table. Without headers, data can be read back in a way that is confusing or incomplete.

Adding Table Headers

To make your tables more accessible, be sure to add table headers. Depending on your table’s content, you may need to set headers for the first row, the first column, or both.

Make the first row a header

  1. Click into any cell within the first row of the table
  2. In the menu that pops up, click the row icon
  3. Toggle on Header Row

Make the first column a header

  1. Click into any cell within the first column of the table
  2. In the menu that pops up, click the column icon
  3. Toggle on Header Column

Make both the first column and first row table headers

Perform both steps above to ensure they are recognized as headers

Use of tables for organizing content and page layout

Do not use tables for organizing content or for creating page layouts. 

Assistive technologies, such as screen readers, have difficulty navigating tables that are not used for actual data sets. This can lead to content being read out of order or being missed entirely, creating a confusing and frustrating experience for visitors.

On the consolidated Drupal website (any site beginning with cse.umn.edu), we recommend using the Advanced Page content type. With this option, you can build robust layouts using the Section widget, adding as many rows as needed, with one to five columns to display your content.

For Drupal Lite websites, we recommend using Layout Builder to create rows and columns for your content.

Related resources