Scanned URL: https://dolby.com
Final Accessibility Score: 91 / 100
❌ Accessibility Violations
Ensures headings have discernible text
<h6 class="kicker"></h6>Ensures the order of headings is semantically correct
<h3>What’s new</h3>Ensures all page content is contained by landmarks
<div><div><div>…and 3 more.✅ Passed Audits
Ensures an element’s role supports its ARIA attributes
Ensures role attribute has an appropriate value for the element
Ensures ARIA attributes are used as described in the specification of the element’s role
Ensures elements do not use deprecated roles
Ensures aria-hidden=”true” is not present on the document body.
Ensures ARIA attributes are not prohibited for an element’s role
Ensures elements with ARIA roles have all required ARIA attributes
Ensures all elements with a role attribute use a valid value
Ensures all ARIA attributes have valid values
Ensures attributes that begin with aria- are valid ARIA attributes
Ensures buttons have discernible text
Ensures each page has at least one mechanism for a user to bypass navigation and jump straight to the content
Ensures the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
<p style=”margin: 4px 0 0 0; font-size: 0.85em; color: #555;”>Ensures each HTML document contains a non-empty <title> element</p>
</div><div style=”padding:15px; margin-bottom:15px; border:1px solid #ddd; border-left:5px solid #2e7d32; background:#f1f8e9;”>
<strong>IDs used in ARIA and labels must be unique</strong>
<p style=”margin: 4px 0 0 0; font-size: 0.85em; color: #555;”>Ensures every id attribute value used in ARIA and in labels is unique</p>
</div><div style=”padding:15px; margin-bottom:15px; border:1px solid #ddd; border-left:5px solid #2e7d32; background:#f1f8e9;”>
<strong>Headings should not be empty</strong>
<p style=”margin: 4px 0 0 0; font-size: 0.85em; color: #555;”>Ensures headings have discernible text</p>
</div><div style=”padding:15px; margin-bottom:15px; border:1px solid #ddd; border-left:5px solid #2e7d32; background:#f1f8e9;”>
<strong>Heading levels should only increase by one</strong>
<p style=”margin: 4px 0 0 0; font-size: 0.85em; color: #555;”>Ensures the order of headings is semantically correct</p>
</div><div style=”padding:15px; margin-bottom:15px; border:1px solid #ddd; border-left:5px solid #2e7d32; background:#f1f8e9;”>
<strong><html> element must have a lang attribute</strong>
<p style=”margin: 4px 0 0 0; font-size: 0.85em; color: #555;”>Ensures every HTML document has a lang attribute</p>
</div><div style=”padding:15px; margin-bottom:15px; border:1px solid #ddd; border-left:5px solid #2e7d32; background:#f1f8e9;”>
<strong><html> element must have a valid value for the lang attribute</strong>
<p style=”margin: 4px 0 0 0; font-size: 0.85em; color: #555;”>Ensures the lang attribute of the <html> element has a valid value</p>
</div><div style=”padding:15px; margin-bottom:15px; border:1px solid #ddd; border-left:5px solid #2e7d32; background:#f1f8e9;”>
<strong>Main landmark should not be contained in another landmark</strong>
<p style=”margin: 4px 0 0 0; font-size: 0.85em; color: #555;”>Ensures the main landmark is at top level</p>
</div><div style=”padding:15px; margin-bottom:15px; border:1px solid #ddd; border-left:5px solid #2e7d32; background:#f1f8e9;”>
<strong>Document should not have more than one main landmark</strong>
<p style=”margin: 4px 0 0 0; font-size: 0.85em; color: #555;”>Ensures the document has at most one main landmark</p>
</div><div style=”padding:15px; margin-bottom:15px; border:1px solid #ddd; border-left:5px solid #2e7d32; background:#f1f8e9;”>
<strong>Document should have one main landmark</strong>
<p style=”margin: 4px 0 0 0; font-size: 0.85em; color: #555;”>Ensures the document has a main landmark</p>
</div><div style=”padding:15px; margin-bottom:15px; border:1px solid #ddd; border-left:5px solid #2e7d32; background:#f1f8e9;”>
<strong>Ensures landmarks are unique</strong>
<p style=”margin: 4px 0 0 0; font-size: 0.85em; color: #555;”>Landmarks should have a unique role or role/label/title (i.e. accessible name) combination</p>
</div><div style=”padding:15px; margin-bottom:15px; border:1px solid #ddd; border-left:5px solid #2e7d32; background:#f1f8e9;”>
<strong>Links must have discernible text</strong>
<p style=”margin: 4px 0 0 0; font-size: 0.85em; color: #555;”>Ensures links have discernible text</p>
</div><div style=”padding:15px; margin-bottom:15px; border:1px solid #ddd; border-left:5px solid #2e7d32; background:#f1f8e9;”>
<strong>Users should be able to zoom and scale the text up to 500%</strong>
<p style=”margin: 4px 0 0 0; font-size: 0.85em; color: #555;”>Ensures <meta name=”viewport”> can scale a significant amount</p>
</div><div style=”padding:15px; margin-bottom:15px; border:1px solid #ddd; border-left:5px solid #2e7d32; background:#f1f8e9;”>
<strong>Zooming and scaling must not be disabled</strong>
<p style=”margin: 4px 0 0 0; font-size: 0.85em; color: #555;”>Ensures <meta name=”viewport”> does not disable text scaling and zooming</p>
</div><div style=”padding:15px; margin-bottom:15px; border:1px solid #ddd; border-left:5px solid #2e7d32; background:#f1f8e9;”>
<strong>Interactive controls must not be nested</strong>
<p style=”margin: 4px 0 0 0; font-size: 0.85em; color: #555;”>Ensures interactive controls are not nested as they are not always announced by screen readers or can cause focus problems for assistive technologies</p>
</div><div style=”padding:15px; margin-bottom:15px; border:1px solid #ddd; border-left:5px solid #2e7d32; background:#f1f8e9;”>
<strong>Page should contain a level-one heading</strong>
<p style=”margin: 4px 0 0 0; font-size: 0.85em; color: #555;”>Ensure that the page, or at least one of its frames contains a level-one heading</p>
</div><div style=”padding:15px; margin-bottom:15px; border:1px solid #ddd; border-left:5px solid #2e7d32; background:#f1f8e9;”>
<strong>All page content should be contained by landmarks</strong>
<p style=”margin: 4px 0 0 0; font-size: 0.85em; color: #555;”>Ensures all page content is contained by landmarks</p>
</div><div style=”padding:15px; margin-bottom:15px; border:1px solid #ddd; border-left:5px solid #2e7d32; background:#f1f8e9;”>
<strong>Scrollable region must have keyboard access</strong>
<p style=”margin: 4px 0 0 0; font-size: 0.85em; color: #555;”>Ensure elements that have scrollable content are accessible by keyboard</p>
</div></div>