サイト制作

保存完了を読み上げでも伝える、aria-liveのpoliteとassertiveの違い

慈愛妃きづな

2026-11-06

この記事には広告・アフィリエイトリンクが含まれます。

aria-liveは、画面内で更新された内容を支援技術へ伝えるための属性です。通常の完了通知はpoliteを検討し、読み上げを中断し得るassertiveは緊急性のある内容へ限定します。

画面が変わったことを、読み上げへも伝える

ボタンを押したあとに『保存しました』という文字だけが追加されても、スクリーンリーダーの利用者がその変化に気付けるとは限りません。aria-liveは、動的に変わる領域の更新を支援技術へ伝えるための属性です。

更新される領域をあらかじめ用意し、処理結果に応じて内容を変える設計を検討します。見た目に通知を出すことと、読み上げへ伝えることを合わせて確認するための仕組みです。

politeでは、通常、現在の読み上げなどを妨げず、区切りのよい機会に更新を伝えます。保存の完了や検索結果の件数など、今の操作を中断させるほどでない内容で検討する値です。

assertiveは更新を高い優先度で伝え、読み上げを中断したり、待機中の通知へ影響したりする可能性があります。目立たせたいからという理由だけで何でも指定すると、かえって操作の邪魔になります。緊急性を判断して使い分けましょう。

ページ全体をライブ領域にすると、小さな変更まで大量の通知につながることがあります。読者へ伝える必要がある短い結果の領域に絞り、更新回数も確かめます。

aria-liveは、要素へフォーカスを移す命令ではありません。更新後に操作をどこで続けるか、画面上でも結果が分かるかは別に考えます。ブラウザーとスクリーンリーダーの組み合わせで動作が異なることもあるため、対応する環境で、通知が届くことと邪魔にならないことの両方を確認してください。