Page Accessibility Validation

Accessible web pages are web pages that are designed in a way that people with disabilities or impairments can use them. Most US and EU organizations require accessibility compliance.

Using the Validate page accessibility step, you can check the accessibility level of your web page, while identifying elements in your web page that could have been made accessible, but were not. The accessibility checks are based on rules, which are listed below.

📘

This is a pro feature only open to projects on our professional plan. To learn more about our professional plan, click here.

📘

The Validate page accessibility step feature is only available when using the Chrome browser.

Adding a Validate page accessibility step

The Validate page accessibility step should be placed in the part of your test where the desired page to be tested is currently open in the AUT. If your test involves navigating to more than one page, be sure that the step is placed in the testing sequence where the desired page is open.

📘

Steps created before Jan 2022 are not shared. To make them shared, please record them again.

To add a Validate page accessibility step:

  1. Hover over the (arrow symbol) where you want to add the step.
3841

The action options are displayed.

250
  1. Click on the Toggle Breakpoint button.
500
  1. Click on the Run test button to run the test until the breakpoint.
3853
  1. Hover over the (arrow symbol) again and click on the “M” (Testim predefined steps).
    The Predefined steps menu opens.
300
  1. Click on Validations.
    The Validations menu expands.
300
  1. Scroll down through the menu and select Validate page accessibility.

📘

Alternatively, you can use the search box at the top of the menu to search for Validate page accessibility.

A Validate page accessibility step is added in the Editor.

3853
  1. Hover over the newly created step, and click on the Show Properties () icon.
3853

The Properties panel opens on the right-hand side.

538
  1. Fill in the properties as described below.
  • Description – The description of the step. (Default = Page accessibility validation)
  • Fail test from impact level – The minimal impact level that will fail the test. Options are: Critical, Serious, Moderate, and Minor. (Default = Minor) The impact levels of the different rules are shown in the table below.
  • Run only specific tags – Click in this field and choose the protocols you wish to test from the dropdown options available. See table below. By default all tags are selected.
  • Exclude specific rule IDs – If you wish to exclude specific rule IDs, select them from the list. In addition if you wish to only check specific rule IDs, you can select all and then un-select the ones you would like to test.
  • When this step fails – Specify what to do if the step fails.
  • When to run step – Specify conditions for when to run the step. For more info, see Conditions.
  • Override timeout – Allows you to override the default time lapse setting which causes Testim to register a fail for a test step, and specify a different time lapse value (in milliseconds).
  1. Click on the Toggle Breakpoint button after the Validation step to remove the breakpoint.
    When the test is run, the accessibility level of your page will be checked against the parameters you set. If accessibility violations are found and the step fails, you can view the accessibility report to see detailed results.

Viewing the page accessibility results

After a test with a Validate page accessibility step is run, if accessibility violations are found, a Step Failed: Accessibility violations were found error message is shown, and you can view detailed accessibility violation results.

To view the page accessibility results:

  1. Hover over the failed Validate page accessibility step, and click on the Show Properties () icon.
3853

The Properties panel opens on the right-hand side.

  1. In the Properties panel, click the Check here for more details link.
540

📘

Alternatively, in the error panel, you can click on the Accessibility report link.

3853

The Accessibility Result window is shown (based on the impact level you chose previously), displaying a list of accessibility issues, the number of occurrences that were found, and their impact levels.

400

If you would like to show the accessibility issues found based on all of the impact levels, click the All impact level toggle.

400
  1. If you would like to download the results as a CSV file, click the download icon. (The CSV file includes the results of all of the accessibility tests, including those that passed.)
400
  1. Click the down arrow next to any of the results to show the following detailed information: Description, How To Fix The Problem, and Element CSS Selector.
400
  1. If more than one occurrence of an accessibility issue was found, click the arrows in the Element CSS Selector section to show the different instances of the issue.
400

Rules Descriptions

Testim uses the following library to check the page accessibility level: https://github.com/dequelabs/axe-core/blob/develop/doc/rule-descriptions.md. Each rule has an associated impact level (e.g. Critical, Serious, Moderate, or Minor) and associated tags. When configuring the accessibility check, you can limit the check to certain tags and/or impact levels.

WCAG 2.0 Level A & AA Rules

