Web content accessibility is taken for granted by many web designers. Not intentionally, but because they may not be aware of the disabilities act, WCAG guidelines or the need to be website ada compliant. Use this ADA compliance checklist for websites to ensure that your website visitors including, low vision or visually impaired users, and those using screen readers are able to successfully navigate your website.
This website accessibility and ADA compliance checklist should be used to ensure compliance with Section 508 and WCAG 2.2 content accessibility guidelines or subscribe to WP ADA Compliance Check Online or the WP ADA Compliance Check WordPress plugin to automatically evaluate your website content for Section 508, WCAG 2.2 Level A and AA Web Accessibility Standards.
Since not all issues can be automatically detected, we have included a list of manual checks that are required to ensure your web content meets accessibility guidelines.
Thank you for using our ADA Compliance checklist for websites!
Table of Contents
ADA compliance checklist for websites:
Automatic Checks
A Skip link was not found, is not the first link on the page or points to a non-existent id attribute. Skip links are required to allow screen reader users to bypass navigation links and go directly to the main content. The skip link target id should be the id for the main landmark on the page and should include the H1 for the page. A skip link should be the first link in a page and are normally hidden from view but should become visible when in focus. Include skip navigation links. WCAG 2.2 (Level A) - 2.4.1 HELP
A meta element was found to be using a refresh attribute to refresh or redirect after a time limit. People who are blind may not have enough time for their screen readers to read the page before the page refreshes or redirects. Sighted users may also be disoriented by the unexpected refresh. You should remove this element or provide a mechanism for users to stop the refresh. If a mechanism has already been provided this issue may be ignored. WCAG 2.2 (Level A) - 2.2.1 HELP
PREMIUM CHECK - Multiple ways should be provided for users to locate information on your website. In order to meet this requirement each page should include a Search box or a link labeled "Search" that takes the user to a search feature. Another way to meet this requirement is to include a link labeled "Site Map" or "Sitemap" that provides links to different sections of the site. WCAG 2.2 (Level AA) - 2.4.5 HELP
HTML element is missing the language attribute. Without the language attribute the language of each Web page can be programmatically determined. Include a language attribute on the html element. e.g. <html lang="en-US"> WCAG 2.2 (Level A) - 3.1.1 HELP
Some of the content appears to be in a different language but does not include a lang attribute to distinguish the change in language. Add a lang attribute to the enclosing html tag. WCAG 2.2 (Level A) - 3.1.2 HELP
An audio or video element is set to auto play. If any audio plays automatically for more than 3 seconds or video includes motion that lasts for more than 5 seconds a mechanism must be available to pause or stop the media. Switch to text view, locate the affected code and remove the autoplay attribute. If the affected code is an Iframe with an MP3 or MP4 source the Iframe should be replaced with an audio of video tag. WCAG 2.2 (Level A) - 1.4.2 HELP
An image map area tag was found to be missing alternate text. Each area tag inside an image map must include an alt attribute with text describing the purpose of the linked area. Locate the affected code and insert an alt attribute for each area tag. WCAG 2.2 (Level A) - 1.1.1 HELP
An anchor tag includes a title attribute that duplicates the content within the body of the link, an aria-label or the alt text on an image. This creates redundancy, therefore the title attribute should be removed. WCAG 2.2 (Level A) - 2.4.4 HELP
An image was found with invalid alternate text. This could mean that it includes "image of", "graphic of", "link to", "click this image" or a similar phrase that would have no meaning to a screen reader user. It is usually apparent to the user that it is an image or that the image includes a link. If the fact that an image is a photograph or illustration is important, it may be useful to include it in the alternative text and this error can be ignored. WCAG 2.2 (Level A) - 1.1.1 HELP
An images was found with alternate text that is the same as the text provided in the image caption or body of a link. This creates redundancy and should be avoided by leaving the alt attribute blank. WCAG 2.2 (Level A) - 1.1.1 HELP
Page title is used for more than one page. The first thing screen readers read when a user goes to a different web page is the page title. Good page titles are important to help people know where they are on a website. To avoid confusion for screen reader users, consider using a different page title.") WCAG 2.2 (Level A) - 2.4.2 HELP
Page title is blank, missing or invalid. The first thing screen readers read when a user goes to a different web page is the page title. Good page titles are important to help people know where they are on a website. To correct this issues add a title to this page. WCAG 2.2 (Level A) - 2.4.2 HELP
An audio or video element may be missing equivalent text. Equivalent text should be provided in the form of a track tag including captions or subtitles or a text transcript may be included instead of using captions or subtitles. If closed captioning is provided, the accuracy of the closed captioning should be verified. If a transcript is provided in some other way or the multimedia includes audio with accurate captions this error may be ignored. WCAG 2.2 (Level A) - 1.2.1 HELP
Image is being added using the CSS background-image property. The CSS background-image property provides a way to include images in the document without any reference in the HTML code. The CSS background-image property is intended for decorative purposes only and does not provide a means to associate alternative text. Using background images also makes it possible for color contrast failures to go un-noticed. Verify that the affected images do not include any textual content and that their is enough contrast between the color of the image and any text that is displayed over the background image. WCAG 2.2 (Level A) - 1.1.1 HELP
PREMIUM CHECK - An audio or video player from a remote source was found. This is only a problem if equivalent text is not provided in the form of captions, subtitles or a text transcript. Many Youtube videos include closed captioning that can not be identified automatically. For videos with closed captioning, the accuracy of the closed captioning should be verified. If a transcript is provided or the multimedia includes accurate captions this error may be ignored. WCAG 2.2 (Level A) - 1.2.1 HELP
A form field was found to be missing labels. Without labels screen reader users may not be able to use the form. Add a label tag with a "for" attribute matching an "id" attribute in the form field. If more than one field requires the same label aria-labelledby may be used instead of a label with the for attribute. The <a href="https://www.alumnionlineservices.com/free-plugins/simple-accessible-forms/">Simple Accessible Forms Plugin</a> may be used to correct most form accessibility issues. WCAG 2.2 (Level A) - 3.3.2 HELP
A form label was found to be missing a for attribute or includes a for attribute and no form field id. Each form field should include a label with a for attribute set to the value of the id of the form field. Set the for attribute to the correct field id. WCAG 2.2 (Level A) - 3.3.2 HELP
An absolute font size was found. Using your browser, verify that text can be scaled up to 200% without loss of content or functionality. Check that no text is clipped, truncated, or obscured. To ensure compatibility with older web browsers consider using relative units (such as percents or ems) to specify font sizes rather than absolute units (such as viewport units, pixels or points). Because they block the browsers zoom functionality, viewport units (vh, vw) should never be used. WCAG 2.2 (Level AA) - 1.4.4 HELP
No alternate content was found for an embedded object. Add a textual equivalent between the OBJECT elements (e.g. <OBJECT>equivalent text</OBJECT>). WCAG 2.2 (Level A) - 1.1.1 HELP
No TITLE attributes found for this frame. Add a TITLE attribute with appropriate text to describe the purpose and/or content of the frame to each FRAME and IFRAME element (e.g. <iframe TITLE="Main Content">). Without a TITLE some screen readers read out the FRAME filename, which is usually meaningless. WCAG 2.2 (Level A) - 1.1.1 HELP
An empty heading was encountered. Some users, especially keyboard and screen reader users, often navigate by heading elements. An empty heading will present no information and may introduce confusion. To correct this issue locate and remove the empty tag. WCAG 2.2 (Level A) - 1.3.1 HELP
This page has no headings. This is not a problem if the page does not actually include sections of content but each section of content should begin with an H2 heading element and sub-sections should include subheadings (H3, H4, H5 or H6). Headings should not be used for decorative purposes such as to display text in bold. Check the page for content that should include section headers and add headings as required. WCAG 2.2 (Level A) - 1.3.1 HELP
The headings on this page are not nested correctly (ie... H1 before H2, H2 before H3 etc...). Headings communicate the organization of the content on the page and can be used to provide in-page navigation. There should only be one H1 element and it should enclose the page title. Each section of content should begin with a heading H2 element followed by sub-sections marked with subheadings (H3, H4, H5 or H6). Headings should not be used for decorative purposes such as to display text in bold. Edit the page to ensure headings are included in the correct nested order (ie... H1 before H2, H2 before H3 etc...) and that there is only one H1 element and it encloses the page title. The one exception is the home page which may have the website title enclosed in the H1 element. WCAG 2.2 (Level A) - 1.3.1 HELP
An empty link was encountered. If a link contains no text, the function or purpose of the link will not be presented to the user. This can introduce confusion for keyboard and screen reader users. To correct this issue locate and remove the empty tag. If the link includes an image that is missing alternate text, add alt text to the image. WCAG 2.2 (Level A) - 2.4.4 HELP
An anchor tag with an empty href attribute was encountered. If clicking a link results in no action it will create confusion for screen reader users. If no longer needed remove the link or if this link is used as a trigger to display dynamic content such as a menu or accordion this error can be ignored. WCAG 2.2 (Level A) - 2.4.4 HELP
A link was encountered with ambiguous link text. Links should make sense out of context. Using a URL as link text or phrases such as "click here", "more", "click for details" are ambiguous when read out of context. Ensure this link is included in a paragraph, list or table cell with preceding text that describes its purpose or is in a table cell with a header that explains the purpose of the link. If a link encloses an image the image alt text should include the purpose of the link and should not include words such as "logo" unless linking to a full size logo. To increase accessibility use existing words or text in your page as the link rather than the ambiguous phrase. (e.g. Rather than click here to view the annual report, use View the annual report. WCAG 2.2 (Level A) - 2.4.4 HELP
Image found without alternate text. Without alternative text, the content of an image will not be available to screen reader users or when the image is unavailable. Each image that conveys meaning or is used as link content must include alternate text unless including the alternate text would create redundancy (e.g. when text is also included in an image caption or text inside the body of a link) or the image is included for decoration. Provide text alternatives for images. WCAG 2.2 (Level A) - 1.1.1 HELP
Image found with empty alternate text. Empty alt text is not a problem if the image does not convey meaning, is not inside an anchor tag, used for form input or is for decoration only. Without alternative text, the content of an image will not be available to screen reader users or when the image is unavailable. Each image that conveys meaning or is used as link content must include alternate text unless including the alternate text would create redundancy (e.g. when text is also included in an image caption or text inside the body of a link) or the image is included for decoration. Add alt text to the image. WCAG 2.2 (Level A) - 1.1.1 HELP
Image found with empty alternate text but non-empty title or arial-label attributes. Empty alt text is not a problem if the image does not convey meaning, is not inside an anchor tag or is for decoration only. If the image includes content that should be read aloud include alternate text unless including the alternate text would create redundancy (e.g. when text is also included in an image caption or as text inside the body of a link). Remove any title or aria-label attributes or add alternate text to the image as applicable. WCAG 2.2 (Level A) - 1.1.1 HELP
Table is marked with role="presentation" but has table headings, a summary, caption or other feature that should only be present in a data table. If not a data table and used only for layout remove headings, caption and summary attributes, otherwise WCAG 2.2 (Level A) - 1.3.1 HELP
Table without Headers was encountered. If this is a data table, headings and scope should be added to the appropriate cells. If this is not a data table and used only for layout, WCAG 2.2 (Level A) - 1.3.1 HELP
Table with header attributes on cells referencing a non-existent header ID was encountered. To correct this issue, associate each data cell with a header cell by adding header attributes that correspond to an id attribute in the header cell. WCAG 2.2 (Level A) - 1.3.1 HELP
Table without data cells was encountered. Data tables should have only table headers marked as "Header cells". Header cells are normally in the first row or column of a table and all other cells are normally data cells. WCAG 2.2 (Level A) - 1.3.1 HELP
Table with header cell ids that are not used inside a headers attribute was encountered. Associate each data cell with a header cell by adding header attributes that correspond to an id attribute in the header cell. WCAG 2.2 (Level A) - 1.3.1 HELP
Complex table was found with header cells that are missing the scope attribute or that includes an incorrect value. Headers cells on tables with more than one header row or column should include a scope attribute. The scope attribute should be set to "Column" if the header applies to data in a column and "Row" if the data is in a row. WCAG 2.2 (Level A) - 1.3.1 HELP
An anchor tag is set to open a new window. Opening a new window without first notifying the user can disorient users. Remove the target attribute or add a notice such as (opens in a new window) to the link text or title attribute. CSS may be used to show the notice when the link is active or a small icon may be used inside the anchor tag with the alternate text set to "opens in a new window". (e.g. <a href="http://www.google.com" >Link text <img src="images/newwindow.png" alt="opens in a new window" > <a>. WCAG 2.2 (Level A) - 3.2.1 HELP
This page appears to be generating a popup window while loading or by other actions within the page. Opening a new window without first notifying the user can disorient users. Remove the code that is generating the popup or ensure the user is notified prior to the window being opened. WCAG 2.2 (Level A) - 3.2.1 HELP
PREMIUM CHECK - A form field triggers a context change without notice. When changes to the value of a field or its focus triggers a new window to open or the form to submit users can become disoriented. Instead of using onchange or onclick attributes on form fields use a submit button. WCAG 2.2 (Level A) - 3.2.2 HELP
A page element uses a pointing device event handler but fails to include an equivalent keyboard event handler. Users without vision rely on the keyboard for navigation, without a keyboard event handler they are unable to navigation your pages. To correct this issues add an equivalent keyboad event handler. (i.e... onkeypress, onkeydown, onblur, etc...) WCAG 2.2 (Level A) - 2.1.1 HELP
PREMIUM CHECK - An anchor tag was found with the underline removed using a text-decoration style. While some links may be visually evident from page design and context, such as navigational links, links within text are often visually understood only from their own display attributes. Ensure that all links are visually identifiable via some other means such as location in page, underlined, bolded, italicized, sufficient difference in lightness (minimum contrast of 3:1). WCAG 2.2 (Level A) - 1.4.1 HELP
A fieldset was found without a legend. The first element inside the FIELDSET must be a LEGEND element, which provides a label or description for the group. WCAG 2.2 (Level A) - 1.3.1 HELP
A nested fieldsets was found. Nesting fieldsets can lead to confusion for screen reader users and should be avoided. WCAG 2.2 (Level A) - 1.3.1 HELP
A list appears to include incorrect markup. Bulleted and Numbered lists should use html markup (ie...<ul><ol><li>) rather than numbers and dashes. Without html markup screen readers are unable to determine the relationship of the content. To resolve this issue use the list tools to create a bulleted list or unordered list whichever is appropriate for the situation WCAG 2.2 (Level A) - 1.3.1 HELP
An images was found linking to itself. This is not a problem unless the image does not include alternate text indicating the purpose of the link and content of the linked image. Review the alternate text for this image to ensure it clearly conveys the purpose of the link and content of the image. Consider removing the link if it is not required. WCAG 2.2 (Level A) - 1.1.1 HELP
A table was found with a summary attribute that duplicates the content inside the caption tag. The summary tag is deprecated in HTML5 and should be removed. WCAG 2.2 (Level A) - 1.3.1 HELP
PREMIUM CHECK - An animated image was found. Animated images that repeat non-stop or more than 3 times in one second should be avoided. Check that the image does not repeat nonstop or flash more than 3 times in one second. Consider replacing animated images with static images. WCAG 2.2 (Level A) - 2.3.1 HELP
An element was found with an aria-labelledby or aria-describedby attribute referencing an invalid, duplicate or non-existent id. Locate and correct the attribute, remove any duplicate ids or add the missing id. WCAG 2.2 (Level A) - 3.3.2 HELP
PREMIUM CHECK - An element was found to not have a contrast ratio of at least 4.5:1 between the foreground and background colors. Verify that both foreground and background colors are specified at some level by stylesheets or through inheritance rules and that the contrast ratio is at least 4.5:1. It is not necessary that the foreground and background colors both be defined on the same CSS rule. Use the WAVE by WebAim color contrast checker for greater accuracy. WCAG 2.2 (Level A) - 1.4.3 HELP
A form field has more than one associated label. Screen reading software may not read the appropriate label. Ensure that at most one label element is associated with each form field. If multiple form labels are necessary, use aria-labelledby WCAG 2.2 (Level A) - 3.3.2 HELP
An element was found with an html blink tag or having CSS text-decoration: blink applied. When applied it causes any text inside the element to blink at a predetermined rate. This cannot be interrupted by the user, nor can it be disabled as a preference. The blinking continues as long as the page is displayed. Locate the affected code and remove the blink tag or CSS text-decoration rule. WCAG 2.2 (Level A) - 2.2.2 HELP
An element was found to be using extra white space to create padding or other visual formatting. The use of white space between words for visual formatting is not a failure, since it does not change the interpretation of the words but using white space between letters of a word or to create the visual effect of a table are failures. Remove the affected code if necessary and use CSS or tables to display the text. WCAG 2.2 (Level A) - 1.3.2 HELP
A CSS style was found to be removing or obscuring visual indications that the link or form field is selected. Using a border or outline style that obscures the focus indicator causes problems for keyboard-only users. Using keyboard tabs and mouse over, verify that the affected element includes a visible outline when in focus and that it has a contrast ratio of at least 3:1 between its pixels in the focused and unfocused states and against adjacent colors. If no visible outline exists, change the style to avoid obscuring the focus outline. WCAG 2.2 (Level AA) - Various HELP
An element was found to be using an event handler such as onclick to emulate a link. A link created in this manner cannot be tabbed to from the keyboard and does not gain keyboard focus like other controls and/or links. Change this element to an anchor tag or include role="link" and tabindex="0" as attributes. WCAG 2.2 (Level AA) - 2.1.1 HELP
An element was found with a tabindex attribute. The tabindex attribute is used to manually specify the order links and form fields should receive focus when using the tab key on the keyboard. Using tabindex to modify the tab order is not always a problem but because its use can become unmaintainable very quickly and it is easily forgotten when content is changed, its use should be avoided. Check that the tab order specified by the tabindex attributes follows relationships in the content or remove the tabindex attribute from your pages. WCAG 2.2 (Level A) - 2.4.3 HELP
A layout table with spanned cells was found. Complex tables can result in screen readers reading content in an unintended order which is confusing to screen reader users. Verify that the table content is read in the intended order. Often complex tables can be formatted differently to avoid spanning cells or consider using a CSS based layout to improve accessibility. WCAG 2.2 (Level A) - 1.3.2 HELP
A data table was found with multiple header rows. This is not a problem if the second header row is a sub heading of the first one. Ensure the second table header relates to the first one. If it does not, the second table header and its content should be moved to a seperate table. WCAG 2.2 (Level A) - 1.3.1 HELP
An empty button was encountered. If a button contains no text, the function or purpose of the button will not be presented to the user. This can introduce confusion for keyboard and screen reader users. Locate and remove the empty tag or add an aria-label or title attribute with descriptive text. If the button includes an image that is missing alternate text, use the edit image option to add alt text to the image. WCAG 2.2 (Level A) - 1.1.1 HELP
Image found with non-empty alternate text but hidden from screen reader users using aria-hidden="true" or role="presentation". Since this image is hidden it will be ignored by screen readers. If the image does not convey meaning or if including it would create redundancy you may ignore this alert or alternatively edit the image to remove the alternate text. If the image does convey meaning remove role="presentation" or aria-hidden="true" from the image tag. WCAG 2.2 (Level A) - 1.1.1 HELP
Text was found to be justified. Many people with cognitive disabilities have a great deal of trouble with blocks of text that are justified (aligned to both the left and the right margins). Use either "left" or "right" alignment or remove it all together. WCAG 2.2 (Level AAA) - 1.4.8 HELP
A nested table was found. Nested tables are confusing to screen reader users. Consider moving the nested table outside of the outer table cell. WCAG 2.2 (Level A) - 1.3.2 HELP
A link was found with event handlers and no href attribute. Without an href attribute links are ignored by screen readers. To correct this issues set the href value or add a role attribute that is set to "link". (i.e... role="link" or href="http://www.google.com") WCAG 2.2 (Level A) - 2.1.1 HELP
A link was found to be inaccessible to keyboard users. Links should be enclosed in an anchor tag and make sense when read out of context. Unless it is an email address the URL itself should never be used as link text as it would be ambiguous to screen reader users. To correct this issue, create clickable links with these urls. WCAG 2.2 (Level A) - 2.1.1 HELP
One or more anchor tags were found adjacent to one another with the same link text and destination. This can be confusing to screen reader users. Consider removing redundant links, adding a title attribute with additional descriptive text or combine the links into a single anchor tag enclosing both elements. When combining links that include an image tag the image alt attribute should be set to empty i.e... alt="". WCAG 2.2 (Level AA) - 2.4.4 HELP
A table header cell contains no text. Table headers associate table data with the correct table header so that screen reader users can understand the data presented. If this is a header cell, include text in the cell to describe the column or row. If it is not a table header, change the <th> tag to <td> and remove any scope attributes. WCAG 2.2 (Level A) - 1.3.1 HELP
Related form fields were found to not be grouped using a fieldset and legend. This is not a problem if the label includes a sufficient description but often simple one word answers such as "Yes" or "No" are used and do not provide enough information for complete understanding. Ensure the label text provides clear understanding of its purpose. When additional descriptive text is required it can be included in the field label or may be added by wrapping related form fields in a fieldset with a legend to provide the additional instruction. The <a href="https://www.alumnionlineservices.com/free-plugins/simple-accessible-forms/">Simple Accessible Forms Plugin</a> may be used to correct most form accessibility issues. WCAG 2.2 (Level A) - 2.4.6 HELP
An anchor tag points to non html content such as to a PDF or MS Word document. Unless authored with accessibility in mind these files often have accessibility issues or may be opened in a separate application causing confusion for users. Edit the link to add a notice such as (PDF) to the link text or title attribute. Ensure that the document complies with accessibility standards. ADA compliance for these documents must be verified using the native software such as Adobe Acrobat or MS Word. WCAG 2.2 (Level A) - 3.2.1 HELP
PREMIUM CHECK - This page does not appear to include an option to allow users to seek help or to report accessibility problems on the website. A link should be provided to a page that describes your efforts to meet accessibility standards and that includes a link to an accessible form or phone number to report problems. Help instructions should be provided in the same relative location on each page. Enable the Web Accessibility Widget to quickly resolve this issue. WCAG 2.2 (Level AAA) - 3.3.5 HELP
An embed tag was found. Embed tags must include a title attribute containing alternate text however most screen readers ignore the title attribute on embed tags resulting in inaccessible content. Switch to text view and change the embed tag to iframe. WCAG 2.2 (Level A) - 1.1.1 HELP
An empty option tag was encountered. Locate and remove the empty tag or add an aria-label or title attribute with descriptive text. The <a href="https://www.alumnionlineservices.com/free-plugins/simple-accessible-forms/">Simple Accessible Forms Plugin</a> may be used to correct most form accessibility issues. WCAG 2.2 (Level A) - 3.3.2 HELP
One or more images were found with identical alt text. Alt text should be unique and accurately describe the content of the image. Edit the alt text for each image to provide unique and descriptive alternate text. If the images are included in a slideshow and are for decoration only, do not provide information and are not enclosed in links, remove the alt text, add aria-hidden="true" or role="presentation" to the image tag. Alternatively the slideshow may be wrapped in a div with the aria-hidden="true" attribute to hide it from screen readers. WCAG 2.2 (Level A) - 1.1.1 HELP
PREMIUM CHECK - A link was found to not have a contrast ratio of at least 3:1 between it and the surrounding text. Ensure all links are visually identifiable via some other means such as location in page (i.e...menu), underlined, bolded, italicized, sufficient difference in lightness (minimum color contrast ratio of 3:1). If color difference is used, a visual highlight must be used when hovering over the link. Acceptable effects include underline, bold or italics or increased font size. WCAG 2.2 (Level A) - 1.4.1 HELP
PREMIUM CHECK - This page is missing one or more required landmark regions. Landmark regions programmatically identify sections of a page and allow assistive technology users to navigate to various sections of the page. Not all landmark types will be applicable to every page and it is not necessary to add landmarks if they are not applicable to a page but normally each page will have at least one banner, navigation, main and contentinfo region. Other regions that may be applicable include complementary, form and search. If more than one landmark of the same type exists the aria-label attribute should be used to describe its purpose. Landmarks may be added using either html5 elements or the role attribute. Review the page structure and add any applicable landmarks. WCAG 2.2 (Level A) - 1.3.1 HELP
PREMIUM CHECK - One or more landmarks were found without proper labeling. Form landmarks should be identified using the aria-labelledby attribute set to the id of a visible heading element (e.g. an h1-h6 element) or if more than one landmark of the same type exists the aria-label attribute should be used to describe the purpose of each landmark. Refer to the affected code for more details. Correctly label any applicable landmarks. The autocorrect feature found on the content filters tab may also be used to add labels to landmarks. WCAG 2.2 (Level A) - 1.3.1 HELP
PREMIUM CHECK - This navigation menu may not be fully accessible to screen reader users. View the affected code for specific instructions. Verify that the menu is marked up using list markup (ul and li). If a link to the current page is included in the menu, ensure that it includes the aria-current attribute and that CSS is used to visually identify the page as selected. Ensure links that open a submenu include a visual indication that they open a submenu and aria-expanded attributes. When activated the triggering links aria-expanded attribute must change to "true", when deactivated it must change back to "false". Ensure submenus do not open when tabbing to a link, if the triggering link is used to open a webpage in addition to opening a submenu a seperate button must be used to trigger the submenu. Ensure that the "enter" or "space" key can be used to open submenus without triggering a link to open. WCAG 2.2 (Level A) - 1.3 HELP
PREMIUM CHECK - One or more adjacent anchor tags were found with the same link text but with different destinations. Ensure this link is included in a paragraph, list or table cell with preceding text that describes its purpose or are in a table cell with a header that explains the purpose of the link. Consider changing the link text to distinguish the links from one another or add a title attribute with supplemental text. The aria-label attribute may also be used and will replace the link text for screen readers. WCAG 2.2 (Level A) - 2.4.4 HELP
PREMIUM CHECK - An unlabeled dialog or dialog that may be missing required markup was found. Refer to the "Affected Code" column for more details. Include an aria-label attribute with descriptive text or use aria-labelledby set to the id of a heading inside the dialog to provide the necessary label. Verify that the dialog element includes the correct role attribute either role="dialog" or role="alertdialog". The control that activated the dialog should include a title attribute or text to indicate that the link opens a dialog. The following additional requirements apply to modal and alert dialogs (if the dialog interrupt users by blocking other activities then it is a modal dialog): Verify that modal dialogs include the attribute aria-modal="true". When the dialog is activated, check that focus is set to a focuable element inside the container. When the dialog is active, check that focus is never set to an element that is not in the container. When the dialog is deactivated, check that focus is set to the control that originally activated the dialog. WCAG 2.2 (Level A) - 1.3 HELP
An element was found to have focus removed by a script when focus is received. Use the keyboard to verify that you can get to all interactive elements. Check that when focus is placed on each element, focus remains there until user moves it. WCAG 2.2 (Level A) - 2.1.1 HELP
PREMIUM CHECK - This page includes a contact form or other form with multiple fields. A manual review should be conducted to ensure accessiblity. Refer to the "Affected Code" column for details regarding potential problems that may have been detected. Forms must be carefully constructed to ensure accessibility. If required fields are present, ensure they are marked in a way other than color. This can be done using an asterisk for sited users but the word "required" should be used for screen reader users. Screen reader text may be hidden off screen using CSS (<span class="screen-reader-text">required</span>). Required field markings should be included in the field label. In the event of error or during a multiple step entry process, verify that information previously entered is auto populated or available for the user to select. If a field has a maxlength attribute the user must be notified when the limit has been reached. If an error occurs, properly formatted error notices should be used to indicate what needs to be done to correct the error. This can be done using an aria-live region or by assigning the attribute role="status" to the element enclosing the error notice. The preferred method is to display a notice next to the input field when focus leaves the field but errors may also be displayed after the form is submitted as long as the error message is properly formatted and read aloud to screen reader users. Ideally, focus should be moved to the first field in error. If a captcha is present, ideally it should be Google Recaptcha 3 and hidden from screen reader users. The aria-invalid attribute may also be used to identify the fields to screen reader users. The <a href="https://www.alumnionlineservices.com/free-plugins/simple-accessible-forms/">Simple Accessible Forms Plugin</a> may be used to correct most form accessibility issues. WCAG 2.2 (Level A) - Various HELP
PREMIUM CHECK - This page includes a slideshow or carousel. A manual review should be conducted to ensure accessiblity. Refer to the "Affected Code" column for details regarding potential problems that may have been detected. Carousels, also known as "slideshows" and "sliders", show a collection of items one at a time (i.e... news items, images). Many sliders use non-text elements for navigation, include images or start automatically, which can be problems for some users. Review this carousel to ensure that if it plays automatically, users can pause movement, that it can be navigated with the keyboard, that navigation buttons include readable text (ie... actual text, hidden screen reader text, aria-labels or title), that content images include alternate text, that it is wrapped in a section or aside element that includes an aria-label describing the purpose of the slideshow and that each slide is wrapped in an element that includes the attribute role="group" and includes an aria-label that describes the slides location in the series (i.e... slide 1 0f 3). When a slide is not visible on the screen, it should be hidden from all users either using CSS (like display: none or visibility: hidden), the HTML hidden attribute, or by adding aria-hidden="true" to the slide's wrapper and tabindex="-1" to all the focusable elements inside it. Carousels that provide only decorative images may be hidden from screen reader users using aria-hidden="true" or marked with role="presentation". All focusable elements inside hidden sliders should include tabindex="-1". While not required for accessibility, ideally carousel content should be wrapped in an aria-live region so that carousel content will be read to screen reader users when a navigation button is activated but not when auto scrolled (this can be done by setting the aria-live region to "off" when the page loads but changing it to "polite" when activated with a navigation button). WCAG 2.2 (Level A) - Various HELP
Manual Checks
Manual checks are checks that can not be completed automatically. Visit the linked reference to learn more about the requirement or choose Read More for a complete description and information on how to correct the issue.
F1: Failure of Success Criterion 1.3.2 due to changing the meaning of content by positioning information with CSS. WCAG 2.2 (Level A) - 1.3.2 Read More
F7: Failure of Success Criterion 2.2.2 due to an object or applet, such as Java or Flash, that has blinking content without a mechanism to pause the content that blinks for more than five seconds. WCAG 2.2 (Level A) - 2.2.2 Read More
F8: Failure of Success Criterion 1.2.2 due to captions omitting some dialogue or important sound effects. WCAG 2.2 (Level A) - 1.2.2 Read More
F10: Failure of Success Criterion 2.1.2 and Conformance Requirement 5 due to combining multiple content formats in a way that traps users inside one format type. WCAG 2.2 (Level A) - 2.1.2 Read More
F13: Failure of Success Criterion 1.1.1 and 1.4.1 due to having a text alternative that does not include information that is conveyed by color differences in the image. WCAG 2.2 (Level A) - 1.1.1 Read More
F14: Failure of Success Criterion 1.3.3 due to identifying content only by its shape or location. WCAG 2.2 (Level A) - 1.3.3 Read More
F24: Failure of Success Criterion 1.4.3, 1.4.6 and 1.4.8 due to specifying foreground colors without specifying background colors or vice versa WCAG 2.2 (Level A) - 1.4.3 Read More
F26: Failure of Success Criterion 1.3.3 due to using a graphical symbol alone to convey information WCAG 2.2 (Level A) - 1.3.3 Read More
F31: Failure of Success Criterion 3.2.4 due to using two different labels for the same function on different Web pages within a set of Web pages. WCAG 2.2 (Level AA) - 3.2.4 Read More
F49: Failure of Success Criterion 1.3.2 due to using an HTML layout table that does not make sense when linearized. WCAG 2.2 (Level A) - 1.3.2 Read More
F58: Failure of Success Criterion 2.2.1 due to using server-side techniques to automatically redirect pages after a time-out WCAG 2.2 (Level A) - 2.2.1 Read More
F63: Failure of Success Criterion 2.4.4 due to providing link context only in content that is not related to the link. WCAG 2.2 (Level A) - 2.4.4 Read More
F66: Failure of Success Criterion 3.2.3 due to presenting navigation links in a different relative order on different pages. WCAG 2.2 (Level AA) - 3.2.3 Read More
F67: Failure of Success Criterion 1.1.1 and 1.2.1 due to providing long descriptions for non-text content that does not serve the same purpose or does not present the same information. WCAG 2.2 (Level A) - 1.1.1 Read More
F69: Failure of Success Criterion 1.4.4 when resizing visually rendered text up to 200 percent causes the text, image or controls to be clipped, truncated or obscured. WCAG 2.2 (Level A) - 1.4.4 Read More
F70: Failure of Success Criterion 4.1.1 due to incorrect use of start and end tags or attribute markup. Verify that elements have complete start and end tags, are nested according to their specifications, do not contain duplicate attributes, and any IDs are unique, except where the specifications allow these features. Use the free html validator plugin to identify and correct these errors. HTML validator links are also included on the page/post list as well as the WordPress editor screen. WCAG 2.2 (Level A) - 4.1.1 Read More
F71: Failure of Success Criterion 1.1.1 due to using text look-alikes to represent text without providing a text alternative. WCAG 2.2 (Level A) - 1.1.1 Read More
F74: Failure of Success Criterion 1.2.2 and 1.2.8 due to not labeling a synchronized media alternative to text as an alternative WCAG 2.2 (Level A) - 1.2.2 Read More
F75: Failure of Success Criterion 1.2.2 by providing synchronized media without captions when the synchronized media presents more information than is presented on the page. WCAG 2.2 (Level A) - 1.2.2 Read More
Broken links are a common problem on websites. While not specifically identified as a violation, broken links loosely violate principle 2 - Operable and may result in content on your website not being evaluated for accessibility by the WP ADA Compliance plugin. Consider installing a link check plugin to monitor and correct broken links. WCAG 2.2 (Level A)
The visual presentation of text and images of text has a contrast ratio of at least 4.5:1, except for the following: Large Text: Large-scale text and images of large-scale text have a contrast ratio of at least 3:1; Incidental: Text or images of text that are part of an inactive user interface component, that are pure decoration, that are not visible to anyone, or that are part of a picture that contains significant other visual content, have no contrast requirement. Logotypes: Text that is part of a logo or brand name has no contrast requirement. Choose "Evaluate with Wave" under the Web Accessibility tab and then click on the "Contrast" tab. WCAG 2.2 (Level A) - 1.4.3
F00: Review all input forms to ensure required fields are properly marked and that if an input error is detected, the item in error is identified and the error is described to the user in text. Required fields should be marked in a way other than color such as an asterisk, the word required, or by including aria-required="true" in the form control. In addition to marking fields as required, properly formatted error notices should be used to indicate what needs to be done to correct the error. This can be done using an aria-live region or by assigning the attribute role="alert" to the element enclosing the error notice. The preferred method is to display a notice next to the input field when focus leaves the field but errors may also be displayed after the form is submitted as long as the error message is properly formatted and read aloud to screen reader users. Ideally, focus should be moved to the first field in error. The aria-invalid attribute may be also be used to identify the fields to screen reader users. WCAG 2.2 (Level A) - 3.3.1 Read More
F107: Failure of Success Criterion 2.5.7 Dragging due to not providing a single pointer method for the user to operate a function that does not require a dragging movement WCAG 2.2 (Level AA) - 2.5.7 Read More
F00: If a web page contains contact information, a self-help option or other help feature and they are repeated on multiple web pages, they must occur in the same relative location on each page. WCAG 2.2 (Level A) - 3.2.6 Read More
F00: When a user interface component receives keyboard focus, the component is not entirely hidden due to author-created content. WCAG 2.2 (Level A) - 2.4.11 Read More
F00: The size of the target for pointer inputs must be at least 24 by 24 pixels except when the spacing between elements is at least 24 px, the function can be achieved through a different control on the same page that meets this criterion, the target is in a sentence or block of text, the size of the target is determined by the user agent and is not modified by the author, or a particular presentation of the target is essential or is legally required for the information being conveyed. WCAG 2.2 (Level AA) - 2.5.8 Read More
We hope you have found the ADA Compliance checklist for websites usefull! Please contact us with any feedback or suggestions!
