Accessibility Help
Tips, references, and tutorials for making websites accessible
57 articles
What is Web Accessibility?
WCAG - a short explanation
WCAG 2.2 UpdateLearn about the 9 new criteria released Oct. 2023
Using tabindex
Third-Party Content on Your Sites and Accessibility IssuesAm I responsible for embedded content issues?
How to Check your Website for Accessibility
Using Headings in webpage content
Color Contrast: The BasicsMaintaining a high color contrast ratio is an important step to making a website accessible
Color Contrast Issues: Correcting
Titles for iframes and framesFrames must have an accessible title.
Readable (Discernible) Link Text: The BasicsLinks must have text readable by screen readers.
Readable (Discernible) Link Text: CorrectingSuggestions for correcting No readable (discernible) link text flags.
Readable (Discernible) Button Text: The Basics
Readable (Discernible) Button Text Issues: Correcting
Accessible Tables
Focus - Best Practices
Using Hidden Content in an Accessible WayKnow how and when to use hidden content to make sure accessibility remains a priority
Scrollable Regions must have Keyboard Access
Semantically Correct Lists: The BasicsInformation on semantics, types of lists, and why it matters.
Semantically Correct Lists: CorrectingHelp with correcting <ul>,<ol>,<li>, and <dl> issues.
Interactive Controls must not be Nested
Nested Interactive Controls Issues: Correcting
Alternative Text for Images: The Basics
Alternative Text for Images: CorrectingTips for creating alt text for various image types.
Captions versus SubtitlesProviding a text alternative for media on websites
Image Buttons must have Alternate Text: CorrectingEnsure <input type="images"> elements have accessible alternative text.
ARIA Attributes: The Basics
ARIA Landmarks: The Basics
ARIA Hidden and Focusable Elements: The BasicsFoundational information on focus and aria-hidden.
Elements and Supported ARIA Attribute Issues: Correcting
YouTube Embeds Causing Flag for "Elements must only use permitted ARIA attributes."An explanation of the flag on embedded YouTube videos; "Elements must only use permitted ARIA attributes".
ARIA Roles and Parent-Child Relationships: The BasicsCertain ARIA roles have special requirements.
ARIA Roles and Parent-Child Issues: Correcting
Using role="presentation" to Resolve ARIA Parent-Child IssuesHiding HTML Semantics with role=presentation
Parent-Child Required Roles Quick Reference
ARIA Attributes must use Valid ValuesARIA attributes can only be assigned allowed values.
ARIA Attributes must Conform to Valid Names: CorrectingARIA attributes that start with aria- must be defined in the ARIA specs.
ARIA Roles with Invalid Values: CorrectingARIA roles used must conform to valid values, you can't create your own.
Required ARIA Attribute Issues: Correcting
Roles with Required ARIA Attributes Quick Reference
Valid ARIA Attribute Names Quick ReferenceListing of ARIA attributes starting with 'aria-' with links for more information.
Valid ARIA Roles Quick ReferenceListing of ARIA roles with links to more in-depth information
ARIA Hidden and Focusable Elements Issues: CorrectingTips on fixing issues with the aria-hidden attribute.
Using tabindex to Solve Focusable Content FlagsExamples of aria-hidden flags and how to fix them using the tabindex attribute.
Each HTML page must have a valid HTML lang attributeOpening <html> element needs to relay the primary language of content.
Skip to Main Content LinkThe importance of this link for accessible technology users.
Tracking Pixel Code - Accessibility IssueTracking pixels like Facebook's and Google's should be implemented with care.
404 Pages: Using Correct Link TypesUsing correct link types on your 404 page will ensure your site is accessible and SEO-friendly!
Allow Zooming and Scaling on WebpagesZooming and scaling must not be disabled in the viewport meta tag.
Ensure focus is visibleMake sure focus is visible for your keyboard users.
ID Attribute Value Should be UniqueBest practice is that no more than one element with the same id in an HTML document.
Form Element Labels: The BasicsWhat form labels are and why they are essential.
Form Element Labels: CorrectingOptions for adding form labels
Grouping Checkboxes in FormsGrouping checkboxes allows visitors who utilize screen readers to know the options are all part of one form field
Ensure Proper Tab Order within Forms
<select> HTML Element and Labels: The Basics