すべての入力欄が検証を通っても、内容が正しいとは限りません。住所の形式は正しくても以前の事務所のものだったり、問い合わせで別のサービスを選んでいたりします。送信前の確認は、入力形式だけでなく回答の意味を見直すためのものです。重要な情報が読めて、必要な箇所を実際に修正できて初めて役に立ちます。
1. 操作の影響に合わせて確認を設ける
短いメール配信登録まで、すべて別の確認画面に進ませる必要はありません。まず、誤送信がどんな影響をもたらし、本当に取り消せるのかを整理します。WCAG 2.2の達成基準3.3.4は、法的義務、金銭的取引、利用者が管理できる保存データの対象となる変更や削除、テストの回答送信に関するものです。その範囲では、取り消し可能にする、入力をチェックして修正の機会を設ける、確定前に見直し・確認・修正を可能にする、という代替策があります。あらゆるフォームに同じ確認ページを要求する基準ではありません。
詳しい制作相談では、この基準とは別に、内容を見直す段階を設ける判断もできます。ただし、単にクリック数を増やすのではなく、利用者の具体的な不安を解消する役割が必要です。
2. 判断に必要な情報を読みやすくまとめる
連絡先、依頼内容、添付ファイルなど、見慣れた見出しで回答を整理します。内部コードではなく、意味の分かる名称を表示しましょう。メッセージの重要な改行を保ち、任意項目の未入力と、意図して選んだ「なし」を区別します。支払いや義務が発生する場合は、重要な条件を完了後の控えだけでなく、確定操作の前に示します。
確認画面だけでは曖昧な質問を直せません。まず目的が明確な入力欄を用意し、確認時にも同じ用語を使います。完全な一覧に見せるためだけに、機密性の高い秘密情報を再表示しないことも大切です。
3. 修正して戻る道を短く、安全にする
各グループの横に、内容が分かる編集リンクを置きます。同じ「変更」を並べるより、「連絡先を編集」の方が行き先を理解できます。ほかの回答を消さず、該当する入力欄に戻れるようにします。編集後の要約は現在の入力から作り直し、古い住所などが残らないようにしましょう。
修正操作が誤って送信を起こしてはいけません。キーボードで操作できること、画面の切り替え後にフォーカスの位置が理解できることを確認します。変更後の値が不正なら、その欄の近くで理由を説明し、正しい回答は保持します。この部分については、利用者を助けるエラー表示の記事も参考になります。
4. 最後のボタンは実際の操作を表す
「次へ」を押しただけで、予告なく拘束力のある申し込みが送られる設計は避けます。「問い合わせを送信」など、実際の動作を表す文言を選び、編集と送信を区別します。複数のステップがある場合は現在地を示し、必要な説明を各段階でも伝えます。WAIが勧めるのは論理的な区切りと分かる進捗であって、短いフォームを進捗バーのために細分化することではありません。
ボタン操作後は「送信中」と「正常に完了した」を区別します。結果が不明なときに成功と表示したり、重複の可能性を説明せず再送を勧めたりしないようにします。
5. 正常な送信だけでなく修正経路も試す
長いメッセージ、空の任意項目、差し替えた添付ファイルを使って、一連の操作を試します。狭い画面、拡大した文字、キーボードのみでも確認しましょう。色や小さな鉛筆アイコンだけに意味を任せず、文章で操作を理解できることが重要です。
- 何が送信されるのか具体的に分かるか。
- 最初からやり直さずに重要な回答を直せるか。
- 修正後の値が要約に反映されているか。
- 送信とページ移動を区別できるか。
- 最後の表示が実際の結果を伝えているか。
役立つ確認は、飾りの「よろしいですか？」ではありません。影響が生じる前に間違いに気づき、その場で直せる仕組みです。