Rule IDDescriptionImpactTagsIssue TypeACT Rules
area-altEnsures <area> elements of image maps have alternate textCriticalcat.text-alternatives, wcag2a, wcag111, wcag244, wcag412, section508, section508.22.a, ACTfailure, needs reviewc487ae
aria-allowed-attrEnsures ARIA attributes are allowed for an element's roleSerious, Criticalcat.aria, wcag2a, wcag412failure, needs review5c01ea
aria-command-nameEnsures every ARIA button, link and menuitem has an accessible nameSeriouscat.aria, wcag2a, wcag412failure, needs review97a4e1
aria-hidden-bodyEnsures aria-hidden='true' is not present on the document body.Criticalcat.aria, wcag2a, wcag412failure
aria-hidden-focusEnsures aria-hidden elements do not contain focusable elementsSeriouscat.name-role-value, wcag2a, wcag412, wcag131failure, needs review6cfa84
aria-input-field-nameEnsures every ARIA input field has an accessible nameModerate, Seriouscat.aria, wcag2a, wcag412, ACTfailure, needs reviewe086e5
aria-meter-nameEnsures every ARIA meter node has an accessible nameSeriouscat.aria, wcag2a, wcag111failure, needs review
aria-progressbar-nameEnsures every ARIA progressbar node has an accessible nameSeriouscat.aria, wcag2a, wcag111failure, needs review
aria-required-attrEnsures elements with ARIA roles have all required ARIA attributesCriticalcat.aria, wcag2a, wcag412failure
aria-required-childrenEnsures elements with an ARIA role that require child roles contain themCriticalcat.aria, wcag2a, wcag131failure, needs reviewff89c9
aria-required-parentEnsures elements with an ARIA role that require parent roles are contained by themCriticalcat.aria, wcag2a, wcag131failurebc4a75, ff89c9
aria-roledescriptionEnsure aria-roledescription is only used on elements with an implicit or explicit roleSeriouscat.aria, wcag2a, wcag412failure, needs review
aria-rolesEnsures all elements with a role attribute use a valid valueSerious, Criticalcat.aria, wcag2a, wcag412failure, needs review
aria-toggle-field-nameEnsures every ARIA toggle field has an accessible nameModerate, Seriouscat.aria, wcag2a, wcag412, ACTfailure, needs review
aria-tooltip-nameEnsures every ARIA tooltip node has an accessible nameSeriouscat.aria, wcag2a, wcag412failure, needs review
aria-valid-attr-valueEnsures all ARIA attributes have valid valuesSerious, Criticalcat.aria, wcag2a, wcag412failure, needs review5c01ea, c487ae
aria-valid-attrEnsures attributes that begin with aria- are valid ARIA attributesCriticalcat.aria, wcag2a, wcag412failure
audio-captionEnsures <audio> elements have captionsCriticalcat.time-and-media, wcag2a, wcag121, section508, section508.22.aneeds reviewc3232f, e7aa44
blinkEnsures <blink> elements are not usedSeriouscat.time-and-media, wcag2a, wcag222, section508, section508.22.jfailure
button-nameEnsures buttons have discernible textCriticalcat.name-role-value, wcag2a, wcag412, section508, section508.22.a, ACTfailure, needs review97a4e1, m6b1q3
bypassEnsures each page has at least one mechanism for a user to bypass navigation and jump straight to the contentSeriouscat.keyboard, wcag2a, wcag241, section508, section508.22.oneeds review
color-contrastEnsures the contrast between foreground and background colors meets WCAG 2 AA contrast ratio thresholdsSeriouscat.color, wcag2aa, wcag143failure, needs review
definition-listEnsures <dl> elements are structured correctlySeriouscat.structure, wcag2a, wcag131failure
dlitemEnsures <dt> and <dd> elements are contained by a <dl>Seriouscat.structure, wcag2a, wcag131failure
document-titleEnsures each HTML document contains a non-empty <title> elementSeriouscat.text-alternatives, wcag2a, wcag242, ACTfailure2779a5
duplicate-id-activeEnsures every id attribute value of active elements is uniqueSeriouscat.parsing, wcag2a, wcag411failure
duplicate-id-ariaEnsures every id attribute value used in ARIA and in labels is uniqueCriticalcat.parsing, wcag2a, wcag411failure3ea0c8
duplicate-idEnsures every id attribute value is uniqueMinorcat.parsing, wcag2a, wcag411failure
form-field-multiple-labelsEnsures form field does not have multiple label elementsModeratecat.forms, wcag2a, wcag332needs review
frame-focusable-contentEnsures <frame> and <iframe> elements with focusable content do not have tabindex=-1Seriouscat.keyboard, wcag2a, wcag211failure, needs review
frame-titleEnsures <iframe> and <frame> elements have an accessible nameSeriouscat.text-alternatives, wcag2a, wcag241, wcag412, section508, section508.22.ifailure, needs review
html-has-langEnsures every HTML document has a lang attributeSeriouscat.language, wcag2a, wcag311, ACTfailureb5c3f8
html-lang-validEnsures the lang attribute of the <html> element has a valid valueSeriouscat.language, wcag2a, wcag311, ACTfailurebf051a
html-xml-lang-mismatchEnsure that HTML elements with both valid lang and xml:lang attributes agree on the base language of the pageModeratecat.language, wcag2a, wcag311, ACTfailure5b7ae0
image-altEnsures <img> elements have alternate text or a role of none or presentationCriticalcat.text-alternatives, wcag2a, wcag111, section508, section508.22.a, ACTfailure, needs review23a2a8
input-button-nameEnsures input buttons have discernible textCriticalcat.name-role-value, wcag2a, wcag412, section508, section508.22.afailure, needs review
input-image-altEnsures <input type="image"> elements have alternate textCriticalcat.text-alternatives, wcag2a, wcag111, section508, section508.22.a, ACTfailure, needs review59796f
labelEnsures every form element has a labelMinor, Criticalcat.forms, wcag2a, wcag412, wcag131, section508, section508.22.n, ACTfailure, needs reviewe086e5, 307n5z
link-nameEnsures links have discernible textSeriouscat.name-role-value, wcag2a, wcag412, wcag244, section508, section508.22.a, ACTfailure, needs reviewc487ae
listEnsures that lists are structured correctlySeriouscat.structure, wcag2a, wcag131failure
listitemEnsures <li> elements are used semanticallySeriouscat.structure, wcag2a, wcag131failure
marqueeEnsures <marquee> elements are not usedSeriouscat.parsing, wcag2a, wcag222failure
meta-refreshEnsures <meta http-equiv="refresh"> is not usedCriticalcat.time-and-media, wcag2a, wcag2aaa, wcag221, wcag224, wcag325failure
nested-interactiveNested interactive controls are not announced by screen readersSeriouscat.keyboard, wcag2a, wcag412failure, needs review307n5z
object-altEnsures <object> elements have alternate textSeriouscat.text-alternatives, wcag2a, wcag111, section508, section508.22.afailure, needs review8fc3b6
role-img-altEnsures [role='img'] elements have alternate textSeriouscat.text-alternatives, wcag2a, wcag111, section508, section508.22.a, ACTfailure, needs review23a2a8
scrollable-region-focusableElements that have scrollable content must be accessible by keyboardModeratecat.keyboard, wcag2a, wcag211failure0ssw9k
select-nameEnsures select element has an accessible nameMinor, Criticalcat.forms, wcag2a, wcag412, wcag131, section508, section508.22.n, ACTfailure, needs reviewe086e5
server-side-image-mapEnsures that server-side image maps are not usedMinorcat.text-alternatives, wcag2a, wcag211, section508, section508.22.fneeds review
svg-img-altEnsures svg elements with an img, graphics-document or graphics-symbol role have an accessible textSeriouscat.text-alternatives, wcag2a, wcag111, section508, section508.22.a, ACTfailure, needs review7d6734
td-headers-attrEnsure that each cell in a table using the headers refers to another cell in that tableSeriouscat.tables, wcag2a, wcag131, section508, section508.22.gfailure, needs reviewa25f45
th-has-data-cellsEnsure that each table header in a data table refers to data cellsSeriouscat.tables, wcag2a, wcag131, section508, section508.22.gfailure, needs reviewd0f69e
valid-langEnsures lang attributes have valid valuesSeriouscat.language, wcag2aa, wcag312failure
video-captionEnsures <video> elements have captionsCriticalcat.text-alternatives, wcag2a, wcag122, section508, section508.22.aneeds revieweac66b

