割込みとは、利用者が選んでいないタイミングで表示や音声、画面の内容が変わり、進めていた操作や閲覧が中断されることです。
突然のポップアップ、自動再生される動画や音声、画面を遮る通知、閲覧中の自動更新などが該当します。
割込みを減らす目的は、すべての通知をなくすことではありません。表示する必要性とタイミングを見直し、利用者が再生、更新、終了を選べる状態にすることです。
割込みに当たる画面の変化
同じ表示でも、利用者の操作に応じて開く場合と、作業中に突然現れる場合とでは負担が異なります。
設計時には、要素の見た目だけでなく、現在の作業がどのように中断されるかを確認します。
| 割込みの例 | 起こり得る中断 | 設計時の確認点 |
|---|---|---|
| ポップアップや通知バナー | 読んでいる内容が隠れ、閉じる操作が増える | 表示するタイミングと閉じる方法を利用者が把握できるか |
| 動画や音声の自動再生 | 意図しない音や動きに注意を奪われる | 利用者が再生を始め、音声を調整できるか |
| 画面の再読み込みや自動更新 | 読んでいた位置や入力中の内容を見失う場合がある | 自動更新を停止する方法や、更新前に選べる機会があるか |
| モーダルウィンドウ | 操作対象が別の領域へ移り、元の位置に戻りにくくなる | 開いた後と閉じた後のフォーカス位置が適切か |
割込みが操作を難しくする理由
作業の続きを見失いやすい
フォーム入力や長い文章の閲覧中に画面が変わると、利用者は中断前の状態を確認し直さなければなりません。
入力内容が失われたり、読んでいた場所を探し直したりする場合もあるため、作業の効率だけでなく完了しやすさにも影響します。
注意と記憶への負担が増える
認知負荷とは、情報を理解し、現在の目的や操作手順を覚えておくために必要な負担です。
通知や動きが繰り返し現れると注意が分散し、何をしようとしていたのかを思い出す作業が増えます。
この影響は認知に障害のある利用者に限りません。複雑な入力をしている人や、急いで操作している人にとっても、不要な中断は負担になります。
読み上げ位置やフォーカスが変わる
スクリーンリーダーで内容を確認しているときに別の要素へフォーカスが移ると、読み上げていた位置や次に操作すべき場所が分かりにくくなる場合があります。
同様に、キーボード操作とフォーカス表示に頼る利用者は、突然開いた要素を閉じた後に元の操作へ戻れないことがあります。
閉じる操作そのものが負担になる
手や指を動かしにくい利用者にとって、小さな閉じるボタンを探して操作することは大きな負担になり得ます。
ポップアップが繰り返し表示される設計では、本来の目的に進む前に同じ操作を何度も求めることになります。
割込みを減らす五つの設計方法
1. 表示する必要性とタイミングを見直す
ポップアップや通知を追加する前に、その情報を今すぐ画面上に出す必要があるかを確認します。
フォーム送信後など、利用者の操作が一区切りついた時点で示せる情報は、入力や閲覧の途中に重ねないようにします。
すぐに知らせる必要のない内容は、後から確認できる通知領域にまとめる方法があります。
2. 動画や音声の再生開始を利用者に委ねる
動画や音声は自動で始めず、利用者が再生ボタンを押して開始できる形を基本とします。
自動再生が必要な場合は音声をミュートした状態で始め、音声を再生するための明確な操作を用意します。
設計上の確認項目は、音声の自動再生を防ぐ方法でも確認できます。
3. 自動更新を停止または確認できるようにする
ニュースフィードなどを自動更新すると、利用者が読んでいた情報を見失う場合があります。
「自動更新を停止する」操作を設けるか、更新前に実行するかどうかを選べるようにします。
更新頻度を調整できる設計も、利用者が閲覧のペースを保つ助けになります。
4. モーダルの前後でフォーカスを管理する
フォーカスとは、キーボードなどで次に操作できる対象が選ばれている状態です。
モーダルを開いたら、その中の最初に操作すべきボタンや入力欄へフォーカスを移します。
閉じた後は、モーダルを開いたボタンへフォーカスを戻すことで、利用者は中断前の操作を続けやすくなります。
閉じるボタンは見つけやすくし、アクセシブルなモーダルダイアログの設計と合わせて動作を確認します。
5. 通知を緊急度で分ける
セキュリティ警告や入力エラーなど、その場で対応が必要な情報と、後から読める一般的な通知を同じ方法で表示しないようにします。
一般的な通知は後から確認できる場所に格納し、音声付きの通知にはオフにする設定を用意します。
実装後に確認したいチェックリスト
実装後は、割込みを単体で見るのではなく、操作の前後がつながっているかを確認します。
- ページを開いただけで、意図しない動画や音声が始まらない
- 入力中や閲覧中に、不要なポップアップが重ならない
- ポップアップやモーダルをすぐに閉じられる
- モーダルを開いた後、操作対象が分かる
- モーダルを閉じた後、開く前の位置から操作を続けられる
- 自動更新を停止するか、更新前に実行を選べる
- 緊急度の低い通知を後から確認できる
利用者が中断を制御できる設計へ
割込み対策では、表示や更新を単に減らすだけでなく、利用者が開始、停止、終了のタイミングを選べることを判断基準にします。
自動再生、自動更新、モーダル、通知を一つずつ確認し、元の作業へ戻れる流れまで整えることで、障害の有無や操作方法にかかわらず利用しやすい画面に近づきます。
当社では、ウェブアクセシビリティを簡単に導入できるUUU ウェブアクセシビリティウィジェットツールをリリースしております。アクセシビリティ向上にご興味がある方は、詳細をご覧ください。