Table

Use when

• Providing an overview of large amounts of structured data

Example

Recommendations

• Standardize how we apply tables so users will recognize patterns in layout and usage. Display only the most relevant data, don’t overload the table.
• When no data is available (yet), display a message with a link inside of the table body.

Columns

• First column: Object name or identifier.
• Last column: Operations (if applicable).
• Use distinct column names.
• Limit the number of columns to 5.
• Avoid columns in which the content of almost all rows is the same.
• Avoid column with similar data. e.g. "Category" and "Section".

Operations

• First operation: "Edit".
• Last operation: "Delete".
• Use distinct operation labels. e.g. not: "Clone" and "Copy".
• Limit the number of operators to 4.

Rows

• Provide a pager when more than 50 rows can be expected. Except when the table has dragable rows.
• Provide a data filter when more than 2 pages of data can be expected.

Empty text

• Use Text pattern "No [things] available.".

API

Implement using theme('table'), see documentation.

Problem it solves

When listing hierarchical or structured data in a table:

• It is difficult to find data within the table when too much data or too much irrelevant data is listed.
• The purpose of a table is not clear when the table is empty.