Accessibility
WCAG conformance — perceivable, operable, understandable, robust — plus ARIA correctness, keyboard navigation, and assistive-technology support.
The WCAG-anchored layer: baseline usability for people using assistive technologies or with perceptual / motor / cognitive differences.
In scope. WCAG 2.2 success criteria across the four POUR principles (perceivable, operable, understandable, robust), ARIA role / state / property correctness, keyboard navigation and focus management, screen-reader support, color contrast, captions / transcripts / alt text, semantic HTML, reduced-motion preferences, cognitive-accessibility patterns.
Not in scope. Ergonomic polish above the WCAG baseline — that's user-experience. Copy clarity unrelated to assistive tech — that's content-integrity. Section 508 as a regulatory-framework obligation (as opposed to the underlying mechanism) — that carries regulatory-conformance as a secondary taxon.
Distinct because. Accessibility is a baseline standards-measured requirement — patterns pass or fail against WCAG criteria. user-experience is the optimization surface above that baseline. A pattern about "modal lacks focus trap" is accessibility (violates WCAG 2.4.3); a pattern about "modal animation is jarring" is user-experience.
Conceptual sub-structure. Perceivable, operable, understandable, robust — mirroring WCAG POUR.
Patterns in this taxon (136)
- infoAccessibility conformance statement is publishedab-000134 · accessibility-wcag
- highAccessibility statement published with 508 status and accommodationsab-001614 · gov-web-standards
- infoAccessible name computation is verified for complex componentsab-000064 · accessibility-basics
- lowAccessible names for UI components include visible labelsab-000124 · accessibility-wcag
- highAI interface is responsive across device sizesab-000349 · ai-ux-patterns
- criticalAll form inputs are properly labeledab-000047 · accessibility-basics
- highAll form inputs have associated labels; placeholder text alone is insufficientab-001597 · gov-section-508
- infoAll icons and SVG graphics have meaningful text alternatives via aria-label, title, or nested textab-001610 · gov-section-508
- criticalAll images have alt text; decorative images use empty alt or role="presentation"ab-001590 · gov-section-508
- lowAll images have descriptive alt text, semantic filenames, and optimized weightab-002479 · seo-advanced
- criticalAll interactive elements are keyboard accessibleab-000055 · accessibility-basics
- highAll listing images have descriptive alt textab-001026 · directory-listing-schema
- criticalAll non-text content has text alternativesab-000099 · accessibility-wcag
- highAll pages have descriptive title elements that differ meaningfully between pagesab-001593 · gov-section-508
- mediumAll video content has captions (open or closed) synchronized to audioab-001602 · gov-section-508
- lowAnimated or auto-updating content has pause/play controlsab-000117 · accessibility-wcag
- infoAnnual 508 accessibility audit by third party documentedab-001627 · gov-web-standards
- lowARIA roles match element semanticsab-000052 · accessibility-basics
- infoAssistive technology testing is conductedab-000132 · accessibility-wcag
- lowAudio-only content has transcript; videos have audio descriptions for important visual informationab-001603 · gov-section-508
- infoAutomated accessibility scanning is integrated in CI/CDab-000131 · accessibility-wcag
- infoAutomated accessibility testing passes with zero critical or serious violations; known issues documentedab-001596 · gov-section-508
- highAvailability slots distinguish available, booked, blocked, and past using color plus non-color indicatorab-000520 · booking-calendar-availability
- highBadge text maintains high contrast against background colorab-001367 · extension-ux-performance
- mediumBanner is keyboard navigable, screen reader compatible, WCAG 2.1 AAab-000799 · cookie-consent-compliance
- mediumBase font size is at least 16pxab-001917 · mobile-responsiveness
- mediumBasic accessibility — VoiceOver/TalkBack labels, Dynamic Type, sufficient contrastab-000457 · app-store-policy-compliance
- lowBoolean/toggle filters render as checkbox or switch with labelsab-001062 · directory-search-discovery
- lowChanging a form control does not unexpectedly submit or navigateab-000119 · accessibility-wcag
- lowColor contrast meets WCAG AA standardsab-000065 · accessibility-basics
- criticalColor is never the sole means of conveying information; text contrast ≥ 4.5:1 for normal, ≥ 3:1 for large textab-001592 · gov-section-508
- mediumColor is not the sole means of conveying informationab-000067 · accessibility-basics
- highComponents with same functionality are identified consistentlyab-000108 · accessibility-wcag
- mediumComposite widgets use roving tabindex for efficient navigationab-000060 · accessibility-basics
- lowContent does not flash more than 3 times per secondab-000128 · accessibility-wcag
- lowContent is readable without pinch-to-zoomab-001931 · mobile-responsiveness
- mediumContent reflows at 200% zoom without horizontal scrollingab-000112 · accessibility-wcag
- lowContent supports all orientationsab-000121 · accessibility-wcag
- infoContrast ratio audit is performedab-000133 · accessibility-wcag
- highCTA buttons have sufficient visual contrastab-001742 · marketing-conversion
- lowCustom components have correct ARIA state attributesab-000129 · accessibility-wcag
- lowDark mode maintains accessible contrastab-000066 · accessibility-basics
- lowData tables include semantic markupab-000073 · accessibility-basics
- lowDefault language is specifiedab-000125 · accessibility-wcag
- mediumDynamic content updates are announced to screen readersab-000053 · accessibility-basics
- highEvery page has a unique, descriptive titleab-000105 · accessibility-wcag
- mediumExpandable components use aria-expandedab-000072 · accessibility-basics
- highFocus indicator is visible on all focusable elements; outline not removed without replacementab-001598 · gov-section-508
- highFocus indicator is visible on all interactive elementsab-000106 · accessibility-wcag
- criticalFocus indicator is visible with sufficient contrastab-000056 · accessibility-basics
- lowFocus is restored after modals or panels closeab-000061 · accessibility-basics
- mediumFocus order follows logical reading sequenceab-000059 · accessibility-basics
- mediumFocus order is logical and predictableab-000114 · accessibility-wcag
- highForm inputs have labelsab-002585 · project-snapshot
- highForm submission errors are clearly communicatedab-000070 · accessibility-basics
- mediumForm validation error messages associated with fields and describe how to fix the errorab-001601 · gov-section-508
- mediumForm validation errors are identified and explainedab-000116 · accessibility-wcag
- highForm validation errors are inline and specificab-002292 · saas-error-handling
- mediumHeading hierarchy is correctab-002526 · site-health-check
- highHeading hierarchy is logicalab-002498 · seo-fundamentals
- highHeading hierarchy present and logical; no skipped heading levels on any pageab-001594 · gov-section-508
- mediumHeading levels are sequential (no skipping from h1 to h3)ab-000096 · accessibility-wcag
- mediumHTML lang attribute is setab-002527 · site-health-check
- lowHTML lang attribute is setab-002499 · seo-fundamentals
- lowImages and figures use semantic markupab-000074 · accessibility-basics
- infoImages have alt textab-002533 · site-health-check
- criticalImages have alt textab-002584 · project-snapshot
- highImages have meaningful alt textab-002494 · seo-fundamentals
- mediumInformation is conveyed via markup, not just appearanceab-000111 · accessibility-wcag
- lowInput fields have appropriate type and autocomplete attributesab-000122 · accessibility-wcag
- criticalInteractive components have accessible name, role, and valueab-000101 · accessibility-wcag
- highInteractive elements have accessible namesab-000050 · accessibility-basics
- highInteractive elements meet minimum touch target size (44x44px)ab-001925 · mobile-responsiveness
- mediumKeyboard accessibility is fully supportedab-000110 · accessibility-wcag
- mediumKeyboard focus does not trap in any componentab-000113 · accessibility-wcag
- criticalKeyboard navigation works for all interactive elements; focus order is logical and visibleab-001591 · gov-section-508
- infoKeyboard shortcuts are available for power usersab-000335 · ai-ux-patterns
- infoKeyboard shortcuts are documented and non-conflictingab-000130 · accessibility-wcag
- highKeyboard shortcuts use standard key combinationsab-000057 · accessibility-basics
- infoLandmark regions are uniquely labeled when multiple existab-000063 · accessibility-basics
- infoLegal pages meet basic WCAG 2.1 AA (font, contrast, headings)ab-001671 · legal-pages-compliance
- mediumLink purpose is clear from link textab-000115 · accessibility-wcag
- mediumLink text is descriptive and meaningful when read in isolation; no "click here" linksab-001600 · gov-section-508
- lowLinks are descriptive; external links are identifiedab-001624 · gov-web-standards
- mediumMap has descriptive aria-label and role="application"ab-001041 · directory-map-location
- mediumMap is keyboard-accessible; markers navigable without pointer deviceab-001040 · directory-map-location
- lowMarkup is valid and well-formedab-000126 · accessibility-wcag
- mediumMobile checkout viewport optimized; no horizontal scrollab-001110 · ecommerce-cart-ux
- lowMobile viewport set; touch targets ≥ 48px or spaced appropriately per WCAG 2.5.8ab-001606 · gov-section-508
- mediumModal dialogs trap focus, restore focus when closed, and use role="dialog" with aria-labelab-001608 · gov-section-508
- mediumModals trap focus and communicate their purposeab-000054 · accessibility-basics
- lowMonth, week, and day views accessible via keyboard navigationab-000523 · booking-calendar-availability
- highNavigation elements are consistent across pagesab-000107 · accessibility-wcag
- lowNo auto-playing audio or video without controlsab-000086 · accessibility-wcag
- highNo functionality is accessible only via hoverab-001926 · mobile-responsiveness
- lowNo mobile-hostile viewport or input configurationab-001695 · marketing-advanced-seo
- criticalNo unintended horizontal scrolling at mobile widthsab-001918 · mobile-responsiveness
- mediumOnboarding flow is functional on mobile devicesab-002335 · saas-onboarding
- criticalOnboarding UI is accessible to users with disabilitiesab-002372 · saas-onboarding
- mediumPage announces dynamic content changes via aria-live regions with appropriate politeness settingab-001611 · gov-section-508
- highPage includes landmark regions for navigationab-000049 · accessibility-basics
- highPage structure includes landmarks and navigationab-000104 · accessibility-wcag
- lowPage title is unique and descriptiveab-000062 · accessibility-basics
- mediumPage uses semantic HTML elementsab-002495 · seo-fundamentals
- lowPDF and document downloads are accessible (proper tagging, logical reading order) or alternative accessible version providedab-001604 · gov-section-508
- lowPointer gestures have single-pointer alternativesab-000123 · accessibility-wcag
- highPrerecorded videos have synchronized captionsab-000102 · accessibility-wcag
- lowRange filters use accessible input widgets (not freeform text)ab-001061 · directory-search-discovery
- lowReceiving focus does not cause unexpected navigationab-000118 · accessibility-wcag
- infoReduced motion preference is respectedab-000069 · accessibility-basics
- mediumRemove/update item UX is clear and reversibleab-001095 · ecommerce-cart-ux
- criticalRequired form fields are clearly markedab-000048 · accessibility-basics
- mediumReview form includes required and optional fields clearly markedab-001203 · ecommerce-reviews
- mediumSearch input has accessible label; autocomplete uses ARIA live regionab-001072 · directory-search-discovery
- infoSemantic HTML elements are usedab-002546 · site-health-check
- infoSession does not expire unexpectedly; inactivity warning present with time to extendab-001609 · gov-section-508
- highSession timeouts can be extended or disabledab-000109 · accessibility-wcag
- mediumSkip to Main Content link is present and functionalab-000058 · accessibility-basics
- lowSort options available via accessible select or listboxab-001073 · directory-search-discovery
- mediumStar rating input is accessible and keyboard-navigableab-001202 · ecommerce-reviews
- lowStatus bar content color visible against backgroundab-001965 · mobile-ux-patterns
- lowStatus messages are announced via aria-liveab-000127 · accessibility-wcag
- highTab key navigates to all interactive elements; no keyboard traps; skip links present if more than 4 nav linksab-001599 · gov-section-508
- highTab order is logical and visible focus is clearab-000051 · accessibility-basics
- mediumTables are scrollable or reformatted on mobileab-001920 · mobile-responsiveness
- lowTables use proper semantic markup: thead, tbody, th with scope, and captionab-001605 · gov-section-508
- criticalText and UI components have sufficient color contrastab-000100 · accessibility-wcag
- lowText can be resized to 200% without loss of content or functionality; relative units usedab-001607 · gov-section-508
- mediumToggle buttons communicate their stateab-000071 · accessibility-basics
- lowTouch targets are adequate size for mobile accessibilityab-000068 · accessibility-basics
- criticalTouch targets are at least 44x44 pointsab-001956 · mobile-ux-patterns
- lowValidation errors provide suggestions for correctionab-000120 · accessibility-wcag
- highVideos have audio descriptionsab-000103 · accessibility-wcag
- highViewport meta tag is presentab-002524 · site-health-check
- highViewport meta tag is properly configuredab-002513 · seo-fundamentals
- infoVPAT draft or public accessibility statement available documenting compliance claim and known gapsab-001595 · gov-section-508