Proposed better organization of a11y audits
See original GitHub issueI was wondering how LH folks feel about me putting together a PR to better categorize the accessibility audits? The current categories are kind of vague, e.g. “uses attributes correctly” for example.
Here’s a proposed reorg:
Best practices
- [id] attributes on the page are unique
- [user-scalable="no"] is not used in the <meta name="viewport"> element and the [maximum-scale] attribute is not less than 5.
- The document does not use <meta http-equiv="refresh">
Navigation
- [accesskey] values are unique
- No element has a [tabindex] value greater than 0
- The page contains a heading, skip link, or landmark region
Names and labels
- Document has a <title> element
- Form elements have associated labels
- Buttons have an accessible name
- Links have a discernible name
- <frame> or <iframe> elements have a title
- <object> elements have [alt] text
- Image elements have [alt] attributes
- <input type="image"> elements have [alt] text
ARIA
- [role]s have all required [aria-*] attributes
- Elements with [role] that require specific children [role]s, are present
- [role]s are contained by their required parent element
- [role] values are valid
- [aria-*] attributes match their roles
- [aria-*] attributes have valid values
- [aria-*] attributes are valid and not misspelled
Audio and video
- <audio> elements contain a <track> element with [kind="captions"]
- <video> elements contain a <track> element with [kind="captions"]
- <video> elements contain a <track> element with [kind="description"]
Tables and lists
- Cells in a <table> element that use the [headers] attribute only refer to other cells of that same table.
- <th> elements and elements with [role="columnheader"/"rowheader"] have data cells they describe.
- Presentational <table> elements avoid using <th>, <caption> or the [summary] attribute.
- <dl>'s contain only properly-ordered <dt> and <dd> groups, <script> or <template> elements.
- Definition list items are wrapped in <dl> elements
- Lists contain only <li> elements and script supporting elements (<script> and <template>).
- List items (<li>) are contained within <ul> or <ol> parent elements
Contrast
- Background and foreground colors have a sufficient contrast ratio
Internationalization and localization
- <html> element has a [lang] attribute
- <html> element has a valid value for its [lang] attribute
- [lang] attributes have a valid value
Manual audits
# Note, these are unchanged
- Interactive elements indicate their purpose and state
- Visual order on the page follows DOM order
- The page has a logical tab order
- Interactive controls are keyboard focusable
- The user's focus is directed to new content added to the page
- User focus is not accidentally trapped in a region
- Offscreen content is hidden from assistive technology
- Headings don't skip levels
- HTML5 landmark elements are used to improve navigation
- Custom controls have associated labels
- Custom controls have ARIA roles
Issue Analytics
- State:
- Created 5 years ago
- Reactions:3
- Comments:5 (5 by maintainers)
Top Results From Across the Web
The A11Y Project: Home
The A11Y Project is a community-driven effort to make digital accessibility easier. ... Learn more about this workshop ... Conduct an accessibility audit....
Read more >Why it's Important to Establish Audit Processes for Accessibility
Accessibility audits are a series of tests performed and provide a broader scope of information to improve online experiences.
Read more >How to run an accessibility audit - Siteimprove
The first step in any accessibility strategy is assessing your existing digital products, more commonly, your organization's website. What is an accessibility ......
Read more >United Nations Global Audit of Web Accessibility
November 2006. The United Nations contracted Nomensa to conduct this audit on. Internet accessibility for persons with disabilities. The audit, the first of....
Read more >Accessibility audits: how to do a 'quick and dirty' audit - Inviqa
Here I show you how to do an accessibility audit. And explain why it's a great place to start your accessibility journey.
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
oops I just remembered that some of these are manual audits, let me redo the list with that section…
OK, I’ll follow up with a PR then 😃