{"id":3236,"date":"2022-03-14T17:08:29","date_gmt":"2022-03-14T16:08:29","guid":{"rendered":"https:\/\/digi-ed.uk\/support\/?post_type=ht_kb&#038;p=3236"},"modified":"2024-06-25T10:59:16","modified_gmt":"2024-06-25T09:59:16","slug":"making-your-tables-accessible","status":"publish","type":"ht_kb","link":"https:\/\/digi-ed.uk\/support\/article\/making-your-tables-accessible\/","title":{"rendered":"Making your \u2018tables\u2019 accessible"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\">Why it matters<\/h2>\n\n\n\n<ul class=\"wp-block-list\"><li>When a screen reader reads a table, it will say: \u201cTable with 54 rows and four columns.\u201d Then, as the user navigates through the table, the screen reader will provide information about their location in the table, \u201cRow 2 check box unchecked.\u201d<\/li><li>If the table isn\u2019t labelled appropriately the student will not be able to extract the data and information they need.<\/li><li>Creating a great place to learn. Reducing barriers and creating a platform for all.<\/li><\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Add a \u2018Table Style\u2019<\/h2>\n\n\n\n<p>To keep consistency use Microsoft \u2018Table Style\u2019. A \u2018Table Style\u2019 is a pre-formatted table design that does lots of the accessibility for you.<\/p>\n\n\n\n<p>This automatically allocates \u2018Header Row\u2019s\u2019 which will make it readable by assistive technologies.<\/p>\n\n\n\n<ol class=\"wp-block-list\"><li>You can access more \u2018Table Styles\u2019 by clicking on the down arrow in the bottom right of the window. A larger list of options will appear to choose from.<\/li><\/ol>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"600\" height=\"98\" src=\"https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/Table-styles-1.png\" alt=\"Table styles menu.\" class=\"wp-image-3237\" srcset=\"https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/Table-styles-1.png 600w, https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/Table-styles-1-300x49.png 300w, https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/Table-styles-1-50x8.png 50w, https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/Table-styles-1-60x10.png 60w, https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/Table-styles-1-100x16.png 100w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/figure>\n\n\n\n<ol class=\"wp-block-list\" start=\"2\"><li>To the left of the Table Styles box you can check that a header row has been added.<\/li><\/ol>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"321\" height=\"128\" src=\"https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/Untitled-3.png\" alt=\"Table Styles box.\" class=\"wp-image-3238\" srcset=\"https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/Untitled-3.png 321w, https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/Untitled-3-300x120.png 300w, https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/Untitled-3-50x20.png 50w, https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/Untitled-3-60x24.png 60w, https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/Untitled-3-100x40.png 100w\" sizes=\"auto, (max-width: 321px) 100vw, 321px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-ht-blocks-messages wp-block-hb-message wp-block-hb-message--withicon is-style-alert\">Tip: Watch out for the header colours, lighter colour backgrounds with white writing do not always pass the WCAG AA standards.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Tables will need \u2018Alt Text\u2019<\/h2>\n\n\n\n<ol class=\"wp-block-list\"><li>Select your table, right-click your mouse, choose \u2018Table properties\u2019, click \u2018Alt Text\u2019.<\/li><li>Title the table and provide a description.<\/li><li>Click ok.<\/li><\/ol>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"893\" height=\"571\" src=\"https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/table-alt-tag.png\" alt=\"Microsoft Table Properties option. Highlighting Alt text tab. Highlighting Title and Description.\" class=\"wp-image-3239\" srcset=\"https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/table-alt-tag.png 893w, https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/table-alt-tag-300x192.png 300w, https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/table-alt-tag-768x491.png 768w, https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/table-alt-tag-50x32.png 50w, https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/table-alt-tag-60x38.png 60w, https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/table-alt-tag-100x64.png 100w\" sizes=\"auto, (max-width: 893px) 100vw, 893px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Tables will need to have a header (If not using table styles)<\/h2>\n\n\n\n<p>If you are not using \u2018Table Styles\u2019 you will need to add designated header rows manually to your table. Or you may wish to edit the header rows.<\/p>\n\n\n\n<ol class=\"wp-block-list\"><li>Select the row or column you wish to label as a heading.<\/li><li>Right-click your mouse and choose \u2018Table properties\u2019.<\/li><li>Un-tick, \u2018Allow row to break across pages\u2019.<\/li><li>Tick \u2018Repeat as header row at the top of each page\u2019.<\/li><li>Click Ok<\/li><\/ol>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"767\" height=\"587\" src=\"https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/Untitled-4.png\" alt=\"Table properties. Allow row to break across pages, Repeat as header row at the top of each page.\" class=\"wp-image-3240\" srcset=\"https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/Untitled-4.png 767w, https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/Untitled-4-300x230.png 300w, https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/Untitled-4-50x38.png 50w, https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/Untitled-4-60x46.png 60w, https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/Untitled-4-100x77.png 100w\" sizes=\"auto, (max-width: 767px) 100vw, 767px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Avoid merged or split cells<\/h2>\n\n\n\n<ul class=\"wp-block-list\"><li>Screen readers struggle to read merged or split cells.<\/li><li>If possible avoid using these.<\/li><li>To test your table structure, start at Row 1 column 1 and use the tab button on the keyboard and see where the tab takes you.<\/li><\/ul>\n\n\n\n<p class=\"wp-block-ht-blocks-messages wp-block-hb-message wp-block-hb-message--withicon is-style-info\">For further information on how to create accessible tables in Microsoft Office see this tutorial: <a rel=\"noreferrer noopener\" href=\"https:\/\/support.microsoft.com\/en-us\/office\/video-create-accessible-tables-in-word-cb464015-59dc-46a0-ac01-6217c62210e5\" target=\"_blank\">Create accessible tables<\/a><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Removing merged and split cells<\/h2>\n\n\n\n<p>If possible you will need to remove merged and split cells to make your table more accessible.<\/p>\n\n\n\n<ol class=\"wp-block-list\"><li>To remove the merged cell, highlight the cell\/s. Click \u2018Split Cells\u2019.<\/li><li>Number of Columns should be 1.<br>The number of rows should equal the number of rows the merged cell covers. For this, it is 8.<\/li><\/ol>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"904\" height=\"722\" src=\"https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/unmarging-cells-in-tables.PNG.png\" alt=\"Microsoft ribbon menu. Highlighting split cells. Highlighting split cells, popup box.\" class=\"wp-image-3241\" srcset=\"https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/unmarging-cells-in-tables.PNG.png 904w, https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/unmarging-cells-in-tables.PNG-300x240.png 300w, https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/unmarging-cells-in-tables.PNG-768x613.png 768w, https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/unmarging-cells-in-tables.PNG-50x40.png 50w, https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/unmarging-cells-in-tables.PNG-60x48.png 60w, https:\/\/digi-ed.uk\/support\/wp-content\/uploads\/2022\/03\/unmarging-cells-in-tables.PNG-100x80.png 100w\" sizes=\"auto, (max-width: 904px) 100vw, 904px\" \/><\/figure>\n","protected":false},"excerpt":{"rendered":"<p>This guide is designed to help you create accessible tables in Microsoft Office.  It covers how to use \u2018Table Styles\u2019, how to add a \u2018Header\u2019 to a table and how to add \u2018alt text\u2019 and how to remove merged cells.<\/p>\n","protected":false},"author":1,"comment_status":"closed","ping_status":"closed","template":"","format":"standard","meta":{"footnotes":""},"ht-kb-category":[298],"ht-kb-tag":[110,28,307],"class_list":["post-3236","ht_kb","type-ht_kb","status-publish","format-standard","hentry","ht_kb_category-misc","ht_kb_tag-accessibility","ht_kb_tag-moodle","ht_kb_tag-pdf"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/digi-ed.uk\/support\/wp-json\/wp\/v2\/ht-kb\/3236","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/digi-ed.uk\/support\/wp-json\/wp\/v2\/ht-kb"}],"about":[{"href":"https:\/\/digi-ed.uk\/support\/wp-json\/wp\/v2\/types\/ht_kb"}],"author":[{"embeddable":true,"href":"https:\/\/digi-ed.uk\/support\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/digi-ed.uk\/support\/wp-json\/wp\/v2\/comments?post=3236"}],"version-history":[{"count":2,"href":"https:\/\/digi-ed.uk\/support\/wp-json\/wp\/v2\/ht-kb\/3236\/revisions"}],"predecessor-version":[{"id":3418,"href":"https:\/\/digi-ed.uk\/support\/wp-json\/wp\/v2\/ht-kb\/3236\/revisions\/3418"}],"wp:attachment":[{"href":"https:\/\/digi-ed.uk\/support\/wp-json\/wp\/v2\/media?parent=3236"}],"wp:term":[{"taxonomy":"ht_kb_category","embeddable":true,"href":"https:\/\/digi-ed.uk\/support\/wp-json\/wp\/v2\/ht-kb-category?post=3236"},{"taxonomy":"ht_kb_tag","embeddable":true,"href":"https:\/\/digi-ed.uk\/support\/wp-json\/wp\/v2\/ht-kb-tag?post=3236"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}