Understanding Accessibility: WCAG’s 13 Guidelines with Kasey Bonifacio

Wicked Acts 13 Guidelines for Web Accessibility

Web accessibility is a hot topic in the industry.
Web Content Accessibility Guidelines (Wicked) are commonly used standards.
Wicked is structured into four main principles: perceivable, operable, understandable, and robust.
There are thirteen guidelines in total.
Wicked has three levels of conformance: Level A, Level AA, and Level AAA.
Level AA is the commonly targeted level of accessibility.
Each guideline has its own set of success criteria.
Success criteria are specific use cases to test a website's accessibility.
Guideline 1.2 is an example and has success criteria assigned to different levels.
The first principle is "perceivable."
Guideline 1.1 under "perceivable" requires text alternatives for non-text content.
Alternative text is necessary for images and CAPTCHAs.
Alternative options like audio are needed for CAPTCHAs to accommodate assistive technology users.

Closed captions can make video content more accessible for people with hearing impairments by providing context beyond dialogue.
Audio descriptions can enhance the accessibility of video for individuals with vision impairments by providing visual context and storytelling.
Transcripts of audio content, such as podcasts, can ensure accessibility for individuals who prefer reading or are unable to hear.
Content should be adaptable to different screen sizes and orientations to accommodate various devices and user preferences.
Proper heading structure helps in removing clutter and enabling tools like Safari reader mode for screen reader users.
Sufficient contrast between text and background colors is crucial for readability, with a minimum contrast ratio of 4.5 for optimal accessibility.

Minimum ratio of 4.5 for normal text on the page for distinguishability.
Background audio and music should be 20 decibels quieter than speaking voices.
All parts of the website should be accessible using only a keyboard.
Interactive components like accordions should be keyboard accessible.
Using buttons instead of divs ensures that interactive components are keyboard accessible.
Use links for linking to content elsewhere on the internet and buttons for performing actions.
Provide users with control over video and animation, allowing them to pause and start on their own.
Allow reasonable time for users to complete tasks without feeling rushed.
Consider that different users have different abilities and may need more time to complete tasks.
If there is a time limit on an action, provide notice and a chance to cancel the action.
Avoid animations and videos that flash more than three times per second to prevent seizures.
Ensure users can navigate the website and understand their location within it.

Tabbing through links, inputs, and buttons on the page with a focus stage for orientation.
Unique page titles for easy navigation and identification.
Breadcrumb navigation to indicate the page's position within the website hierarchy.
Table of contents for easy access to specific sections.
Accessibility for different input devices such as mouse, touchscreen, and assistive technology.
Using simple language and avoiding jargon for better readability.
Defining technical terms or industry-specific terms within the text.
Adding title attributes to abbreviation tags to provide definitions.
Specifying the language of the webpage with the "Lang" attribute.
Using the "Lang" attribute for phrases or words in other languages.
Ensuring web pages have a predictable structure and appearance.

The order of links, search button, author information, and article information should remain consistent on a webpage.
Clear labeling and helper text can help users avoid making mistakes when inputting information.
Errors should be clearly marked and accompanied by explanation and instructions on how to fix them.
Writing valid semantic HTML and using Aria attributes can future-proof websites for different assistive technologies.
Incorporating accessibility testing into the build process can help catch errors before production.
The 13 Days of Accessibility project provides a resource for understanding and implementing the guidelines.