Complete Course

The 6 Most Common Accessibility Issues

Find and fix the six most common web accessibility issues with automated tests using Cypress, powered by axe-core.

~2 hours of content

Course Content

8 comprehensive lessons covering everything you need to know

Introduction

Introduction
Course Structure
Learn how the course is organized and make the most of the content.
Introduction
Prerequisites
Systems and knowledge required to complete the course.
Introduction
Getting to know the application under test
Meet the Banco Simulado app that intentionally ships the six most common accessibility issues.
Lesson
Lesson 1
Fork, clone, and install the tools
Fork and clone the project, then set up Cypress with axe-core.

Getting started

Lesson
Lesson 2
Your first accessibility scan with Cypress
Learn accessibility foundations and run your first scan with cypress-axe.

The 6 most common issues

Lesson
Lesson 3
Issue 1: Low-contrast text
Detect and fix insufficient color contrast (color-contrast).
Lesson
Lesson 4
Issue 2: Images without alt text
Detect and fix images missing alternative text (image-alt).
Lesson
Lesson 5
Issue 3: Form fields without labels
Detect and fix inputs without associated labels (label).
Lesson
Lesson 6
Issue 4: Empty links
Detect and fix icon-only links with no accessible name (link-name).
Lesson
Lesson 7
Issue 5: Empty buttons
Detect and fix icon-only buttons with no accessible name (button-name).
Lesson
Lesson 8
Issue 6: Missing document language
Detect and fix a missing lang attribute on the document (html-has-lang).

Bonus & Conclusion

Bonus
A full-page scan with accessible mode on
Write one more test, just like your first one, but this time it passes.
Bonus
The accessibility checklist and manual tools
A ready-to-use checklist for the six issues plus the manual tools that complement automation.
Conclusion
Congratulations!
You've completed The 6 Most Common Accessibility Issues course!