Strategies
Related Guidelines1: WCAG 1.1.1, WCAG 1.3.1, WCAG 1.3.2, WCAG 1.4.3, WCAG 1.4.5
Tables can be a great way to organize information for students. However, if you use a table in a slide, it’s important to make sure the table is accessible for your learners. Below, we’ll detail some important things to keep in mind for creating or including accessible tables.
But first, there are two ways to add a table to your slide: you can add an image of a table, or you can build a table with the built-in editing tools.
- To add an image: Upload an image of a table to the slide.
- To use built-in editing tools: Open the software you are using to create the table and access the built-in editing tools to do so.
Image Table
When using an image of a table, it’s important to keep in mind that learners cannot highlight individual words or use a screen reader2 to read the contents.
As a solution, we recommend adding alternative text (i.e., alt text)3 to make the table accessible to learners who use screen readers. How descriptive the alternative text needs to be depends on the purpose of the image. For more on this, review Alternative Text.
Just as when you use colors with text, with tables it’s important to use a color contrast tool. For more on this, review Color Contrast.
Built-in Editing Tools
Built-in editing tools can be a big help when it comes to making a table accessible for all learners. If you use the built-in editing tools provided by the software, such as Google Slides or Microsoft PowerPoint, the result is usually an HTML table, which a screen reader will know how to read. Note that you can also click on and highlight individual cells and words.
Layout
| Column 1 | Column 2 | Column 3 |
|---|---|---|
| data cell | data cell | data cell |
Here are a few tips to consider when creating a table with built-in editing tools:
- If possible, only use tables for data or other information. As tempting as it may be, try to avoid using them for page design and layout purposes (e.g., to place elements in a certain way on a page).
- Try to keep the table’s layout simple (e.g., a single header column, and/or row).
- Finally, when possible, verify that the table makes sense when reading the cells from left to right, top row to the bottom row. If it does not, consider changing the layout, as learners who use screen readers may struggle to understand the information in the table.
Cells
If your table requires a more complicated layout with multiple layers of column and row headers, consider using a list instead.
Manipulating or changing the cells in a table can complicate a screen reader’s ability to be effective.
Here are a few things to help make sure your table – and its cells – are accessible:
- Try not to merge, span, or split cells.
- Try to avoid using empty cells.
Colors
Whenever possible, we encourage you to use a color contrast checker tool. For more information on this, review Color Contrast.
Specific Tools
Google Slides
Built-in Editing Tools
To add a table to a Google Slide using the built-in editing tools:
- Go to Insert > Table.
- Select the size of the table (e.g., 4×4, 3×2, 2×3, etc.).
Image
Alternatively, take the following steps to add an image of a table:
- Go to Insert > Image.
Once you have added the table, remember it’s important to add alternative text to the image.
- Right-click on the image > Alt Text.
For more detailed instructions on how to format tables in Google Slides, see Add and Edit Tables in Google Docs.
Microsoft PowerPoint
Built-in Editing Tools
To add a table to a Microsoft PowerPoint slide using the built-in editing tools:
- Go to Insert > Table.
- Select the size of the table (e.g., 4×4, 3×2, 2×3, etc.).
To designate a header row, which will label it as such in the HTML:
- Click the table on the slide.
- Go to the Table Design menu that appears.
- Check the box next to Header Row.
Image
Alternatively, you can add an image of a table.
- Go to Insert > Picture.
Once you have added the image, add alternative text to the image.
- Click on the table image so that it is selected.
- Go to Picture Format > Alt Text.
For more detailed instructions on how to format tables in Microsoft PowerPoint, see Add and Edit a table in PowerPoint.
Tips
Simple Tables
Simplicity is key: Even though it may be tempting to do so, try to avoid using a slide presentation tool to create a complex table. By keeping the table design very simple, e.g., just a few rows with a single header row at the top, the table retains functionality. For more details about why this is important, visit Context.
Accessibility Checker
Some programs can help you to search for and track accessibility errors. Microsoft PowerPoint has an Accessibility Checker that generates a list of errors.
Tip: This technology is not perfect and cannot flag all errors. Because of this, if possible, we recommend doing a manual review as well.
For more detailed information about the accessibility checker in Microsoft PowerPoint, see Microsoft’s Improve Accessibility With The Accessibility Checker.
Getting the Hex Code of a Color in a Table
A hex code is a hexadecimal format for identifying colors, and it will help you to ensure a document’s readability for accessibility purposes. The hexadecimal format is a system used in HTML, CSS and SVG. Each hex code is unique to a specific color, with each 2 digits referring to the level of red, green, or blue in the color. Hex codes can help you ensure that your document, and specifically your table, has high contrast.
Image on a Slide
If your slide has an image that you did not create, the easiest way to get the hex code of a color is to download and use a browser plugin. Accessible Color Picker is one option, but there are other free tools available. With this tool, you can click on a color in an image and it will generate a hex code, but note that, if using Microsoft PowerPoint, this will only work if you open the document in a browser.
Built-in Editing Tools
When using the built-in editing tools to create a table, both Google Slides and Microsoft PowerPoint provide the hex codes of any color you use.
Google Slides
For example, in a Google Slide:
- Select any text box on your slide and then left-click Filler Color (paint can icon) or Border Color (pencil icon) along the top ribbon of icons.
- In the drop-down menu, underneath the Custom heading, left-click the Add a Custom Color (+) icon.
- Note the hex number at the top of the dialogue that appears to the right of Hex. This number will adjust to reflect the color that you choose in the box below by clicking the different areas, adjusting the Hue and Transparency.
Microsoft PowerPoint
In a Microsoft PowerPoint:
- Click into the textbox or shape, and then go to Shape Format in the Microsoft navigation.
- Under Shape Format, go to Shape Fill (paint bucket icon) or Shape Outline (pencil icon). Click the drop down arrow, then select More…Colors from the drop-down menu.
- A pop-up will appear with a color picker. Go to the second tab, and the hex code of the current color will be listed next to Hex Color #.
This is one way to find the hex code in a Microsoft Word document. However, anytime you see the color picker you can find the hex code. This applies to font colors as well.
Context
Why use the built-in editing tools to create a table?
Some learners rely on screen readers to navigate files and the web. The only way for a screen reader to describe an image to the user is if the image has a text description in the HTML called alt text. Refer to the Slide Images section for more information on alt text. Alt text may be sufficient for short and simple tables, but it can be challenging (and time-consuming) to describe more complex tables accurately in text.
Alternatively, if you create the table with the built-in tool in the software (e.g., Google Slides or Microsoft PowerPoint), it will likely be created cell-by-cell with semantic HTML and digital text. As a result, all learners would be able to highlight and copy individual cells and words, and a screen reader would be able to convey each cell individually and provide information about the layout of the table to the users.
There are exceptions, such as:
- When you’re not the creator of the table, an image might be your only option.
- When you’re using a word processing software other than Google or Microsoft that has different functionality.
- If the purpose of the table is decorative and not to convey information, an image is acceptable.
If you are not sure what to do, schedule a consultation at cornellcti@cornell.edu.
Why use a simple table design?
Unfortunately, slide presentation tools such as Google Slides and Microsoft PowerPoint do not currently have the functionality to make complex tables fully accessible, especially for learners who rely on screen readers. For a table to be accessible to a screen reader, the user needs to be able to label the headers and associate those headers with the correct rows and columns in the HTML. While you may be able to do this with basic table designs in slides, it does not work with more complex table layouts.
Tip: In addition, the more complicated the table design and the more text on the screen, the less readable and memorable the table will be for all learners.
Why are these strategies important if you upload your slides to Canvas or another platform?
If you make the slides available to learners outside of class, they need to be able to navigate through the slides on their own. Some learners (such as those using screen readers) will not be able to read the contents of a slide if they were not designed using these strategies.