accessibility-checker-engine
Version:
An automated accessibility checking engine for use by other tools
570 lines • 1.84 MB
HTML
<html lang="en-US">
<head>
<title>Accessibility Checker Rules</title>
<link rel="icon" href="https://ibm.com/able/favicon-32x32.png" type="image/png">
<link rel="icon" href="https://ibm.com/able/favicon.svg" type="image/svg+xml">
<link rel="stylesheet" href="./common/rules.css" />
<script type="module">
import "https://1.www.s81c.com/common/carbon/web-components/version/v1.35.0/code-snippet.min.js";
import "https://1.www.s81c.com/common/carbon/web-components/version/v1.35.0/list.min.js";
import "https://1.www.s81c.com/common/carbon/web-components/version/v1.35.0/content-switcher.min.js";
</script>
<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
<script>
function hookEvents() {
let mainSwitcher = document.getElementById("rsSwitcher");
mainSwitcher.addEventListener("bx-content-switcher-selected", (evt) => {
let oldValue = mainSwitcher.getAttribute("value") || "IBM_Accessibility";
let newValue = mainSwitcher.value;
document.getElementById(oldValue).style.display="none";
document.getElementById(newValue).style.display="block";
})
}
</script>
<head>
<body onload="hookEvents();">
<main>
<bx-content-switcher value="IBM_Accessibility" id="rsSwitcher">
<bx-content-switcher-item value="IBM_Accessibility">IBM Accessibility 7.3</bx-content-switcher-item><bx-content-switcher-item value="IBM_Accessibility_next">IBM Accessibility next</bx-content-switcher-item><bx-content-switcher-item value="WCAG_2_2">WCAG 2.2 (A, AA)</bx-content-switcher-item><bx-content-switcher-item value="WCAG_2_1">WCAG 2.1 (A, AA)</bx-content-switcher-item><bx-content-switcher-item value="WCAG_2_0">WCAG 2.0 (A, AA)</bx-content-switcher-item>
</bx-content-switcher>
<div id="IBM_Accessibility" style="padding: 1rem; display:block">
<div>
<h2>1.1.1 Non-text Content [A]</h2>
<div>All non-text content that is presented to the user has a text alternative that serves the equivalent purpose.</div>
<bx-unordered-list style="margin-top: .5rem"><bx-list-item><strong>applet_alt_exists</strong>: <applet> elements must provide an 'alt' attribute and an alternative description
<bx-unordered-list nested>
<bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.vst0{fill:none;}
.vst1{fill:#A2191F;}
.vst2{fill:#FFFFFF;fill-opacity:0;}
</style>
<rect class="vst0" width="16" height="16"/>
<path class="vst1" d="M8,1C4.1,1,1,4.1,1,8s3.1,7,7,7s7-3.1,7-7S11.9,1,8,1z M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
<path class="vst2" d="M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
</svg> Violation</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/applet_alt_exists.html#%7B%22message%22%3A%22An%20%3Capplet%3E%20element%20does%20not%20have%20an%20'alt'%20attribute%20that%20provides%20a%20short%20text%20alternative%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22VIOLATION%22%2C%22FAIL%22%5D%2C%22reasonId%22%3A%22Fail_1%22%7D">An <applet> element does not have an 'alt' attribute that provides a short text alternative</a></bx-list-item><bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.vst0{fill:none;}
.vst1{fill:#A2191F;}
.vst2{fill:#FFFFFF;fill-opacity:0;}
</style>
<rect class="vst0" width="16" height="16"/>
<path class="vst1" d="M8,1C4.1,1,1,4.1,1,8s3.1,7,7,7s7-3.1,7-7S11.9,1,8,1z M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
<path class="vst2" d="M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
</svg> Violation</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/applet_alt_exists.html#%7B%22message%22%3A%22The%20'alt'%20attribute%20value%20for%20an%20%3Capplet%3E%20element%20duplicates%20the%20'code'%20attribute%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22VIOLATION%22%2C%22FAIL%22%5D%2C%22reasonId%22%3A%22Fail_2%22%7D">The 'alt' attribute value for an <applet> element duplicates the 'code' attribute</a></bx-list-item><bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.vst0{fill:none;}
.vst1{fill:#A2191F;}
.vst2{fill:#FFFFFF;fill-opacity:0;}
</style>
<rect class="vst0" width="16" height="16"/>
<path class="vst1" d="M8,1C4.1,1,1,4.1,1,8s3.1,7,7,7s7-3.1,7-7S11.9,1,8,1z M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
<path class="vst2" d="M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
</svg> Violation</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/applet_alt_exists.html#%7B%22message%22%3A%22An%20%3Capplet%3E%20element%20provides%20alternative%20text%2C%20but%20does%20not%20provide%20inner%20content%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22VIOLATION%22%2C%22FAIL%22%5D%2C%22reasonId%22%3A%22Fail_3%22%7D">An <applet> element provides alternative text, but does not provide inner content</a></bx-list-item>
</bx-unordered-list>
</bx-list-item><bx-list-item><strong>img_alt_redundant</strong>: The text alternative for an image within a link should not repeat the link text or adjacent link text
<bx-unordered-list nested>
<bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.vst0{fill:none;}
.vst1{fill:#A2191F;}
.vst2{fill:#FFFFFF;fill-opacity:0;}
</style>
<rect class="vst0" width="16" height="16"/>
<path class="vst1" d="M8,1C4.1,1,1,4.1,1,8s3.1,7,7,7s7-3.1,7-7S11.9,1,8,1z M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
<path class="vst2" d="M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
</svg> Violation</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/img_alt_redundant.html#%7B%22message%22%3A%22Link%20text%20is%20repeated%20in%20an%20image%20'alt'%20value%20within%20the%20same%20link%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22VIOLATION%22%2C%22FAIL%22%5D%2C%22reasonId%22%3A%22Fail_1%22%7D">Link text is repeated in an image 'alt' value within the same link</a></bx-list-item><bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.vst0{fill:none;}
.vst1{fill:#A2191F;}
.vst2{fill:#FFFFFF;fill-opacity:0;}
</style>
<rect class="vst0" width="16" height="16"/>
<path class="vst1" d="M8,1C4.1,1,1,4.1,1,8s3.1,7,7,7s7-3.1,7-7S11.9,1,8,1z M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
<path class="vst2" d="M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
</svg> Violation</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/img_alt_redundant.html#%7B%22message%22%3A%22Link%20text%20of%20previous%20link%20is%20repeated%20in%20image%20'alt'%20value%20of%20a%20link%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22VIOLATION%22%2C%22FAIL%22%5D%2C%22reasonId%22%3A%22Fail_2%22%7D">Link text of previous link is repeated in image 'alt' value of a link</a></bx-list-item><bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.vst0{fill:none;}
.vst1{fill:#A2191F;}
.vst2{fill:#FFFFFF;fill-opacity:0;}
</style>
<rect class="vst0" width="16" height="16"/>
<path class="vst1" d="M8,1C4.1,1,1,4.1,1,8s3.1,7,7,7s7-3.1,7-7S11.9,1,8,1z M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
<path class="vst2" d="M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
</svg> Violation</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/img_alt_redundant.html#%7B%22message%22%3A%22Image%20'alt'%20value%20within%20a%20link%20is%20repeated%20in%20link%20text%20of%20the%20link%20after%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22VIOLATION%22%2C%22FAIL%22%5D%2C%22reasonId%22%3A%22Fail_3%22%7D">Image 'alt' value within a link is repeated in link text of the link after</a></bx-list-item>
</bx-unordered-list>
</bx-list-item><bx-list-item><strong>img_alt_valid</strong>: Images must have accessible names unless they are decorative or redundant
<bx-unordered-list nested>
<bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.vst0{fill:none;}
.vst1{fill:#A2191F;}
.vst2{fill:#FFFFFF;fill-opacity:0;}
</style>
<rect class="vst0" width="16" height="16"/>
<path class="vst1" d="M8,1C4.1,1,1,4.1,1,8s3.1,7,7,7s7-3.1,7-7S11.9,1,8,1z M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
<path class="vst2" d="M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
</svg> Violation</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/img_alt_valid.html#%7B%22message%22%3A%22Image%20'alt'%20attribute%20value%20consists%20only%20of%20blank%20space(s)%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22VIOLATION%22%2C%22FAIL%22%5D%2C%22reasonId%22%3A%22fail_blank_alt%22%7D">Image 'alt' attribute value consists only of blank space(s)</a></bx-list-item><bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.vst0{fill:none;}
.vst1{fill:#A2191F;}
.vst2{fill:#FFFFFF;fill-opacity:0;}
</style>
<rect class="vst0" width="16" height="16"/>
<path class="vst1" d="M8,1C4.1,1,1,4.1,1,8s3.1,7,7,7s7-3.1,7-7S11.9,1,8,1z M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
<path class="vst2" d="M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
</svg> Violation</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/img_alt_valid.html#%7B%22message%22%3A%22The%20image%20has%20neither%20an%20accessible%20name%20nor%20is%20marked%20as%20decorative%20or%20redundant%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22VIOLATION%22%2C%22FAIL%22%5D%2C%22reasonId%22%3A%22fail_no_alt%22%7D">The image has neither an accessible name nor is marked as decorative or redundant</a></bx-list-item><bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.vst0{fill:none;}
.vst1{fill:#A2191F;}
.vst2{fill:#FFFFFF;fill-opacity:0;}
</style>
<rect class="vst0" width="16" height="16"/>
<path class="vst1" d="M8,1C4.1,1,1,4.1,1,8s3.1,7,7,7s7-3.1,7-7S11.9,1,8,1z M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
<path class="vst2" d="M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
</svg> Violation</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/img_alt_valid.html#%7B%22message%22%3A%22The%20image%20does%20not%20have%20an%20'alt'%20attribute%20or%20ARIA%20label%2C%20and%20the%20'title'%20attribute%20value%20consists%20only%20of%20blank%20space(s)%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22VIOLATION%22%2C%22FAIL%22%5D%2C%22reasonId%22%3A%22fail_blank_title%22%7D">The image does not have an 'alt' attribute or ARIA label, and the 'title' attribute value consists only of blank space(s)</a></bx-list-item>
</bx-unordered-list>
</bx-list-item><bx-list-item><strong>area_alt_exists</strong>: <area> elements in an image map must have a text alternative
<bx-unordered-list nested>
<bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.vst0{fill:none;}
.vst1{fill:#A2191F;}
.vst2{fill:#FFFFFF;fill-opacity:0;}
</style>
<rect class="vst0" width="16" height="16"/>
<path class="vst1" d="M8,1C4.1,1,1,4.1,1,8s3.1,7,7,7s7-3.1,7-7S11.9,1,8,1z M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
<path class="vst2" d="M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
</svg> Violation</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/area_alt_exists.html#%7B%22message%22%3A%22%3Carea%3E%20element%20in%20an%20image%20map%20has%20no%20text%20alternative%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22VIOLATION%22%2C%22FAIL%22%5D%2C%22reasonId%22%3A%22Fail_1%22%7D"><area> element in an image map has no text alternative</a></bx-list-item>
</bx-unordered-list>
</bx-list-item><bx-list-item><strong>imagebutton_alt_exists</strong>: The <input> element of type "image" should have a text alternative
<bx-unordered-list nested>
<bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.vst0{fill:none;}
.vst1{fill:#A2191F;}
.vst2{fill:#FFFFFF;fill-opacity:0;}
</style>
<rect class="vst0" width="16" height="16"/>
<path class="vst1" d="M8,1C4.1,1,1,4.1,1,8s3.1,7,7,7s7-3.1,7-7S11.9,1,8,1z M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
<path class="vst2" d="M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
</svg> Violation</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/imagebutton_alt_exists.html#%7B%22message%22%3A%22The%20%3Cinput%3E%20element%20of%20type%20%5C%22image%5C%22%20has%20no%20text%20alternative%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22VIOLATION%22%2C%22FAIL%22%5D%2C%22reasonId%22%3A%22Fail%22%7D">The <input> element of type "image" has no text alternative</a></bx-list-item>
</bx-unordered-list>
</bx-list-item><bx-list-item><strong>imagemap_alt_exists</strong>: An image map and each <area> element in an image map must have text alternative(s)
<bx-unordered-list nested>
<bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.vst0{fill:none;}
.vst1{fill:#A2191F;}
.vst2{fill:#FFFFFF;fill-opacity:0;}
</style>
<rect class="vst0" width="16" height="16"/>
<path class="vst1" d="M8,1C4.1,1,1,4.1,1,8s3.1,7,7,7s7-3.1,7-7S11.9,1,8,1z M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
<path class="vst2" d="M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
</svg> Violation</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/imagemap_alt_exists.html#%7B%22message%22%3A%22Image%20map%20or%20child%20%3Carea%3E%20has%20no%20text%20alternative%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22VIOLATION%22%2C%22FAIL%22%5D%2C%22reasonId%22%3A%22Fail_1%22%7D">Image map or child <area> has no text alternative</a></bx-list-item>
</bx-unordered-list>
</bx-list-item><bx-list-item><strong>img_alt_decorative</strong>: Image designated as decorative must have 'alt=""
<bx-unordered-list nested>
<bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.vst0{fill:none;}
.vst1{fill:#A2191F;}
.vst2{fill:#FFFFFF;fill-opacity:0;}
</style>
<rect class="vst0" width="16" height="16"/>
<path class="vst1" d="M8,1C4.1,1,1,4.1,1,8s3.1,7,7,7s7-3.1,7-7S11.9,1,8,1z M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
<path class="vst2" d="M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
</svg> Violation</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/img_alt_decorative.html#%7B%22message%22%3A%22Image%20designated%20as%20decorative%20has%20non-null%20'alt'%20attribute%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22VIOLATION%22%2C%22FAIL%22%5D%2C%22reasonId%22%3A%22Fail_1%22%7D">Image designated as decorative has non-null 'alt' attribute</a></bx-list-item>
</bx-unordered-list>
</bx-list-item><bx-list-item><strong>img_alt_null</strong>: When the intent is to mark an image as decorative with an empty 'alt' attribute, the 'aria' or 'title' attributes should not be used
<bx-unordered-list nested>
<bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.vst0{fill:none;}
.vst1{fill:#A2191F;}
.vst2{fill:#FFFFFF;fill-opacity:0;}
</style>
<rect class="vst0" width="16" height="16"/>
<path class="vst1" d="M8,1C4.1,1,1,4.1,1,8s3.1,7,7,7s7-3.1,7-7S11.9,1,8,1z M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
<path class="vst2" d="M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
</svg> Violation</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/img_alt_null.html#%7B%22message%22%3A%22The%20image%20'alt'%20attribute%20is%20empty%2C%20but%20the%20'title'%20attribute%20is%20not%20empty%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22VIOLATION%22%2C%22FAIL%22%5D%2C%22reasonId%22%3A%22fail_decorative%22%7D">The image 'alt' attribute is empty, but the 'title' attribute is not empty</a></bx-list-item>
</bx-unordered-list>
</bx-list-item><bx-list-item><strong>object_text_exists</strong>: <object> element must have a text alternative for the content rendered by the object
<bx-unordered-list nested>
<bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.vst0{fill:none;}
.vst1{fill:#A2191F;}
.vst2{fill:#FFFFFF;fill-opacity:0;}
</style>
<rect class="vst0" width="16" height="16"/>
<path class="vst1" d="M8,1C4.1,1,1,4.1,1,8s3.1,7,7,7s7-3.1,7-7S11.9,1,8,1z M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
<path class="vst2" d="M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
</svg> Violation</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/object_text_exists.html#%7B%22message%22%3A%22An%20%3Cobject%3E%20element%20does%20not%20have%20a%20text%20alternative%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22VIOLATION%22%2C%22FAIL%22%5D%2C%22reasonId%22%3A%22fail_no_text_alternative%22%7D">An <object> element does not have a text alternative</a></bx-list-item>
</bx-unordered-list>
</bx-list-item><bx-list-item><strong>svg_graphics_labelled</strong>: A non-decorative SVG element must have an accessible name
<bx-unordered-list nested>
<bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.vst0{fill:none;}
.vst1{fill:#A2191F;}
.vst2{fill:#FFFFFF;fill-opacity:0;}
</style>
<rect class="vst0" width="16" height="16"/>
<path class="vst1" d="M8,1C4.1,1,1,4.1,1,8s3.1,7,7,7s7-3.1,7-7S11.9,1,8,1z M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
<path class="vst2" d="M10.7,11.5L4.5,5.3l0.8-0.8l6.2,6.2L10.7,11.5z"/>
</svg> Violation</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/svg_graphics_labelled.html#%7B%22message%22%3A%22The%20SVG%20element%20has%20no%20accessible%20name%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22VIOLATION%22%2C%22FAIL%22%5D%2C%22reasonId%22%3A%22fail_acc_name%22%7D">The SVG element has no accessible name</a></bx-list-item>
</bx-unordered-list>
</bx-list-item><bx-list-item><strong>application_content_accessible</strong>: Non-decorative static text and image content within an element with "application" role must be accessible
<bx-unordered-list nested>
<bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.nrst0{fill:none;}
.nrst1{fill:#F1C21B;}
</style>
<rect class="nrst0" width="16" height="16"/>
<path class="nrst1" d="M14.9,13.3l-6.5-12C8.3,1,8,0.9,7.8,1.1c-0.1,0-0.2,0.1-0.2,0.2l-6.5,12c-0.1,0.1-0.1,0.3,0,0.5
C1.2,13.9,1.3,14,1.5,14h13c0.2,0,0.3-0.1,0.4-0.2C15,13.6,15,13.4,14.9,13.3z M7.4,4h1.1v5H7.4V4z M8,11.8c-0.4,0-0.8-0.4-0.8-0.8
s0.4-0.8,0.8-0.8c0.4,0,0.8,0.4,0.8,0.8S8.4,11.8,8,11.8z"/>
<g><g><g>
<rect x="7.45" y="4" width="1.1" height="5"/>
</g></g><g><g>
<circle cx="8" cy="11" r="0.8"/>
</g></g></g>
</svg> Needs review</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/application_content_accessible.html#%7B%22message%22%3A%22Verify%20that%20the%20non-decorative%20static%20text%20and%20image%20content%20within%20an%20element%20with%20%5C%22application%5C%22%20role%20are%20accessible%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22VIOLATION%22%2C%22POTENTIAL%22%5D%2C%22reasonId%22%3A%22Potential_1%22%7D">Verify that the non-decorative static text and image content within an element with "application" role are accessible</a></bx-list-item>
</bx-unordered-list>
</bx-list-item><bx-list-item><strong>img_alt_misuse</strong>: 'alt' attribute value must be a good inline replacement for the image
<bx-unordered-list nested>
<bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.nrst0{fill:none;}
.nrst1{fill:#F1C21B;}
</style>
<rect class="nrst0" width="16" height="16"/>
<path class="nrst1" d="M14.9,13.3l-6.5-12C8.3,1,8,0.9,7.8,1.1c-0.1,0-0.2,0.1-0.2,0.2l-6.5,12c-0.1,0.1-0.1,0.3,0,0.5
C1.2,13.9,1.3,14,1.5,14h13c0.2,0,0.3-0.1,0.4-0.2C15,13.6,15,13.4,14.9,13.3z M7.4,4h1.1v5H7.4V4z M8,11.8c-0.4,0-0.8-0.4-0.8-0.8
s0.4-0.8,0.8-0.8c0.4,0,0.8,0.4,0.8,0.8S8.4,11.8,8,11.8z"/>
<g><g><g>
<rect x="7.45" y="4" width="1.1" height="5"/>
</g></g><g><g>
<circle cx="8" cy="11" r="0.8"/>
</g></g></g>
</svg> Needs review</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/img_alt_misuse.html#%7B%22message%22%3A%22Verify%20that%20the%20file%20name%20serves%20as%20a%20good%20inline%20replacement%20for%20the%20image%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22VIOLATION%22%2C%22POTENTIAL%22%5D%2C%22reasonId%22%3A%22Potential_1%22%7D">Verify that the file name serves as a good inline replacement for the image</a></bx-list-item>
</bx-unordered-list>
</bx-list-item><bx-list-item><strong>img_ismap_misuse</strong>: Server-side image map hot-spots must have duplicate text links
<bx-unordered-list nested>
<bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.nrst0{fill:none;}
.nrst1{fill:#F1C21B;}
</style>
<rect class="nrst0" width="16" height="16"/>
<path class="nrst1" d="M14.9,13.3l-6.5-12C8.3,1,8,0.9,7.8,1.1c-0.1,0-0.2,0.1-0.2,0.2l-6.5,12c-0.1,0.1-0.1,0.3,0,0.5
C1.2,13.9,1.3,14,1.5,14h13c0.2,0,0.3-0.1,0.4-0.2C15,13.6,15,13.4,14.9,13.3z M7.4,4h1.1v5H7.4V4z M8,11.8c-0.4,0-0.8-0.4-0.8-0.8
s0.4-0.8,0.8-0.8c0.4,0,0.8,0.4,0.8,0.8S8.4,11.8,8,11.8z"/>
<g><g><g>
<rect x="7.45" y="4" width="1.1" height="5"/>
</g></g><g><g>
<circle cx="8" cy="11" r="0.8"/>
</g></g></g>
</svg> Needs review</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/img_ismap_misuse.html#%7B%22message%22%3A%22Server-side%20image%20map%20hot-spots%20do%20not%20have%20duplicate%20text%20links%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22VIOLATION%22%2C%22POTENTIAL%22%5D%2C%22reasonId%22%3A%22Potential_1%22%7D">Server-side image map hot-spots do not have duplicate text links</a></bx-list-item>
</bx-unordered-list>
</bx-list-item><bx-list-item><strong>img_longdesc_misuse</strong>: The 'longdesc' attribute must reference HTML content
<bx-unordered-list nested>
<bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.nrst0{fill:none;}
.nrst1{fill:#F1C21B;}
</style>
<rect class="nrst0" width="16" height="16"/>
<path class="nrst1" d="M14.9,13.3l-6.5-12C8.3,1,8,0.9,7.8,1.1c-0.1,0-0.2,0.1-0.2,0.2l-6.5,12c-0.1,0.1-0.1,0.3,0,0.5
C1.2,13.9,1.3,14,1.5,14h13c0.2,0,0.3-0.1,0.4-0.2C15,13.6,15,13.4,14.9,13.3z M7.4,4h1.1v5H7.4V4z M8,11.8c-0.4,0-0.8-0.4-0.8-0.8
s0.4-0.8,0.8-0.8c0.4,0,0.8,0.4,0.8,0.8S8.4,11.8,8,11.8z"/>
<g><g><g>
<rect x="7.45" y="4" width="1.1" height="5"/>
</g></g><g><g>
<circle cx="8" cy="11" r="0.8"/>
</g></g></g>
</svg> Needs review</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/img_longdesc_misuse.html#%7B%22message%22%3A%22Verify%20that%20the%20file%20designated%20by%20the%20'longdesc'%20attribute%20contains%20valid%20HTML%20content%20(file%20extension%20not%20recognized)%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22VIOLATION%22%2C%22POTENTIAL%22%5D%2C%22reasonId%22%3A%22Potential_1%22%7D">Verify that the file designated by the 'longdesc' attribute contains valid HTML content (file extension not recognized)</a></bx-list-item>
</bx-unordered-list>
</bx-list-item><bx-list-item><strong>media_alt_exists</strong>: Audio or video on the page must have a short text alternative that describes the media content
<bx-unordered-list nested>
<bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.nrst0{fill:none;}
.nrst1{fill:#F1C21B;}
</style>
<rect class="nrst0" width="16" height="16"/>
<path class="nrst1" d="M14.9,13.3l-6.5-12C8.3,1,8,0.9,7.8,1.1c-0.1,0-0.2,0.1-0.2,0.2l-6.5,12c-0.1,0.1-0.1,0.3,0,0.5
C1.2,13.9,1.3,14,1.5,14h13c0.2,0,0.3-0.1,0.4-0.2C15,13.6,15,13.4,14.9,13.3z M7.4,4h1.1v5H7.4V4z M8,11.8c-0.4,0-0.8-0.4-0.8-0.8
s0.4-0.8,0.8-0.8c0.4,0,0.8,0.4,0.8,0.8S8.4,11.8,8,11.8z"/>
<g><g><g>
<rect x="7.45" y="4" width="1.1" height="5"/>
</g></g><g><g>
<circle cx="8" cy="11" r="0.8"/>
</g></g></g>
</svg> Needs review</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/media_alt_exists.html#%7B%22message%22%3A%22Filename%20used%20as%20label%20for%20embedded%20audio%20or%20video%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22VIOLATION%22%2C%22POTENTIAL%22%5D%2C%22reasonId%22%3A%22Potential_1%22%7D">Filename used as label for embedded audio or video</a></bx-list-item>
</bx-unordered-list>
</bx-list-item><bx-list-item><strong>style_background_decorative</strong>: Images included by using CSS alone must not convey important information
<bx-unordered-list nested>
<bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.nrst0{fill:none;}
.nrst1{fill:#F1C21B;}
</style>
<rect class="nrst0" width="16" height="16"/>
<path class="nrst1" d="M14.9,13.3l-6.5-12C8.3,1,8,0.9,7.8,1.1c-0.1,0-0.2,0.1-0.2,0.2l-6.5,12c-0.1,0.1-0.1,0.3,0,0.5
C1.2,13.9,1.3,14,1.5,14h13c0.2,0,0.3-0.1,0.4-0.2C15,13.6,15,13.4,14.9,13.3z M7.4,4h1.1v5H7.4V4z M8,11.8c-0.4,0-0.8-0.4-0.8-0.8
s0.4-0.8,0.8-0.8c0.4,0,0.8,0.4,0.8,0.8S8.4,11.8,8,11.8z"/>
<g><g><g>
<rect x="7.45" y="4" width="1.1" height="5"/>
</g></g><g><g>
<circle cx="8" cy="11" r="0.8"/>
</g></g></g>
</svg> Needs review</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/style_background_decorative.html#%7B%22message%22%3A%22Verify%20the%20CSS%20background%20image%20does%20not%20convey%20important%20information%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22VIOLATION%22%2C%22POTENTIAL%22%5D%2C%22reasonId%22%3A%22Potential_1%22%7D">Verify the CSS background image does not convey important information</a></bx-list-item>
</bx-unordered-list>
</bx-list-item><bx-list-item><strong>style_highcontrast_visible</strong>: Windows high contrast mode must be supported when using CSS to include, position or alter non-decorative content
<bx-unordered-list nested>
<bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.nrst0{fill:none;}
.nrst1{fill:#F1C21B;}
</style>
<rect class="nrst0" width="16" height="16"/>
<path class="nrst1" d="M14.9,13.3l-6.5-12C8.3,1,8,0.9,7.8,1.1c-0.1,0-0.2,0.1-0.2,0.2l-6.5,12c-0.1,0.1-0.1,0.3,0,0.5
C1.2,13.9,1.3,14,1.5,14h13c0.2,0,0.3-0.1,0.4-0.2C15,13.6,15,13.4,14.9,13.3z M7.4,4h1.1v5H7.4V4z M8,11.8c-0.4,0-0.8-0.4-0.8-0.8
s0.4-0.8,0.8-0.8c0.4,0,0.8,0.4,0.8,0.8S8.4,11.8,8,11.8z"/>
<g><g><g>
<rect x="7.45" y="4" width="1.1" height="5"/>
</g></g><g><g>
<circle cx="8" cy="11" r="0.8"/>
</g></g></g>
</svg> Needs review</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/style_highcontrast_visible.html#%7B%22message%22%3A%22Confirm%20Windows%20high%20contrast%20mode%20is%20supported%20when%20using%20CSS%20to%20include%2C%20position%20or%20alter%20non-decorative%20content%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22VIOLATION%22%2C%22MANUAL%22%5D%2C%22reasonId%22%3A%22Manual_1%22%7D">Confirm Windows high contrast mode is supported when using CSS to include, position or alter non-decorative content</a></bx-list-item>
</bx-unordered-list>
</bx-list-item><bx-list-item><strong>figure_label_exists</strong>: A <figure> element must have an associated label
<bx-unordered-list nested>
<bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.st0{fill:none;}
.st1{fill:#0043CE;}
.st2{fill:#FFFFFF;}
.st3{font-family:'IBMPlexSerif';}
.st4{font-size:12.9996px;}
</style>
<rect class="st0" width="16" height="16"/>
<path class="st1" d="M14,15H2c-0.6,0-1-0.4-1-1V2c0-0.6,0.4-1,1-1h12c0.6,0,1,0.4,1,1v12C15,14.6,14.6,15,14,15z"/>
<text transform="matrix(1 0 0 1 5.9528 12.5044)" class="st2 st3 st4">i</text>
</svg> Recommendation</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/figure_label_exists.html#%7B%22message%22%3A%22The%20%3Cfigure%3E%20element%20does%20not%20have%20an%20associated%20label%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22RECOMMENDATION%22%2C%22FAIL%22%5D%2C%22reasonId%22%3A%22Fail_1%22%7D">The <figure> element does not have an associated label</a></bx-list-item>
</bx-unordered-list>
</bx-list-item><bx-list-item><strong>embed_alt_exists</strong>: Provide alternative content for <embed> elements
<bx-unordered-list nested>
<bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.st0{fill:none;}
.st1{fill:#0043CE;}
.st2{fill:#FFFFFF;}
.st3{font-family:'IBMPlexSerif';}
.st4{font-size:12.9996px;}
</style>
<rect class="st0" width="16" height="16"/>
<path class="st1" d="M14,15H2c-0.6,0-1-0.4-1-1V2c0-0.6,0.4-1,1-1h12c0.6,0,1,0.4,1,1v12C15,14.6,14.6,15,14,15z"/>
<text transform="matrix(1 0 0 1 5.9528 12.5044)" class="st2 st3 st4">i</text>
</svg> Recommendation</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/embed_alt_exists.html#%7B%22message%22%3A%22Verify%20that%20the%20%3Cembed%3E%20element%20has%20alternative%20content%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22RECOMMENDATION%22%2C%22POTENTIAL%22%5D%2C%22reasonId%22%3A%22Potential_1%22%7D">Verify that the <embed> element has alternative content</a></bx-list-item>
</bx-unordered-list>
</bx-list-item><bx-list-item><strong>embed_noembed_exists</strong>: <embed> elements should be immediately followed by a non-embedded element
<bx-unordered-list nested>
<bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.st0{fill:none;}
.st1{fill:#0043CE;}
.st2{fill:#FFFFFF;}
.st3{font-family:'IBMPlexSerif';}
.st4{font-size:12.9996px;}
</style>
<rect class="st0" width="16" height="16"/>
<path class="st1" d="M14,15H2c-0.6,0-1-0.4-1-1V2c0-0.6,0.4-1,1-1h12c0.6,0,1,0.4,1,1v12C15,14.6,14.6,15,14,15z"/>
<text transform="matrix(1 0 0 1 5.9528 12.5044)" class="st2 st3 st4">i</text>
</svg> Recommendation</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/embed_noembed_exists.html#%7B%22message%22%3A%22Verify%20that%20the%20%3Cembed%3E%20element%20is%20immediately%20followed%20by%20a%20non-embedded%20element%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22RECOMMENDATION%22%2C%22POTENTIAL%22%5D%2C%22reasonId%22%3A%22Potential_1%22%7D">Verify that the <embed> element is immediately followed by a non-embedded element</a></bx-list-item>
</bx-unordered-list>
</bx-list-item><bx-list-item><strong>media_alt_brief</strong>: Alternative text in 'alt' attribute should be brief (<150 characters)
<bx-unordered-list nested>
<bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.st0{fill:none;}
.st1{fill:#0043CE;}
.st2{fill:#FFFFFF;}
.st3{font-family:'IBMPlexSerif';}
.st4{font-size:12.9996px;}
</style>
<rect class="st0" width="16" height="16"/>
<path class="st1" d="M14,15H2c-0.6,0-1-0.4-1-1V2c0-0.6,0.4-1,1-1h12c0.6,0,1,0.4,1,1v12C15,14.6,14.6,15,14,15z"/>
<text transform="matrix(1 0 0 1 5.9528 12.5044)" class="st2 st3 st4">i</text>
</svg> Recommendation</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/media_alt_brief.html#%7B%22message%22%3A%22Text%20alternative%20is%20more%20than%20150%20characters%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22RECOMMENDATION%22%2C%22POTENTIAL%22%5D%2C%22reasonId%22%3A%22Potential_1%22%7D">Text alternative is more than 150 characters</a></bx-list-item>
</bx-unordered-list>
</bx-list-item><bx-list-item><strong>noembed_content_exists</strong>: <noembed> elements should contain descriptive text
<bx-unordered-list nested>
<bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.st0{fill:none;}
.st1{fill:#0043CE;}
.st2{fill:#FFFFFF;}
.st3{font-family:'IBMPlexSerif';}
.st4{font-size:12.9996px;}
</style>
<rect class="st0" width="16" height="16"/>
<path class="st1" d="M14,15H2c-0.6,0-1-0.4-1-1V2c0-0.6,0.4-1,1-1h12c0.6,0,1,0.4,1,1v12C15,14.6,14.6,15,14,15z"/>
<text transform="matrix(1 0 0 1 5.9528 12.5044)" class="st2 st3 st4">i</text>
</svg> Recommendation</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/noembed_content_exists.html#%7B%22message%22%3A%22Add%20descriptive%20text%20to%20the%20%3Cnoembed%3E%20element%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22RECOMMENDATION%22%2C%22POTENTIAL%22%5D%2C%22reasonId%22%3A%22Potential_1%22%7D">Add descriptive text to the <noembed> element</a></bx-list-item>
</bx-unordered-list>
</bx-list-item><bx-list-item><strong>canvas_content_described</strong>: The <canvas> element may not be accessible
<bx-unordered-list nested>
<bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.st0{fill:none;}
.st1{fill:#0043CE;}
.st2{fill:#FFFFFF;}
.st3{font-family:'IBMPlexSerif';}
.st4{font-size:12.9996px;}
</style>
<rect class="st0" width="16" height="16"/>
<path class="st1" d="M14,15H2c-0.6,0-1-0.4-1-1V2c0-0.6,0.4-1,1-1h12c0.6,0,1,0.4,1,1v12C15,14.6,14.6,15,14,15z"/>
<text transform="matrix(1 0 0 1 5.9528 12.5044)" class="st2 st3 st4">i</text>
</svg> Recommendation</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/canvas_content_described.html#%7B%22message%22%3A%22Verify%20accessibility%20of%20the%20%3Ccanvas%3E%20element%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22RECOMMENDATION%22%2C%22MANUAL%22%5D%2C%22reasonId%22%3A%22Manual_1%22%7D">Verify accessibility of the <canvas> element</a></bx-list-item>
</bx-unordered-list>
</bx-list-item><bx-list-item><strong>img_alt_background</strong>: Background images that convey important information must have a text alternative that describes the image
<bx-unordered-list nested>
<bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.st0{fill:none;}
.st1{fill:#0043CE;}
.st2{fill:#FFFFFF;}
.st3{font-family:'IBMPlexSerif';}
.st4{font-size:12.9996px;}
</style>
<rect class="st0" width="16" height="16"/>
<path class="st1" d="M14,15H2c-0.6,0-1-0.4-1-1V2c0-0.6,0.4-1,1-1h12c0.6,0,1,0.4,1,1v12C15,14.6,14.6,15,14,15z"/>
<text transform="matrix(1 0 0 1 5.9528 12.5044)" class="st2 st3 st4">i</text>
</svg> Recommendation</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/img_alt_background.html#%7B%22message%22%3A%22Verify%20important%20background%20image%20information%20has%20a%20text%20alternative%20in%20system%20high%20contrast%20mode%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22RECOMMENDATION%22%2C%22MANUAL%22%5D%2C%22reasonId%22%3A%22Manual_1%22%7D">Verify important background image information has a text alternative in system high contrast mode</a></bx-list-item>
</bx-unordered-list>
</bx-list-item></bx-unordered-list>
</div><div>
<h2>1.2.1 Audio-only and Video-only (Prerecorded) [A]</h2>
<div>For prerecorded audio-only or video-only media, an alternative provides equivalent information.</div>
<bx-unordered-list style="margin-top: .5rem"><bx-list-item><strong>media_audio_transcribed</strong>: Audio information should also be available in text form
<bx-unordered-list nested>
<bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.st0{fill:none;}
.st1{fill:#0043CE;}
.st2{fill:#FFFFFF;}
.st3{font-family:'IBMPlexSerif';}
.st4{font-size:12.9996px;}
</style>
<rect class="st0" width="16" height="16"/>
<path class="st1" d="M14,15H2c-0.6,0-1-0.4-1-1V2c0-0.6,0.4-1,1-1h12c0.6,0,1,0.4,1,1v12C15,14.6,14.6,15,14,15z"/>
<text transform="matrix(1 0 0 1 5.9528 12.5044)" class="st2 st3 st4">i</text>
</svg> Recommendation</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/media_audio_transcribed.html#%7B%22message%22%3A%22Provide%20transcripts%20for%20audio%20files%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22RECOMMENDATION%22%2C%22MANUAL%22%5D%2C%22reasonId%22%3A%22Manual_1%22%7D">Provide transcripts for audio files</a></bx-list-item>
</bx-unordered-list>
</bx-list-item></bx-unordered-list>
</div><div>
<h2>1.2.2 Captions (Prerecorded) [A]</h2>
<div>Captions are provided for all prerecorded audio content in synchronized media.</div>
<bx-unordered-list style="margin-top: .5rem"><bx-list-item><strong>caption_track_exists</strong>: A <video> element must have a text alternative for any meaningful audio content
<bx-unordered-list nested>
<bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.nrst0{fill:none;}
.nrst1{fill:#F1C21B;}
</style>
<rect class="nrst0" width="16" height="16"/>
<path class="nrst1" d="M14.9,13.3l-6.5-12C8.3,1,8,0.9,7.8,1.1c-0.1,0-0.2,0.1-0.2,0.2l-6.5,12c-0.1,0.1-0.1,0.3,0,0.5
C1.2,13.9,1.3,14,1.5,14h13c0.2,0,0.3-0.1,0.4-0.2C15,13.6,15,13.4,14.9,13.3z M7.4,4h1.1v5H7.4V4z M8,11.8c-0.4,0-0.8-0.4-0.8-0.8
s0.4-0.8,0.8-0.8c0.4,0,0.8,0.4,0.8,0.8S8.4,11.8,8,11.8z"/>
<g><g><g>
<rect x="7.45" y="4" width="1.1" height="5"/>
</g></g><g><g>
<circle cx="8" cy="11" r="0.8"/>
</g></g></g>
</svg> Needs review</span> —
<a target="_blank" rel="noopener noreferrer" href="./en-US/caption_track_exists.html#%7B%22message%22%3A%22Verify%20that%20captions%20are%20available%20for%20any%20meaningful%20audio%20or%20provide%20a%20caption%20track%20for%20the%20%3Cvideo%3E%20element%22%2C%22msgArgs%22%3A%5B%22%7B0%7D%22%2C%22%7B1%7D%22%2C%22%7B3%7D%22%2C%22%7B4%7D%22%5D%2C%22value%22%3A%5B%22VIOLATION%22%2C%22POTENTIAL%22%5D%2C%22reasonId%22%3A%22Potential_1%22%7D">Verify that captions are available for any meaningful audio or provide a caption track for the <video> element</a></bx-list-item>
</bx-unordered-list>
</bx-list-item></bx-unordered-list>
</div><div>
<h2>1.2.3 Audio Description or Media Alternative (Prerecorded) [A]</h2>
<div>An alternative for time-based media or audio description of the prerecorded video content is provided for synchronized media.</div>
<bx-unordered-list style="margin-top: .5rem"><bx-list-item><strong>media_track_available</strong>: Pre-recorded media should have an audio track that describes visual information
<bx-unordered-list nested>
<bx-list-item><span class="issueLevel"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="16px" height="16px" viewBox="0 0 16 16" style="enable-background:new 0 0 16 16;" xml:space="preserve" aria-hidden="true">
<style type="text/css">
.st0{fill:none;}
.st1{fill:#0043CE;}
.st2{fill:#FFFFFF;}
.st3{font-family:'IBMPlexSerif';}
.st4{font-size:12.9996px;}
</style>
<rect class="st0" width="16" height="16"/>
<pat