Skip to content

a11y(regex): RegexMatchTester の排他選択を radiogroup/radio セマンティクスにするか検討 #667

Description

@fumtas1k

背景

PR #665(issue #663)で RegexMatchTester のマッチハイライト <mark>role="button" + aria-pressed で「選択」を表現した。レビューで挙がった設計上の選択肢を follow-up として記録する。

課題

「マッチを 1 つだけ選択」という排他選択を、複数の aria-pressed トグルボタンで表現している。WAI-ARIA 的には許容範囲だが、厳密には排他選択の意味論には role="radiogroup" + role="radio"aria-checked)の方が近い。

検討事項

  • radiogroup 化すると矢印キーでの選択移動が ARIA 標準として期待される(roving tabindex と相性が良い → refactor: デザインシステム整備・コード品質改善 #2 と併せて検討する価値あり)
  • 一方で <mark> は本来「ハイライト」の意味要素であり、radio の意味を載せることの是非もある
  • 現状の aria-pressed トグルでも操作・状態伝達は成立しているため、必須ではない

現状維持でも問題ないため、#2(roving tabindex)と合わせて UX を見直す際の参考とする。

関連

優先度: 低(設計上の選択肢、現状でも a11y は成立)。

Metadata

Metadata

Assignees

No one assigned

    Labels

    P3a11yアクセシビリティ関連uiUI / デザインシステム

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions