migration-a11y

Automate Phase 5 accessibility migration for Spectrum components with WCAG-aligned semantics and ARIA.

1.5k|257|Updated Nov 19, 2018
One-click install
npx skills add https://github.com/adobe/spectrum-web-components --skill migration-a11y
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: migration-a11y
Source: https://github.com/adobe/spectrum-web-components/tree/main/.ai/skills/migration-a11y
Command: npx skills add https://github.com/adobe/spectrum-web-components --skill migration-a11y

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Phase 5 migration addresses implementing WCAG-aligned semantics, ARIA, keyboard support, and focus management, and documenting accessibility behavior in 1st-gen to 2nd-gen component migration.

Core Features & Use Cases

  • Phase 5 accessibility tasks include adding semantics, ARIA mappings, keyboard navigation, and focus management; verification with assistive technology and automated tests; and documentation of accessibility behavior.
  • Applied when migrating components after styling is in place and you need to integrate accessible behavior and test coverage.
  • Use case: ensure components meet WCAG 2.2 criteria and pass screen reader validation during migration.

Quick Start

Review the Phase 5 accessibility guidelines and apply WCAG-aligned semantics, ARIA, and keyboard focus updates to the target component.

Frequently Asked Questions about migration-a11y

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I add ARIA semantics and keyboard support when migrating components?

To add ARIA semantics and keyboard support during component migration, apply WCAG-aligned semantics, ARIA mappings, and focus management updates, then verify the behavior with assistive technologies and automated tests.

What is Phase 5 accessibility migration for Spectrum components?

Phase 5 accessibility migration is the process of integrating WCAG-aligned semantics, ARIA mappings, keyboard navigation, and focus management into 1st-gen to 2nd-gen Spectrum component migrations.

When do I need to implement focus management and ARIA mappings during component migration?

You need to implement focus management and ARIA mappings during component migration after styling is in place, ensuring the migrated components meet WCAG 2.2 criteria and pass screen reader validation.

Can I use this workflow to verify keyboard navigation and screen reader compatibility?

Yes, this workflow verifies keyboard navigation and screen reader compatibility by enforcing evidence-based analysis, ARIA mappings, and documentation of accessibility behavior through automated tests and assistive technologies.

What is the best way to document accessibility behavior for migrated components?

The best way to document accessibility behavior is following the Phase 5 accessibility guidelines, which require evidence-based analysis and explicit documentation of ARIA mappings, keyboard support, and focus management.

Why does my migrated component fail screen reader validation despite having ARIA attributes?

Migrated components may fail screen reader validation if they lack proper focus management or keyboard navigation, as WCAG-aligned semantics require complete ARIA mappings, keyboard support, and verified assistive technology testing.