WCAG 2.1 Level A & AA Rules

Rule IDDescriptionImpactTagsIssue TypeACT Rules
autocomplete-validEnsure the autocomplete attribute is correct and suitable for the form fieldSeriouscat.forms, wcag21aa, wcag135failure73f2c2
avoid-inline-spacingEnsure that text spacing set through style attributes can be adjusted with custom stylesheetsSeriouscat.structure, wcag21aa, wcag1412failure
empty-table-headerEnsures table headers have discernible textMinorwcag131, cat.arianeeds review

Best Practices Rules

Rules that do not necessarily conform to WCAG success criterion but are industry accepted practices that improve the user experience.

Rule IDDescriptionImpactTagsIssue TypeACT Rules
accesskeysEnsures every accesskey attribute value is uniqueSeriouscat.keyboard, best-practicefailure
aria-allowed-roleEnsures role attribute has an appropriate value for the elementMinorcat.aria, best-practicefailure, needs review
aria-dialog-nameEnsures every ARIA dialog and alertdialog node has an accessible nameSeriouscat.aria, best-practicefailure, needs review
aria-textEnsures "role=text" is used on elements with no focusable descendantsSeriouscat.aria, best-practicefailure, needs review
aria-treeitem-nameEnsures every ARIA treeitem node has an accessible nameSeriouscat.aria, best-practicefailure, needs review
empty-headingEnsures headings have discernible textMinorcat.name-role-value, best-practicefailure, needs review
frame-testedEnsures <iframe> and <frame> elements contain the axe-core scriptCriticalcat.structure, review-item, best-practicefailure, needs review
frame-title-uniqueEnsures <iframe> and <frame> elements contain a unique title attributeSeriouscat.text-alternatives, best-practicefailure
heading-orderEnsures the order of headings is semantically correctModeratecat.semantics, best-practicefailure, needs review
identical-links-same-purposeEnsure that links with the same accessible name serve a similar purposeMinorcat.semantics, wcag2aaa, wcag249, best-practiceneeds reviewb20e66, fd3a94
image-redundant-altEnsure image alternative is not repeated as textMinorcat.text-alternatives, best-practicefailure
label-title-onlyEnsures that every form element is not solely labeled using the title or aria-describedby attributesSeriouscat.forms, best-practicefailure
landmark-banner-is-top-levelEnsures the banner landmark is at top levelModeratecat.semantics, best-practicefailure
landmark-complementary-is-top-levelEnsures the complementary landmark or aside is at top levelModeratecat.semantics, best-practicefailure
landmark-contentinfo-is-top-levelEnsures the contentinfo landmark is at top levelModeratecat.semantics, best-practicefailure
landmark-main-is-top-levelEnsures the main landmark is at top levelModeratecat.semantics, best-practicefailure
landmark-no-duplicate-bannerEnsures the document has at most one banner landmarkModeratecat.semantics, best-practicefailure
landmark-no-duplicate-contentinfoEnsures the document has at most one contentinfo landmarkModeratecat.semantics, best-practicefailure
landmark-no-duplicate-mainEnsures the document has at most one main landmarkModeratecat.semantics, best-practicefailure
landmark-one-mainEnsures the document has a main landmarkModeratecat.semantics, best-practicefailure
landmark-uniqueLandmarks should have a unique role or role/label/title (i.e. accessible name) combinationModeratecat.semantics, best-practicefailure
meta-viewport-largeEnsures <meta name="viewport"> can scale a significant amountMinorcat.sensory-and-visual-cues, best-practicefailure
meta-viewportEnsures <meta name="viewport"> does not disable text scaling and zoomingCriticalcat.sensory-and-visual-cues, best-practice, ACTfailureb4f0c3
page-has-heading-oneEnsure that the page, or at least one of its frames contains a level-one headingModeratecat.semantics, best-practicefailure
presentation-role-conflictFlags elements whose role is none or presentation and which cause the role conflict resolution to trigger.Minorcat.aria, best-practicefailure
regionEnsures all page content is contained by landmarksModeratecat.keyboard, best-practicefailure
scope-attr-validEnsures the scope attribute is used correctly on tablesModerate, Criticalcat.tables, best-practicefailure
skip-linkEnsure all skip links have a focusable targetModeratecat.keyboard, best-practicefailure, needs review
tabindexEnsures tabindex attribute values are not greater than 0Seriouscat.keyboard, best-practicefailure
table-duplicate-nameEnsure that tables do not have the same summary and captionMinorcat.tables, best-practicefailure

