Direct answer
何を確認する項目ですか?
タブを、必須HTML・ARIA、キーボード操作、focus lifecycle、mobile、motion、実装後QAまで一続きで確認するパターンです。
tablist | tab | tabpanel | aria-selected | roving tabindex | arrow keysが必須構造です。roleやaria属性だけで完了とせず、keyboard、focus移動、終了後の復帰、mobile、Reduced Motionを一連の操作で確認します。
Reference facts
固定値・必要な証拠・判定境界
- Pattern ID(固定ID)
- DAS-PATTERN-TABS
- Required(必須構造)
- tablist | tab | tabpanel | aria-selected | roving tabindex | arrow keys
- Runtime support(実装範囲)
- partial
- Keyboard(操作確認)
- Tab、Shift+Tab、Enter、Space、矢印、Home、End、Escapeのうち該当操作を確認
- Focus lifecycle(フォーカス)
- 開始位置、移動、閉じ込めの必要性、終了後の戻り先を実機で確認
- Motion and mobile(動き・端末)
- Reduced Motion、200%文字拡大、320 CSS px相当、touchとkeyboardを確認
Implementation QA
構造・keyboard・focusを一つの操作として確認
- 必須HTML、role、state、propertyの所有関係を確認します。
- TabとShift+Tabで入退場し、pattern固有の矢印・Home・End・Escapeを確認します。
- 開始時のfocus、内部移動、閉じ込めが必要な範囲、閉じた後の復帰先を確認します。
- 200%文字拡大、320 CSS px相当、touch、Reduced Motionで情報と操作を維持します。
- WordPress、React、Vueなど実際のruntimeで再確認し、未確認環境を明記します。
Human review boundary
このページだけでは決められないこと
- 自動検査結果だけでWCAG適合、認証、法的要件の充足を宣言しません。
- 意味、文章品質、操作の分かりやすさ、支援技術固有の挙動は人が確認します。
- 代表ページと状態、複数browser・端末、keyboard、screen reader、zoom・reflowを評価範囲へ含めます。
- 未実施環境と確認できなかった項目をreportに残し、0 Findingを「問題なし」と言い換えません。
Primary source