Accessible Web Design Course

Lesson 1 • The Business and Ethical Case

Presents moral, social, and commercial arguments for accessibility. Motivates learners to treat accessibility as a professional priority.

Lesson 2 • Global Accessibility Standards Overview

Surveys international guidelines and conformance frameworks. Connects regulatory expectations to practical design decisions.

Lesson 3 • Disability Perspectives and User Research

Examines how different users experience the web. Builds empathy and sets up user-centred methods used in later chapters.

Lesson 4 • The Four POUR Principles

Introduces Perceivable, Operable, Understandable, and Robust as the organising framework. Provides the lens used throughout the entire course.

Lesson 1 • Accessible Images and Media Elements

Covers alt text, figures, and embedded media markup. Connects visual content to text equivalents for non-visual users.

Lesson 2 • Why Semantics Drive Accessibility

Explains how browsers and assistive technologies parse HTML semantics. Establishes why correct element choice outweighs visual styling.

Lesson 3 • Accessible Lists, Tables, and Data

Teaches correct markup for lists and complex data tables. Ensures screen reader users receive accurate structural context.

Lesson 4 • Document Structure and Landmarks

Covers heading hierarchy, landmark elements, and page regions. Enables users to navigate documents efficiently with assistive technology.

Lesson 1 • ARIA Design Patterns in Practice

Applies ARIA patterns to real components like tabs, accordions, and menus. Bridges specification knowledge to production-ready implementation.

Lesson 2 • Landmark and Widget Roles

Covers ARIA landmark roles and interactive widget roles. Enables correct role assignment for custom UI components.

Lesson 3 • ARIA Fundamentals and Rules

Introduces the ARIA specification and its five rules of use. Prevents misuse by grounding learners in when ARIA is and is not appropriate.

Lesson 4 • ARIA States and Live Regions

Teaches dynamic state attributes and live region announcements. Ensures assistive technologies communicate real-time interface changes.

Lesson 1 • Visible Focus Indicators

Teaches design and implementation of clear focus styles. Addresses the WCAG requirement for perceivable focus and contrast.

Lesson 2 • Skip Links and Bypass Mechanisms

Designs bypass blocks that let keyboard users skip repetitive content. Directly addresses the WCAG bypass blocks success criterion.

Lesson 3 • Keyboard Navigation Fundamentals

Covers how users navigate with Tab, arrow keys, and shortcuts. Establishes the baseline keyboard contract all interfaces must fulfil.

Lesson 4 • Managing Focus in Dynamic Interfaces

Covers programmatic focus control for modals, alerts, and SPAs. Prevents focus loss and disorientation during dynamic content updates.

Lesson 1 • Colour Contrast Requirements

Explains contrast ratio calculations and WCAG thresholds for text and UI. Enables designers to verify and correct contrast before launch.

Lesson 2 • Colour Independence in Design

Teaches how to convey information without relying solely on colour. Prevents exclusion of users with colour vision deficiencies.

Lesson 3 • Responsive and Zoom-Friendly Layouts

Designs layouts that reflow at 400% zoom without horizontal scrolling. Ensures low-vision users can magnify content without losing functionality.

Lesson 4 • Typography and Readability

Covers font size, line height, spacing, and typeface selection for readability. Supports users with low vision and cognitive disabilities.

Lesson 1 • Accessible Input Types and Controls

Selects appropriate HTML input types for each data entry scenario. Leverages native browser behaviour to reduce custom ARIA overhead.

Lesson 2 • CAPTCHA and Authentication Accessibility

Evaluates CAPTCHA barriers and accessible authentication alternatives. Ensures security mechanisms do not exclude users with disabilities.

Lesson 3 • Inline Validation and Error Messages

Implements real-time and on-submit validation with accessible announcements. Prevents users from submitting incomplete forms without clear guidance.

Lesson 4 • Complex Form Patterns

Addresses multi-step forms, conditional fields, and dynamic inputs. Maintains accessibility as form complexity increases.

Lesson 1 • Accessible Media Players

Evaluates and configures media players for keyboard and screen reader use. Ensures playback controls are operable without a mouse.

Lesson 2 • Transcripts and Audio Descriptions

Teaches full transcripts for audio and audio descriptions for visual video content. Extends access to blind users and those who cannot play media.

Lesson 3 • Accessible Data Visualisations

Applies techniques to make charts, graphs, and infographics accessible. Provides text alternatives and keyboard navigation for visual data.

Lesson 4 • Captions for Video Content

Covers closed and open caption creation, formatting, and synchronisation. Serves deaf, hard-of-hearing, and non-native language users.

Lesson 1 • Remediation Planning and Regression Prevention

Converts audit findings into a prioritised fix roadmap. Embeds accessibility checks into workflows to prevent future regressions.

Lesson 2 • Screen Reader Testing

Guides testing with major screen readers across operating systems. Validates that semantic markup and ARIA produce correct announcements.

Lesson 3 • Manual Testing Techniques

Teaches keyboard-only navigation checks and visual inspection methods. Covers the majority of issues that automated tools miss.

Lesson 4 • Conducting an Accessibility Audit

Structures a full WCAG-based audit from scoping to reporting. Produces actionable findings that development teams can prioritise.