Experimental Rules

Rules we are still testing and developing. They are not enabled by default in axe-core, but are enabled for the axe browser extensions.

Rule IDDescriptionImpactTagsIssue TypeACT Rules
css-orientation-lockEnsures content is not locked to any specific display orientation, and the content is operable in all display orientationsSeriouscat.structure, wcag134, wcag21aa, experimentalfailure, needs reviewb33eff
focus-order-semanticsEnsures elements in the focus order have an appropriate roleMinorcat.keyboard, best-practice, experimentalfailure
hidden-contentInforms users about hidden content.Minorcat.structure, experimental, review-item, best-practicefailure, needs review
label-content-name-mismatchEnsures that elements labelled through their content must have their visible text as part of their accessible nameSeriouscat.semantics, wcag21a, wcag253, experimentalfailure2ee8b8
link-in-text-blockLinks can be distinguished without relying on colorSeriouscat.color, experimental, wcag2a, wcag141failure, needs review
no-autoplay-audioEnsures <video> or <audio> elements do not autoplay audio for more than 3 seconds without a control mechanism to stop or mute the audioModeratecat.time-and-media, wcag2a, wcag142, experimentalfailure, needs review80f0bf
p-as-headingEnsure p elements are not used to style headingsSeriouscat.semantics, wcag2a, wcag131, experimentalfailure
table-fake-captionEnsure that tables with a caption use the <caption> element.Seriouscat.tables, experimental, wcag2a, wcag131, section508, section508.22.gfailure
td-has-headerEnsure that each non-empty data cell in a large table has one or more table headersCriticalcat.tables, experimental, wcag2a, wcag131, section508, section508.22.gfailure

Deprecated Rules

Deprecated rules are not enabled by default and will be removed in the next major release.

There are no matching rules