A table displays data in rows and columns.
When and how to use it
A table helps visitors scan and understand information by grouping similar content.
Use the table component to show long lists of sequential or structured content. This makes your content easier to read and compare.
Tables also help users find specific information within a large data set. For example, someone looking for their body mass index (BMI) might find it easier to spot the intersection of their height and weight than reading a paragraph of text.
A table should include a table caption to provide brief descriptive text about the data. Tables must identify any row and column headers. Table headers should never be empty.
How not to use it
Tables do not inherently place information in a logical order. Determine the best order for your content (sequential, chronological, alphabetical), and keep it consistent.
Avoid using tables to display long-form content. Consider using a normal page with headings instead.
Also avoid complex tables with multiple merged cells; these are hard to understand and difficult to make accessible. Instead, consider using more than one table.
Do not use a table to demonstrate complex relationships in the data. Use a bar graph, infographic or chart instead.
Do not use a table to format a web page.
Standard accessibility review
Each time a new component version is published: