Accessibility Audit Tool

Accessibility Issue	Description	Reason
Links do not have a discernible name	Links should have text that describes their purpose.	Helps users, especially those using screen readers, understand where the link will take them.
[aria-hidden="true"] is not present on the document <body>	The body tag does not have the aria-hidden attribute set to true.	Improves accessibility by ensuring screen readers do not read hidden content.
[user-scalable="no"] is not used in the <meta name="viewport"> element and the [maximum-scale] attribute is not less than 5.	Viewport settings do not prevent users from zooming.	Allowing zooming helps users with visual impairments to better see the content.
[aria-hidden="true"] elements do not contain focusable descendants	Hidden elements should not have focusable child elements.	Prevents confusion for keyboard and screen reader users by ensuring they do not navigate to hidden elements.
Background and foreground colors have a sufficient contrast ratio	Text and background colors should contrast enough to be easily readable.	Improves readability for users with visual impairments.
Document has a <title> element	The webpage should have a title.	Helps users understand the purpose of the page and improves navigation, especially for those using screen readers.
<html> element has a [lang] attribute	The HTML tag should specify the language of the document.	Improves accessibility for screen readers and other assistive technologies by providing context about the language.
<html> element has a valid value for its [lang] attribute	The language attribute should have a valid value.	Ensures screen readers and other assistive technologies accurately interpret the document's language.
Links are distinguishable without relying on color	Links should be identifiable without depending solely on color.	Helps colorblind users and those with visual impairments identify links.
Lists contain only <li> elements and script supporting elements (<script> and <template>).	Lists should only include list items or supporting elements.	Ensures proper structure and accessibility of lists for screen readers.
List items (<li>) are contained within <ul>, <ol> or <menu> parent elements	List items should be within appropriate list containers.	Maintains correct semantic structure and accessibility for assistive technologies.
Touch targets have sufficient size and spacing	Interactive elements should be large enough and spaced appropriately for touch interactions.	Improves usability for touch screen users, reducing errors and frustration.
Heading elements appear in a sequentially-descending order	Headings should follow a logical order (e.g., H1, H2, H3).	Ensures proper document structure, improving navigation and understanding for all users.
[aria-*] attributes match their roles	ARIA attributes should be used correctly according to their roles.	Ensures assistive technologies can properly interpret and interact with the content.
Uses ARIA roles only on compatible elements	ARIA roles should be applied only to elements they are meant for.	Prevents confusion for assistive technologies and ensures proper functionality.
Deprecated ARIA roles were not used	Avoid using outdated ARIA roles.	Ensures modern and effective accessibility practices are followed.
Elements with role="dialog" or role="alertdialog" have accessible names	Dialog elements should have names that describe their purpose.	Improves understanding and usability for screen reader users.
ARIA input fields have accessible names	Input fields using ARIA should be labeled clearly.	Helps screen reader users understand the function of input fields.
ARIA meter elements have accessible names	Meter elements using ARIA should have clear labels.	Ensures screen reader users can understand the purpose of meter elements.
ARIA progressbar elements have accessible names	Progress bar elements using ARIA should have clear labels.	Improves usability and understanding for screen reader users.
Elements use only permitted ARIA attributes	Only use ARIA attributes allowed for the specific elements.	Prevents issues with assistive technologies interpreting content correctly.
[role]s have all required [aria-*] attributes	Elements with specific roles should include all necessary ARIA attributes.	Ensures proper functionality and accessibility for assistive technologies.
Elements with an ARIA [role] that require children to contain a specific [role] have all required children.	Elements with certain ARIA roles must have specific child elements with corresponding roles.	Ensures the correct structure for assistive technologies to interpret and interact with the content.
[role]s are contained by their required parent element	Elements with specific ARIA roles must be nested within the correct parent elements.	Ensures proper semantic structure and accessibility for assistive technologies.
[role] values are valid	ARIA role values should be valid and correctly used.	Prevents errors and ensures correct interpretation by assistive technologies.
Elements with the role="text" attribute do not have focusable descendants.	Text role elements should not contain focusable child elements.	Prevents navigation issues for keyboard and screen reader users.
ARIA toggle fields have accessible names	Toggle fields using ARIA should have clear and descriptive labels.	Improves usability and understanding for screen reader users.
ARIA tooltip elements have accessible names	Tooltip elements using ARIA should have clear and descriptive labels.	Ensures screen reader users can understand the purpose of tooltip elements.
ARIA treeitem elements have accessible names	Tree item elements using ARIA should have clear and descriptive labels.	Improves usability and understanding for screen reader users.
[aria-*] attributes have valid values	ARIA attributes should contain valid values.	Ensures assistive technologies can correctly interpret and interact with the content.
[aria-*] attributes are valid and not misspelled	ARIA attributes should be correctly spelled and valid.	Prevents errors and ensures proper functionality for assistive technologies.
The page contains a heading, skip link, or landmark region	Web pages should include a heading, skip link, or landmark region for navigation.	Improves accessibility by providing easy navigation options for screen reader users.
<dl>s contain only properly-ordered <dt> and <dd> groups, <script>, <template> or <div> elements.	Definition lists should only contain proper term and description groups or supporting elements.	Ensures correct semantic structure and accessibility for screen readers.
Definition list items are wrapped in <dl> elements	List items should be correctly wrapped within definition list elements.	Maintains proper structure and accessibility for assistive technologies.
ARIA IDs are unique	ARIA IDs should be unique across the entire document.	Prevents conflicts and ensures proper functionality for assistive technologies.
No form fields have multiple labels	Each form field should have only one label.	Prevents confusion for users and ensures proper labeling for assistive technologies.
<frame> or <iframe> elements have a title	Frames and iframes should include a title attribute.	Helps users understand the content and purpose of the frames, especially for screen reader users.
<html> element has an [xml:lang] attribute with the same base language as the [lang] attribute.	The HTML tag should have consistent language attributes.	Ensures proper language interpretation and accessibility for assistive technologies.
Input buttons have discernible text	Buttons should have clear and descriptive text labels.	Improves usability and understanding for all users, especially those using screen readers.
<input type="image"> elements have [alt] text	Image input elements should have alternative text.	Ensures screen reader users can understand the purpose of the image buttons.
Links are distinguishable without relying on color	Links should be identifiable without depending solely on color.	Helps colorblind users and those with visual impairments identify links.
Lists contain only <li> elements and script supporting elements (<script> and <template>)	Lists should only include list items or supporting elements.	Ensures proper structure and accessibility of lists for screen readers.
List items (<li>) are contained within <ul>, <ol> or <menu> parent elements	List items should be within appropriate list containers.	Maintains correct semantic structure and accessibility for assistive technologies.
The document does not use <meta http-equiv="refresh">	Avoid using meta tags to refresh the page automatically.	Improves user control and prevents unexpected behavior for assistive technology users.
<object> elements have alternate text	Object elements should include alternative text descriptions.	Ensures all users, especially those using screen readers, can understand the content.
Select elements have associated label elements	Select dropdown elements should have labels describing their purpose.	Improves usability and understanding for screen reader users.
Skip links are focusable	Skip links should be easily focusable using a keyboard.	Provides easy navigation options for keyboard and screen reader users.
No element has a [tabindex] value greater than 0	Elements should not have a tabindex value higher than 0.	Ensures a logical and predictable navigation order for keyboard users.
<th> elements and elements with [role="columnheader"/"rowheader"] have data cells they describe.	Table header elements should describe relevant data cells.	Improves understanding and navigation of tables for screen reader users.
[lang] attributes have a valid value	Language attributes should contain valid values.	Ensures proper language interpretation and accessibility for assistive technologies.
<video> elements contain a <track> element with [kind="captions"]	Video elements should include track elements for captions.	Provides accessibility for users with hearing impairments by offering captions.