A11y Scan — Demo Pages

Demo Pages

45 pages with intentional accessibility violations for testing the A11y Scan extension.

Each page has a "How to Test" box with step-by-step instructions and expected results.

Core Scanning

Axe-Core Basics
11 intentional WCAG violations and 3 passing elements.
Visual Overlays
Test violation highlights, tab order badges, and focus gap outlines.
Tab Order
CSS reordering and tabindex for tab order visualization.
Focus Gaps
Interactive elements missing keyboard access.
Multi-Viewport
Responsive page with viewport-specific violations.
Site Crawl
5-page mini-site for depth-first crawl testing.
ARIA Patterns
WAI-ARIA widget violations and correct implementations.

Page Rules

Login Gate
Pages behind authentication. Test login page rule.
User Interactions
Accordions with hidden violations. Expand before scanning.
Deferred Content
3-second loading then data table. Test deferred content rule.

Navigation

Mega Menu
Navigation bar with dropdown submenus.
Breadcrumbs
Breadcrumb navigation trail.
Sidebar Navigation
Sidebar with nested sections.
Tab Navigation
Tab interface with panels.
Pagination
Pagination controls for a list.

Forms

Form Wizard
Multi-step form with progress indicator.
Form Validation
Inline validation errors and required fields.
Date Picker
Calendar date picker grid.
File Upload
Drag and drop file upload.
Search Autocomplete
Search with results dropdown.
Checkout Form
Multi-field checkout with autocomplete.

Modals & Overlays

Modal Dialog
Modal with trigger, focus trap, and ARIA.
Cookie Consent
Cookie consent banner.
Lightbox
Image lightbox overlay viewer.
Toast Notifications
Toast/snackbar notifications.

Data Display

Data Table
Sortable data table with headers and status.
Card Grid
Product/content card grid.
Infinite Scroll
Content loading on scroll.
Accordion FAQ
FAQ with expandable answers.

Media

Video Player
Custom video player with captions.
Image Gallery
Gallery with thumbnails and lightbox.
Audio Player
Audio player with playlist.

Interactive Widgets

Autocomplete
Combobox with suggestions dropdown.
Range Slider
Custom range/slider input.
Dropdown Select
Custom dropdown select.
Tooltip
Buttons and links with tooltips.
Toggle Switch
Custom toggle switches.

Layout

Sticky Header
Page with sticky header and skip links.
Skip Links
Skip navigation patterns.
Footer Links
Footer with link groups.
Responsive Sidebar
Sidebar that becomes a drawer on mobile.

E-commerce

Product Card
Product card with image, price, rating.
Shopping Cart
Cart with quantity controls.
Checkout Form
Multi-field checkout form.
Price Filter
Price range filter with min/max.