{"id":12784,"date":"2020-07-13T12:08:17","date_gmt":"2020-07-13T16:08:17","guid":{"rendered":"https:\/\/extension.umaine.edu\/plugged-in\/?page_id=12784"},"modified":"2026-03-18T14:23:36","modified_gmt":"2026-03-18T18:23:36","slug":"how-to-make-tables-ada-compliant-in-wordpress","status":"publish","type":"page","link":"https:\/\/extension.umaine.edu\/plugged-in\/technology-marketing-communications\/web\/tips-for-web-managers\/how-to-make-tables-ada-compliant-in-wordpress\/","title":{"rendered":"How to Make ADA Compliant Tables in WordPress"},"content":{"rendered":"<style>.kb-row-layout-id12784_fce5f8-7b > .kt-row-column-wrap{align-content:start;}:where(.kb-row-layout-id12784_fce5f8-7b > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}.kb-row-layout-id12784_fce5f8-7b > .kt-row-column-wrap{column-gap:var(--global-kb-gap-md, 2rem);row-gap:var(--global-kb-gap-md, 2rem);max-width:1100px;margin-left:auto;margin-right:auto;padding-top:30px;padding-right:30px;padding-bottom:30px;padding-left:30px;grid-template-columns:minmax(0, 1fr);}.kb-row-layout-id12784_fce5f8-7b{background-image:linear-gradient(135deg,rgb(8,46,88) 0%,rgb(65,118,161) 99%);}.kb-row-layout-id12784_fce5f8-7b > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){.kb-row-layout-id12784_fce5f8-7b > .kt-row-column-wrap{padding-right:50px;padding-left:50px;grid-template-columns:minmax(0, 1fr);}}@media all and (max-width: 767px){.kb-row-layout-id12784_fce5f8-7b > .kt-row-column-wrap{padding-top:50px;padding-right:25px;padding-bottom:50px;padding-left:25px;grid-template-columns:minmax(0, 1fr);}}<\/style><div class=\"kb-row-layout-wrap kb-row-layout-id12784_fce5f8-7b alignfull kt-row-has-bg um-UMBlueHorizonsDarkBlueTextBox wp-block-kadence-rowlayout\"><div class=\"kt-row-column-wrap kt-has-1-columns kt-row-layout-equal kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top\">\n<style>.kadence-column12784_160f77-af > .kt-inside-inner-col,.kadence-column12784_160f77-af > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column12784_160f77-af > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column12784_160f77-af > .kt-inside-inner-col{flex-direction:column;}.kadence-column12784_160f77-af > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column12784_160f77-af > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column12784_160f77-af{position:relative;}@media all and (max-width: 1024px){.kadence-column12784_160f77-af > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column12784_160f77-af > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column12784_160f77-af\"><div class=\"kt-inside-inner-col\"><style>.kb-row-layout-id12784_b010ed-69 > .kt-row-column-wrap{align-content:start;}:where(.kb-row-layout-id12784_b010ed-69 > .kt-row-column-wrap) > .wp-block-kadence-column{justify-content:start;}.kb-row-layout-id12784_b010ed-69 > .kt-row-column-wrap{column-gap:var(--global-kb-gap-md, 2rem);row-gap:var(--global-kb-gap-md, 2rem);padding-top:15px;padding-right:30px;padding-bottom:15px;padding-left:30px;grid-template-columns:minmax(0, 1fr);}.kb-row-layout-id12784_b010ed-69 > .kt-row-layout-overlay{opacity:0.30;}@media all and (max-width: 1024px){.kb-row-layout-id12784_b010ed-69 > .kt-row-column-wrap{padding-top:35px;padding-right:35px;padding-bottom:60px;padding-left:35px;grid-template-columns:minmax(0, 1fr);}}@media all and (max-width: 767px){.kb-row-layout-id12784_b010ed-69 > .kt-row-column-wrap{padding-bottom:35px;grid-template-columns:minmax(0, 1fr);}}<\/style><div class=\"kb-row-layout-wrap kb-row-layout-id12784_b010ed-69 alignnone has-white-background-color kt-row-has-bg wp-block-kadence-rowlayout\"><div class=\"kt-row-column-wrap kt-has-1-columns kt-row-layout-equal kt-tab-layout-inherit kt-mobile-layout-row kt-row-valign-top\">\n<style>.kadence-column12784_655c07-c3 > .kt-inside-inner-col,.kadence-column12784_655c07-c3 > .kt-inside-inner-col:before{border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-right-radius:0px;border-bottom-left-radius:0px;}.kadence-column12784_655c07-c3 > .kt-inside-inner-col{column-gap:var(--global-kb-gap-sm, 1rem);}.kadence-column12784_655c07-c3 > .kt-inside-inner-col{flex-direction:column;}.kadence-column12784_655c07-c3 > .kt-inside-inner-col > .aligncenter{width:100%;}.kadence-column12784_655c07-c3 > .kt-inside-inner-col:before{opacity:0.3;}.kadence-column12784_655c07-c3{position:relative;}@media all and (max-width: 1024px){.kadence-column12784_655c07-c3 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}@media all and (max-width: 767px){.kadence-column12784_655c07-c3 > .kt-inside-inner-col{flex-direction:column;justify-content:center;}}<\/style>\n<div class=\"wp-block-kadence-column kadence-column12784_655c07-c3\"><div class=\"kt-inside-inner-col\">\n<h2 class=\"wp-block-heading\"><strong>How to Make ADA-Compliant Tables in WordPress<\/strong><\/h2>\n\n\n\n<p><strong>All University of Maine Cooperative Extension web pages must be accessible and comply with <a href=\"http:\/\/webaim.org\/standards\/508\/checklist\" target=\"_blank\" rel=\"noopener noreferrer\">Section 508 Standards<\/a>.<\/strong> Accessibility allows our information to be available to all users.<\/p>\n<p>A few simple steps will ensure data tables are ADA-compliant and can be read by screen readers or other assistive technologies.<\/p>\n<h3><strong>Identify the Table&#8217;s Header Cells<br \/><\/strong><\/h3>\n<p>Row and column headers need to be identified in data tables to make the table ADA-compliant. Proper identification allows users who rely on screen readers to know which data cells belong to which header cells.<\/p>\n<p>Typically, <strong>column header cells<\/strong> run across the top of your table. <strong>Row header cells<\/strong> typically run down the left-hand side. Complex tables may contain multiple column or row header cells. The instructions below are for a simple table in which the header cells are located only in the topmost row. For more complex tables, contact Michelle Snowden at email <a href=\"mailto:michelle.snowden@maine.edu\" target=\"_blank\" rel=\"noopener\">michelle.snowden@maine.edu<\/a>\u00a0to ask for resources and tools.<\/p>\n<p>1. <strong>Select the text in the header cells<\/strong> by running your cursor over them. Alternatively, you can work on one cell at a time by placing your cursor anywhere within the cell, then following steps 2 and 3 below for each cell in the top row.<\/p>\n<p><a href=\"https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/select-header-cells.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-12795\" src=\"https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/select-header-cells-1024x722.jpg\" alt=\"screenshot of a table with the tet in the header cells selected\" width=\"500\" height=\"353\" srcset=\"https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/select-header-cells-1024x722.jpg 1024w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/select-header-cells-300x212.jpg 300w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/select-header-cells-768x542.jpg 768w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/select-header-cells-1536x1083.jpg 1536w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/select-header-cells-105x74.jpg 105w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/select-header-cells-317x224.jpg 317w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/select-header-cells-423x298.jpg 423w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/select-header-cells-634x447.jpg 634w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/select-header-cells-846x597.jpg 846w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/select-header-cells-951x671.jpg 951w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/select-header-cells-1268x894.jpg 1268w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/select-header-cells.jpg 1872w\" sizes=\"auto, (max-width: 320px) 85vw, (max-width: 768px) 67vw, (max-width: 1024px) 62vw,500px\" \/><\/a><\/p>\n<p>2. <strong>Click on the Table tool<\/strong> in the toolbar. <strong>Select Cell \/ Table Cell Properties<\/strong> from the dropdown menu.<\/p>\n<p><a href=\"https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-properties.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-12797\" src=\"https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-properties-1024x722.jpg\" alt=\"screenshot showing table tool choices\" width=\"500\" height=\"353\" srcset=\"https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-properties-1024x722.jpg 1024w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-properties-300x212.jpg 300w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-properties-768x542.jpg 768w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-properties-1536x1083.jpg 1536w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-properties-105x74.jpg 105w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-properties-317x224.jpg 317w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-properties-423x298.jpg 423w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-properties-634x447.jpg 634w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-properties-846x597.jpg 846w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-properties-951x671.jpg 951w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-properties-1268x894.jpg 1268w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-properties.jpg 1872w\" sizes=\"auto, (max-width: 320px) 85vw, (max-width: 768px) 67vw, (max-width: 1024px) 62vw,500px\" \/><\/a><\/p>\n<p>3. In the Table Cell Properties window, <strong>select Header Cell from the Cell Type dropdown menu<\/strong>. Then <strong>select Column from the Scope dropdown menu<\/strong>. If header cells span more than one column, select Column Group from the Scope dropdown menu. Click OK. Save your changes.<\/p>\n<p><a href=\"https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-type.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-12798\" src=\"https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-type-1024x722.jpg\" alt=\"screenshot showing cell type choices\" width=\"500\" height=\"353\" srcset=\"https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-type-1024x722.jpg 1024w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-type-300x212.jpg 300w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-type-768x542.jpg 768w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-type-1536x1083.jpg 1536w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-type-105x74.jpg 105w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-type-317x224.jpg 317w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-type-423x298.jpg 423w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-type-634x447.jpg 634w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-type-846x597.jpg 846w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-type-951x671.jpg 951w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-type-1268x894.jpg 1268w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/cell-type.jpg 1872w\" sizes=\"auto, (max-width: 320px) 85vw, (max-width: 768px) 67vw, (max-width: 1024px) 62vw,500px\" \/><\/a><\/p>\n<h3><strong>Use a Caption Tag When Your Table Has a Title<br \/><\/strong><\/h3>\n<p>In order for screenreaders to connect a table with its title, you need to use a caption tag in the HTML code. Don&#8217;t be intimidated by the code. Follow these easy steps:<\/p>\n<p>1. <strong>Click on the Text tab<\/strong> in the upper right corner of the editing window to switch to the HTML view.<\/p>\n<p>2. <strong>Locate the start of your table.<\/strong> Look for &lt;table in the code (use Edit\/Find in This Page on your browser bar if you have trouble locating the table&#8217;s start tag). After the &#8220;&gt;&#8221; at the end of the table tag, type (or copy\/paste) in the following caption code, replacing &#8220;Title of Table&#8221; with the actual title of your table. The caption code should look like this:<\/p>\n<pre style=\"padding-left: 80px\">&lt;caption&gt;&lt;h4&gt;&lt;strong&gt;Title of Table&lt;\/strong&gt;&lt;\/h4&gt;&lt;\/caption&gt;\n<\/pre>\n<h4><strong>In the example pictured below:<\/strong><\/h4>\n<p style=\"padding-left: 40px\"><strong>This is the table tag:<\/strong><\/p>\n<pre style=\"padding-left: 80px\">&lt;table border=\"1\" cellspacing=\"0\" cellpadding=\"3\"&gt;<\/pre>\n<p style=\"padding-left: 40px\"><strong>And this is the caption code for the title:<\/strong><\/p>\n<pre style=\"padding-left: 80px\">&lt;caption&gt;&lt;h4&gt;&lt;strong&gt;Sweet Corn IPM Weekly Scouting Summary&lt;\/strong&gt;&lt;\/h4&gt;&lt;\/caption&gt;<\/pre>\n<p><a href=\"https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/caption-code-1.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-large wp-image-12803\" src=\"https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/caption-code-1-1024x722.jpg\" alt=\"screenshot of caption code for a table\" width=\"1024\" height=\"722\" srcset=\"https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/caption-code-1-1024x722.jpg 1024w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/caption-code-1-300x212.jpg 300w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/caption-code-1-768x542.jpg 768w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/caption-code-1-1536x1083.jpg 1536w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/caption-code-1-105x74.jpg 105w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/caption-code-1-317x224.jpg 317w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/caption-code-1-423x298.jpg 423w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/caption-code-1-634x447.jpg 634w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/caption-code-1-846x597.jpg 846w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/caption-code-1-951x671.jpg 951w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/caption-code-1-1268x894.jpg 1268w, https:\/\/extension.umaine.edu\/plugged-in\/wp-content\/uploads\/sites\/54\/2020\/07\/caption-code-1.jpg 1872w\" sizes=\"auto, (max-width: 320px) 85vw, (max-width: 768px) 67vw, (max-width: 1024px) 62vw,1024px\" \/><\/a><\/p>\n<p>If you end up with two titles above your table, you can delete the original one; keep only the &#8220;caption&#8221; title.<\/p>\n<p>3. <strong>Save<\/strong> your changes.<\/p>\n<p>If you need help working with HTML code, please contact <a href=\"mailto:michelle.snowden@maine.edu\">Michelle Snowden<\/a>.<\/p>\n<\/div><\/div>\n\n<\/div><\/div><\/div><\/div>\n\n<\/div><\/div>","protected":false},"excerpt":{"rendered":"<p>How to Make ADA-Compliant Tables in WordPress All University of Maine Cooperative Extension web pages must be accessible and comply with Section 508 Standards. Accessibility allows our information to be available to all users. A few simple steps will ensure data tables are ADA-compliant and can be read by screen readers or other assistive technologies. [&hellip;]<\/p>\n","protected":false},"author":3,"featured_media":0,"parent":7741,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"templates\/page-withsidebar.php","meta":{"_kad_blocks_custom_css":"","_kad_blocks_head_custom_js":"","_kad_blocks_body_custom_js":"","_kad_blocks_footer_custom_js":"","_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"class_list":["post-12784","page","type-page","status-publish","hentry"],"taxonomy_info":[],"featured_image_src_large":false,"author_info":{"display_name":"","author_link":"https:\/\/extension.umaine.edu\/plugged-in\/author\/"},"comment_info":0,"_links":{"self":[{"href":"https:\/\/extension.umaine.edu\/plugged-in\/wp-json\/wp\/v2\/pages\/12784","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/extension.umaine.edu\/plugged-in\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/extension.umaine.edu\/plugged-in\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/extension.umaine.edu\/plugged-in\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/extension.umaine.edu\/plugged-in\/wp-json\/wp\/v2\/comments?post=12784"}],"version-history":[{"count":20,"href":"https:\/\/extension.umaine.edu\/plugged-in\/wp-json\/wp\/v2\/pages\/12784\/revisions"}],"predecessor-version":[{"id":21982,"href":"https:\/\/extension.umaine.edu\/plugged-in\/wp-json\/wp\/v2\/pages\/12784\/revisions\/21982"}],"up":[{"embeddable":true,"href":"https:\/\/extension.umaine.edu\/plugged-in\/wp-json\/wp\/v2\/pages\/7741"}],"wp:attachment":[{"href":"https:\/\/extension.umaine.edu\/plugged-in\/wp-json\/wp\/v2\/media?parent=12784"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}