1 1 1 -Introduction-to-Testing-Accessibility (12.43 MB)
1 1 2 1 -What-is-Digital-Accessibility (2.66 MB)
1 1 2 2 -Accessibility-is (5.21 MB)
1 1 2 3 -Inaccessibility-is-Discrimination-in-Practice (1.99 MB)
1 1 2 4 -Accessibility-for-Businesses (5.55 MB)
1 1 2 5 -Accessibility-for-Society (3.36 MB)
1 1 3 1 -Accessibility-as-a-Moral-Case (3.05 MB)
1 1 3 2 -Accessibility-as-a-Business-Case (2.36 MB)
1 1 3 3 -The-Legal-Situation (7.46 MB)
1 1 4 1 -Introducing-Terms (1.62 MB)
1 1 4 2 -Markup- -Code-Definitions (12.01 MB)
1 1 4 3 -Browsers -Apps -and-Tools (23.14 MB)
1 1 5 1 -What-Makes-a-Website-Accessible (1.58 MB)
1 1 5 2 -Inclusive- -Intuitive-Design (11.97 MB)
1 1 5 3 -HTML-Headings (7.06 MB)
1 1 5 4 -Landmarks (3.43 MB)
1 1 5 5 -Semantic-Elements (5.93 MB)
1 1 5 6 -VideoText-Alternatives (7.05 MB)
1 1 5 7 -Forms (11.85 MB)
1 1 5 8 -Interactivity-Goes-Beyond-the-Mouse (7.59 MB)
1 1 6 -Accessibility-needs-all-of-us (2.06 MB)
2 1 1 1 -Workshop-Overview (3.76 MB)
2 1 1 2 -WCAG-Overview (5.08 MB)
2 2 1 1 -Inaccessible-Brand-Colors-Video (3.42 MB)
2 2 1 2 -Mobile-Accessibility-Issues-Video (895.94 KB)
2 2 1 3 -Icon-Buttons-without-Text-Labels-Video (1.74 MB)
2 2 1 4 -Embedded-Content-with-Accessibility-Problems-Video (2.99 MB)
2 2 1 5 -Accessibility-Overlay-Solutions (7.44 MB)
2 2 2 1 -"Shifting-Left"-in-the-Software-Development-Lifecycle-Video (4.8 MB)
2 2 2 2 -Disability-Impacts-All-of-Us-Video (2.41 MB)
2 2 2 3 -Test-User-Interfaces-with-People-with-Disabilities-Video (3.66 MB)
2 2 3 1 -Solution-Find-Accessibility-Issues-using-Keyboard-Only-Navigation (8.19 MB)
2 2 3 2 -Solution-Find-Low-Contrast-Ratio-Issues-using-Chrome-DevTools (13.84 MB)
2 2 3 3 -Lesson-Recap (2.55 MB)
2 2 4 -Identifying-Accessibility-Bias-Video (7.64 MB)
2 3 1 1 -Pattern-Libraries- -Style-Guides-Video (11.35 MB)
2 3 1 2 -Building-Blocks-of-Digital-Design-Systems-Video (5.94 MB)
2 3 2 1 -Notes-on-Interactivity-Video (7.13 MB)
2 3 2 2 -Affordances-in-Interaction-Design-Video (5.1 MB)
2 3 3 1 -Introduction-to-Design-Review (4.91 MB)
2 3 3 2 -Find-Color-Contrast-Issues-Video (6.81 MB)
2 3 3 3 -Find-Iconography-and-Label-Issues (5.43 MB)
2 3 3 4 -Find-Content-Layout-Issues-Video (5.82 MB)
2 3 4 -Accessibility-Feedback-Loop (2.72 MB)
2 4 1 -Using-Animation- -Motion-Safely-Video (5.43 MB)
2 4 2 -Prefers-Reduced-Motion-Video (5.78 MB)
2 4 3 -WCAG-Criteria-Video (5.05 MB)
2 4 4 1 -Identify-Accessibility-Issues-Related-to-Motion-Video (10.89 MB)
2 4 4 2 -Add-Prefers-Reduced-Motion-to-a-Video (12.11 MB)
2 4 4 3 -Add-Prefers-Reduced-Motion-to-an-SVG-Video (13.2 MB)
2 5 1 -Review-of-Testing-ToolsProcesses (5.17 MB)
2 5 2 -Using-WCAG-in-an-Organization (5.45 MB)
2 5 3 1 -Finding-an-Answer-to-a-Problem-Demo-Video (8.67 MB)
2 5 3 2 -Solution-Finding-an-Answer-to-a-Problem (12.66 MB)
2 6 1 1 -Creating-a-Culture-of-Accessibility-Video (6.83 MB)
2 6 1 2 -Design-Ableism-Out-of-Systems (9.54 MB)
2 6 1 3 -Qualities-For-Creating-a-Culture-of-Accessibility (9.92 MB)
2 6 2 1 -Scoping-Accessibility-Issues-Video (6.7 MB)
2 6 2 2 -Prioritizing-Accessibility-Issues-Video (12.13 MB)
2 6 3 1 -Qualify-and-Quantify-an-Accessibility-Issue-Video (11.43 MB)
2 6 3 2 -Encourage-a-More-Descriptive-Issue-Policy-Video (7.51 MB)
2 6 4 -Parting-Thoughts-Video (2.04 MB)
3 1 1 -Intro- -Setup (20.55 MB)
3 2 1 1 -Find-Issues-by-Hitting-Tab (4.46 MB)
3 2 1 2 -Investigating-Issues-by-Hitting-Tab (12.82 MB)
3 2 2 1 -Fix-CSS-Outline (10.48 MB)
3 2 2 2 -Change-MegaNav-divs-to-buttons (10.27 MB)
3 2 2 3 -Update-MegaNav-Button-Styling (5.21 MB)
3 2 2 4 -Hide-Submenus-with-CSS (5.51 MB)
3 2 2 5 -More-Menu-CSS-Updates (14.33 MB)
3 2 3 1 -Toggle-the-Active-Class-with-jаvascript (12.19 MB)
3 2 3 2 -Escape-Key-Handling (16.17 MB)
3 2 3 3 -Focus-Management-on-Menu-Close (5.41 MB)
3 2 4 -Fixing-Button-Focus (8.88 MB)
3 3 1 1 -Checking-Color-Contrast-in-Chrome-DevTools (14.31 MB)
3 3 1 2 -Fix-MegaNav-Contrast-Issues (6.93 MB)
3 3 2 -Add-Image-Alt-Description- -Check-in-the-Accessibility-Tree (4.3 MB)
3 3 3 1 -Running-Lighthouse (5.96 MB)
3 3 3 2 -Scanning-the-Homepage-with-Axe-DevTools (15.42 MB)
3 3 4 -Checking-Heading-Structure-with-the-Web-Developer-Toolbar (2.89 MB)
3 3 5 1 -Fixing-the-Discernible-Button-Text-Issue (4.1 MB)
3 3 5 2 -More-axe-Issue-Identification (6.81 MB)
3 3 5 3 -Issue-Fixing (13.45 MB)
3 3 6 1 -More-Changes (6.89 MB)
3 3 6 2 -Heading-and-Landmark-Fixes (8.67 MB)
3 3 6 3 -Checking-Work (5.95 MB)
3 3 6 4 -Checking-in-Lighthouse-Again (2.27 MB)
3 3 6 5 -Heading-Order (12.03 MB)
3 3 6 6 -Last-Lighthouse-Check (2.33 MB)
3 4 1 1 -Examining-Browser-Zoom-Behavior (12.38 MB)
3 4 1 2 -Looking-at-WCAG-1 4 10-Reflow (3.58 MB)
3 4 2 1 -Making-Changes-in-the-Browser (10.86 MB)
3 4 2 2 -Fixing-the-Viewport-Meta-Tag (5 MB)
3 4 3 1 -Update-Menu-Reflow- -Troubleshooting (4.27 MB)
3 4 3 2 -Update-Layout-Styles (13.91 MB)
3 4 3 3 -Fix-the-3-Cards-Section (12.62 MB)
3 4 3 4 -Fix-the-Header (9.74 MB)
3 4 3 5 -Check-it-out-on-mobile (4.48 MB)
3 4 3 6 -Checking-work (8.24 MB)
3 4 3 7 -Zoom-Wrap-Up (2.69 MB)
3 5 1 -An-Overview-of-Screen-Reader-Software (13.83 MB)
3 5 2 1 -VoiceOver-Demo (8.96 MB)
3 5 2 2 -VoiceOver-Navigation (9.62 MB)
3 5 2 3 -Testing-VoiceOver-after-Improving-MegaNav (8.27 MB)
3 5 2 4 -Testing-VoiceOver-after-Improving-Form-Structure (3.46 MB)
3 5 3 1 -Update-the-MegaNav-Structure-for-Better-VoiceOver-Experience (31.61 MB)
3 5 3 2 -Update-CSS-for-MegaNav-and-Menu-Items (12.36 MB)
3 5 3 3 -Update-Heading-Structure-in-the-MegaNav (7.23 MB)
3 5 3 4 -Check-Work-in-Safari (8.27 MB)
3 5 3 5 -Update-Form-Semantics (6.96 MB)
3 5 3 6 -Check-Forms-with-VoiceOver (3.46 MB)
4 1 1 -Workshop-Overview (2.19 MB)
4 1 2 -Project-Overview (2.48 MB)
4 1 3 -Application-Interface-Overview (3.16 MB)
4 1 4 -React-as-an-Abstraction (2.85 MB)
4 1 5 -Listings-Page-Overview (5.25 MB)
4 1 6 -Component-Listing-Excerpt-Overview (1.96 MB)
4 1 7 -Listing-Detail-Page-Overview (4 MB)
4 1 8 -Date-Picker-Component-Overview (2.68 MB)
4 2 1 -Analyze-Heading-Structure (7.67 MB)
4 2 2 1 -Add-Heading-Structure-to-Page-Listing-Detail (6.24 MB)
4 2 2 2 -Adding-Headers-to-Build-Page-Structure (2.55 MB)
4 2 2 3 -Analyze-New-Page-Listing-Detail-Heading-Structure (2.5 MB)
4 2 3 1 -Introducing-the-HeaderPortal-Component (3.94 MB)
4 2 3 2 -Solution-Add-an-H1-with-React-Portal (6.57 MB)
4 2 4 1 -Intro-to-Semantic-Landmarks-and-Axe-DevTools (6.83 MB)
4 2 4 2 -Implement-Top-Level-Landmarks (13.26 MB)
4 2 5 -Solution-Implement-Semantic-Landmarks-in-Page-Listing-Detail (12.09 MB)
4 2 6 -Check-Current-Page-Accessibility-with-Voice-Over (9.75 MB)
4 2 7 -Explore-More-Semantic-Landmark-Element-Options (7.88 MB)
4 2 8 -About-the-React-Portal-Header-Solution (11.66 MB)
4 3 1 -What-Is-ARIA-and-When-to-Use-It (14.01 MB)
4 3 2 -Analyze-Date-Picker-and-Add-Implicit-ARIA-Roles (8.91 MB)
4 3 3 1 -Add-ARIA-States -Roles -and-Properties-to-the-Date-Picker (19.15 MB)
4 3 3 2 -Solution-Add-Implicit-Roles-to-List-Items (5.97 MB)
4 3 4 -Test-Date-Picker-Accessibility-with-a-Screen-Reader (10.95 MB)
4 4 1 -What-is-an-Accessible-Name (12.88 MB)
4 4 2 1 -Analyze-the-Home-Page-Search-Feature-for-Accessible-Names (8.74 MB)
4 4 2 2 -Fix-an-SVG-Icon-Accessibility-for-Voice-Over-in-Safari (11.01 MB)
4 5 1 1 -Intro-to-Programmatic-Accessibility (7.32 MB)
4 5 1 2 -Convert-the-Grid-of-divs-to-an-HTML-Table (17.37 MB)
4 5 1 3 -Label-an-HTML-Table-with-aria-labelledby (4.06 MB)
4 5 2 1 -Test-out-HTML-Table-Accessibility-in-Voice-over (14.71 MB)
4 5 2 2 -Test-Our-Date-Picker-with-NVDA (9.59 MB)
4 6 1 1 -What-is-the-Accessibility-Object-Model- AOM (9.08 MB)
4 6 1 2 -Enable-AOM-in-Chrome-or-Firefox (1.92 MB)
4 6 1 3 -Explore-AOM-Properties-vs -HTML-Attributes-through-Attribute-Reflection (9.56 MB)
4 6 2 -Implement-aria-current-functionality-with-AOM-as-a-Property (18.43 MB)
4 6 3 -Implement-aria-current-in-the-MegaNav-as-an-Attribute (13.94 MB)
4 6 4 -Check-aria-current-with-a-Screen-Reader-and-AOM-as-a-Promising-Technology (14.37 MB)
5 1 1 1 -Workshop-Overview (3.47 MB)
5 1 1 2 -Project-Overview (14.11 MB)
5 2 1 1 -Overview-and-Issue-Finding (6.26 MB)
5 2 1 2 -Examining-the-Dropdown- -Listings (6.63 MB)
5 2 2 -An-Overview-of-the-ARIA-Authoring-Practices-Guide (5.02 MB)
5 2 3 1 -An-Overview-of-the-Component-Sandbox (7.06 MB)
5 2 3 2 -The-Visually-hidden-Technique (5.67 MB)
5 2 3 3 -The-Opacity-Technique (3.3 MB)
5 2 3 4 -The-Display-Technique (3.11 MB)
5 2 3 5 -The-Visibility-Technique (2.58 MB)
5 2 3 6 -The-aria-hidden-Technique (7.15 MB)
5 2 3 7 -Debugging-Visibility-Techniques (4.27 MB)
5 2 4 1 -Introducing-the-Skip-Links-Challenge (10.43 MB)
5 2 4 2 -Implementing-the-SkipLinks-Component (3.53 MB)
5 2 4 3 -Adding-the-SkipLinks-Component-to-the-Header (4.69 MB)
5 2 4 4 -Updating-SkipLink-Component-Styling (8.66 MB)
5 3 1 1 -Overview-of-Focus-Management (2.85 MB)
5 3 1 2 -Focus-Management-in-the-Component-Sandbox (9.7 MB)
5 3 2 1 -Roving-Tabindex- -Current-Date-Picker-Behavior (4.4 MB)
5 3 2 2 -Current-DatePicker-Markup- -tabindex-Plan-of-Attack (11.99 MB)
5 3 3 1 -Updating-the-Date-Picker-to-Track-tabindex (10.79 MB)
5 3 3 2 -Arrow-Key-Challenge-Introduction (10.59 MB)
5 3 3 3 -Using-Refs- -Writing-the-ArrowRight-Key-Handler (19.34 MB)
5 3 3 4 -Implementing- -Troubleshooting-Arrow-Key-Handling (24.46 MB)
5 3 3 5 -Overriding-Browser-Scrolling-from-Up-and-Down-Arrows (14.92 MB)
5 3 4 1 -Thoughts-on-Overriding-Default-Controls (4.24 MB)
5 3 4 2 -Wrapping-up-Focus-Management (4.89 MB)
5 4 1 -Accessibility-Information- -Interactivity-Issues-in-Screen-Readers (12.49 MB)
5 4 2 1 -VoiceOver-Navigation-with-Tab- -Arrow-Keys (10.65 MB)
5 4 2 2 -Navigation-with-the-VoiceOver-Rotor (5.48 MB)
5 4 3 1 -Navigating-with-NVDA (8.38 MB)
5 4 3 2 -Checking-the-Date-Picker-with-NVDA (19.74 MB)
5 5 1 1 -Intro-to-ARIA-Live-Regions (3.12 MB)
5 5 1 2 -ARIA-Live-Region-Roles (12.03 MB)
5 5 1 3 -ARIA-Live-Region-Properties (13.58 MB)
5 5 2 1 -Lesson-Introduction (4.42 MB)
5 5 2 10 -Adding-aria-required-to-Required-Form-Fields (8.67 MB)
5 5 2 11 -Checking-work-in-NVDA- -Section-Wrap-Up (8.21 MB)
5 5 2 2 -Preparing-to-add-a-Live-Region (15 MB)
5 5 2 3 -Adding-State- -Writing-the-Submit-Handler (7.9 MB)
5 5 2 4 -Checking-Progress-in-the-Browser (7.25 MB)
5 5 2 5 -Adding-onchange-Handlers-to-the-Inputs (9.42 MB)
5 5 2 6 -Form-Updates (9.44 MB)
5 5 2 7 -Checking-Form-Styling-in-the-Browser (7.07 MB)
5 5 2 8 -Solution-Sending-Focus-to-the-First-Invalid-Field (19.84 MB)
5 5 2 9 -Checking-Focus-Management- -VoiceOver (6.3 MB)
5 6 1 -Introduction-to-Advanced-Scripting (5.99 MB)
5 6 2 -Sortable-List-with-the-ARIA-Application-Role (5.9 MB)
5 6 3 -Slideshow-Overview (5.3 MB)
5 6 4 -Solution-Part-1-Updating-Elements- -Adding-Keyboard-Supportb (22.2 MB)
5 6 5 -Adding-a-Live-Region- -Focus-Management-to-the-Slideshow (18.27 MB)
5 6 6 1 -VideoSemantic-Updates (10.45 MB)
5 6 6 2 -Checking-our-work (3.72 MB)
6 1 1 1 -Project-Overview (6.29 MB)
6 1 1 2 -CampSpots-Project-Tour (17.2 MB)
6 2 1 -An-Overview-of-Storybook (16.02 MB)
6 2 2 1 -Storybook-Story-Structure (23.13 MB)
6 2 2 2 -Adding-a-DropdownList-Story-to-Storybook (11.62 MB)
6 3 1 1 -An-Overview-of-Unit-Testing (9.02 MB)
6 3 1 2 -Jest-Configuration (7.11 MB)
6 3 2 1 -Reading-the-Icon-Test (26.63 MB)
6 3 2 2 -Overview-of-the-Icon-Button (6.26 MB)
6 3 2 3 -Writing-the-Keyboard-Reachable- -Operable-Test (21.28 MB)
6 3 2 4 -Solution-Writing-a-Keyboard-Reachability-Test (8.92 MB)
6 3 3 1 -Test-1-acts-as-one-tab-stop (14.63 MB)
6 3 3 2 -VideoTest-2-Enables-a-Custom-Field-Amount (16.05 MB)
6 4 1 1 -An-Overview-of-Cypress-Component-Testing (12.85 MB)
6 4 1 2 -Running-Cypress-Component-Testing (4.87 MB)
6 4 2 1 -Reading-the-Keyboard-Operability-Test (12.52 MB)
6 4 2 2 -Fixing-MegaNav-Markup-so-Tests-Pass (20.14 MB)
6 4 3 1 -A-First-Pass-at-the-"Submenu-Should-Not-Be-Reachable"-Test (20.11 MB)
6 4 3 2 -Fixing-a-Test-that-Passes-When-it-Shouldn t (12.51 MB)
6 4 4 1 -Testing-with-the-cypress-axe-Plugin (5.41 MB)
6 4 4 2 -Checking-Color-Contrast-with-cypress-axe (10.83 MB)
6 5 1 1 -Integration-Testing-with-Cypress (4.91 MB)
6 5 1 2 -Configuring- -Running-Cypress (18.24 MB)
6 5 2 1 -Writing-a-Page-Level-Test-with-cypress-axe (19.61 MB)
6 5 2 2 -Updating-Alt-Descriptions (8.07 MB)
6 5 2 3 -Updating-Landmarks (13.29 MB)
6 5 2 4 -Fixing-the-Button-Name-Issue (9.01 MB)
6 5 3 -Implement-aria-current-Test (17.36 MB)
6 5 4 1 -Write-a-Test-for-an-Accessible-Payment-Dialog (11.91 MB)
6 5 4 2 -Analyzing-Test-Results (5.44 MB)
6 5 4 3 -Implement-and-Pass-Dialog-Test (15.95 MB)
6 5 4 4 -Focus-Management-and-Inert-Attribute (6.78 MB)
6 5 5 1 -Preparing-the-Routing-Tests (7.65 MB)
6 5 5 2 -Use-React-Helmet-to-Dynamically-Set-Page-Titles (7.79 MB)
6 5 5 3 -Client-Side-Routing-Thoughts (24.9 MB)
6 5 5 4 -Start-Page-Change-Test (14.71 MB)
6 6 1 1 -Puppeteer-Overview (4.46 MB)
6 6 1 2 -The-Accessibility-Tree-in-DevTools (4.07 MB)
6 6 1 3 -An-Alternative-View-of-the-Accessibility-Tree (7.27 MB)
6 6 2 1 -Project-Overview (2.79 MB)
6 6 2 2 -Writing-the-Accessibility-Tree-Snapshot-Test (8.53 MB)
6 6 2 3 -Examining-a-Snapshot (5.3 MB)
6 6 2 4 -Updating-a-Snapshot (3.56 MB)
6 7 1 1 -Preparing-for-CI-with-GitHub-Actions (5.01 MB)
6 7 1 2 -Viewing-CI-Issues-with-GitHub-Actions (10.05 MB)
6 7 1 3 -Push-Changes-to-Run-Tests-Again (23 MB)