Only use tables to present data.
Never use a table to create a custom layout or for any other purpose than to display
Create tables using OU Campus table snippets.
Tables should be built using the Responsive Table and Data Table content snippets provided in OU Campus, rather than via the table icon in the editor
toolbar. These snippets automatically create a single header row for your column headings
and make it easier to create tables that comply with accessibility guidelines.
Do NOT delete the header row.
OU Campus table snippets provide a header row by default that requires you to add a heading for each column. Each table should have only one header row.
While editing snippets, header rows will have a dark grey background and red text. Don't worry about color contrast — this is NOT how the styling will appear on the public site.
If you delete this header row, you will have to add it back manually.
Adding a Header Row in OU Campus »
Write clear column headings.
Give each column a heading that clearly describes the data it contains.
Example: Clear Column Headings
Complex Tables with Merged Cells
It can be very confusing for those using screen readers to understand tables with merged cells, so you should avoid merging rows or columns whenever possible.
If your table must use merged cells, you can create the table via the Table icon in the editor toolbar but you will need to manually add a header row to ensure the accessibility of your table. You will also need to test that your table is still usable on mobile devices.