サイトアイコン IT & ライフハックブログ|学びと実践のためのアイデア集

焦らせないウェブサイト設計:「タイミング非依存」の考え方と改善方法

フォームへの入力中にセッションが切れたり、読んでいる途中で画面が更新されたりすると、利用者は作業をやり直さなければなりません。

こうした負担を減らすのが、時間制限や自動進行を利用者自身が調整できるようにする「タイミング非依存」の設計です。

Webアクセシビリティの基本を実際の画面設計に反映するには、操作できるかどうかだけでなく、操作に必要な時間を確保できるかも確認する必要があります。

「タイミング非依存」が意味するもの

本記事でいうタイミング非依存とは、利用者が一律の時間制限に追われず、自分のペースで内容を読み、入力し、操作できる状態を指します。

これは「すべての時間制限を機械的になくす」という意味ではありません。

制限が必要な場面では、終了前に知らせ、利用者が制限を調整または延長できる手段を用意します。

時間切れによって入力内容が失われたり、必要な情報を確認できなくなったりする事態を避けることが設計の目的です。

時間制限が負担になる場面

ウェブサイトでは、次のような機能が利用者のペースを意図せず奪うことがあります。

問題は、単に「急がされる」と感じることだけではありません。

時間内に操作を終えられないと、入力の消失、操作の中断、情報の見落としにつながります。

影響を受けやすい利用者

同じ時間制限でも、必要な操作時間は利用者や利用環境によって異なります。

特定の利用者だけを想定するのではなく、誰にでも操作を中断したり、普段より時間がかかったりする状況があると捉えると、必要な改善を見つけやすくなります。

実装で見直す4つのポイント

1.不要な時間制限を設けない

フォーム、アンケート、クイズなどで制限時間がなくても目的を達成できるなら、最初から設けない方法が最も分かりやすい対応です。

セッション管理などの理由で時間制限が必要な場合は、利用者が終了前に気づき、操作時間を延長できるようにします。

フォーム全体の使いやすさを点検する際は、フォームの入力支援とエラー設計の基本も確認してください。

2.自動更新を利用者が制御できるようにする

ページや表示内容が自動で更新されると、読んでいた位置が変わり、操作が中断されることがあります。

自動更新を止められる設定や、利用者が任意のタイミングで更新できる操作を用意すると、内容を落ち着いて確認できます。

3.終了前に警告し、作業時間を確保する

タイムアウトの直前ではなく、利用者が判断して操作できる段階で警告を表示します。

警告には、セッションが終了することと、継続するための操作を明確に示します。

延長を選んだ後も入力途中の内容を保持できれば、同じ作業を最初から繰り返さずに済みます。

4.動くコンテンツに停止と再開の手段を用意する

動画、アニメーション、スライドショーなどが自動で進む場合は、利用者が一時停止し、必要に応じて再開できるようにします。

動画では再生、一時停止、巻き戻し、早送りを選べるようにし、スライドショーでは自動進行を止めて手動で前後に移動できるようにします。

利用者が表示のペースを決められれば、情報を読み終える前に次の内容へ切り替わる問題を減らせます。

WCAGで関係する達成基準

ウェブアクセシビリティの国際的な指針であるWCAGでは、時間制限や自動で動く情報に関する達成基準が定められています。

適合状況を判断する際は、機能があるかどうかだけでなく、対象となるコンテンツや例外条件も含めて確認する必要があります。

公開前に確認する項目

確認対象 確認すること
フォームやセッション 不要な時間制限がなく、必要な場合は終了前の警告と延長手段があるか
入力内容 時間切れや延長操作によって、入力途中の内容が失われないか
自動更新 利用者が更新を止めるか、自分のタイミングで実行できるか
動画やアニメーション 一時停止と再開の操作が用意されているか
スライドショー 自動進行を止め、手動で前後に移動できるか

時間を利用者がコントロールできる設計へ

タイミング非依存の設計は、時間制限を減らし、必要な制限を利用者が調整できるようにする取り組みです。

まずは、フォームのタイムアウト、自動更新、自動で進むコンテンツを洗い出し、警告、延長、一時停止、再開の手段があるかを確認してください。


当社では、ウェブアクセシビリティを簡単に導入できるUUU ウェブアクセシビリティウィジェットツールをリリースしております。アクセシビリティ向上にご興味がある方は、詳細をご覧ください。

モバイルバージョンを終了