パスワード入力でつまずかせない — ルール事前表示と使い回し警告の添え言葉
パスワードの「やり直し」はユーザーにとって大きなストレス。入力前にルールを見せる、使い回しのリスクを伝える、システム移行を事前に告知する。3つのアプローチで認証まわりのつまずきを防ぐ添え言葉を紹介します。
パスワードの「やり直し」が離脱を招く
会員登録やログインで、パスワードに関するエラーほどユーザーを苛立たせるものはありません。「8文字以上で入力してください」と言われて入力したのに、「英数字を混在させてください」と追加のエラーが出る。条件を後出しにされるたびに試行錯誤が増え、最悪の場合フォームを離脱してしまいます。
パスワードのエラーが厄介なのは、入力内容がマスクされている点です。何を入力したか見えないまま「条件を満たしていません」と言われても、どこを直せばいいのかわかりません。だからこそ、エラーが出てから指摘するのではなく、入力前にルールを見せておくことが重要です。
今回は、パスワードや認証情報に特化した「先回りの添え言葉」を3つのサイトで見つけました。ルール事前表示、使い回し警告、システム移行の告知と、それぞれ異なるアプローチです。
事例
ホームセンターバロー — パスワード要件を入力前にすべて開示
ホームセンターバローの購入手続きフォームでは、パスワード入力欄の直下に「パスワードは11文字以上30文字以下で、1文字以上の数字、英小文字を含めて入力してください。」と表示しています。
注目したいのは、条件が1文ですべて網羅されている点です。文字数の下限と上限、数字を含むこと、英小文字を含むこと。ユーザーが送信ボタンを押す前に、満たすべき条件がすべて目に入ります。多くのサイトがパスワード要件をエラーメッセージで小出しにする中、このサイトは「全部先に見せる」というシンプルな方針で入力のやり直しを防いでいます。
3つの条件を箇条書きに分解し、入力中にリアルタイムで各条件にチェックマークが付く仕組みにすると、ユーザーは入力しながら「あとどの条件を満たせばよいか」を即座に確認できる。 「Microcopy: The Complete Guide」Chapter 17: Preventing Errors and Other Setbacks
ロコンド — 使い回しのリスクを具体的な結果で伝える
ロコンドの会員登録フォームでは、パスワード要件に加えて「セキュリティの仕様上、他サイトで登録されているアドレスとパスワードのセットの場合、次回以降、ログインできなくなる可能性があります。独自パスワードを登録ください。」という注意書きを配置しています。
形式的な要件の先にある「なぜ独自パスワードが必要なのか」という疑問に先回りしているのがこのサイトの特徴です。「ログインできなくなる可能性」という具体的な結果を示すことで、「面倒だから他のサイトと同じでいいや」という気持ちに歯止めをかけています。パスワード使い回しによるログイン不可は、後から原因に気づきにくい種類のトラブルです。それを入力の段階で防ぎ、「 独自パスワード 」と太字で行動指示を明確にしている点も実用的です。
パスワード入力欄の下にリアルタイムのバリデーション（条件を満たすとチェックマークが付く表示）を設けると、ユーザーは自分のパスワードが要件を満たしているかを入力しながら確認できる。 「Microcopy: The Complete Guide」Chapter 17: Preventing Errors and Other Setbacks
ドスパラ — システム移行後のログイン失敗を事前に告知
ドスパラのログイン画面では、ログインボタンの直下に「2023年1月24日以降に初めてログインする場合は、下記からパスワード再設定手続きの上、ログインをお願いいたします。」という注意ボックスと、パスワード再設定フォームへのリンクが表示されています。
この事例が優れているのは、ユーザーがログインに失敗する前に問題を解消している点です。システム移行後に旧パスワードが使えなくなった場合、ユーザーは「パスワードを間違えたかな」と何度も試し、それでもダメで困り果てる。ドスパラはそのフラストレーションをまるごと回避するため、対象者が自分で判断できるよう日付を具体的に示し、すぐに行動できるリンクも添えています。「ログインできない」ではなく「パスワード再設定をしてからログインしてください」と、次にやるべきことを明示している点もポイントです。
「パスワード再設定フォームはこちら」というリンクテキストを、「パスワードを再設定してログインする」のようにユーザーが得る結果を含む表現に変えると、リンク先で何が起きるかがより明確になる。 「Webコピーライティングの新常識 ザ・マイクロコピー [第2版]」第3章 コンバージョンボタンのマイクロコピー — 3-4
もっと事例を見る
パスワード要件の事前表示やログイン時の注意書きは、さまざまなECサイトで工夫が見られます。条件の箇条書き表示、文字数上限の明示、メールアドレスの大文字小文字の注意など、さらに3サイトの事例を パスワード・認証まわりの添え言葉をもっと見る にまとめました。
紹介サイト
- ホームセンターバロー — 工具・塗料・ガーデニング用品など幅広いホームセンター商品を扱うオンラインショップ
- ロコンド — 靴・ファッション専門通販。5,000ブランド以上を取り扱い、サイズ交換無料
- ドスパラ — BTOパソコン・PCパーツ・周辺機器を扱うPC専門の通販・実店舗チェーン
マイクロコピーの観点
「Microcopy: The Complete Guide」p.227 では、エラーメッセージの書き方を改善するよりも「そもそもエラーを防ぐ方がさらに良い」と述べています。フォームの弱点を見つけて数語添えるだけで多くのエラーが防げるとし、パスワードルールの事前表示はその代表的な「縫い目」のひとつとして挙げられています。
また同書 p.235 では、潜在的な問題がたとえ自分の管轄外であっても、ユーザーに事前に指摘しておくことで「すべてをユーザーのために考えてくれている」という印象を与えられると紹介されています。ドスパラのシステム移行告知はまさにこの実践例で、システム側の都合による問題をユーザーに押しつけず、先回りして解決策を示しています。
※ マイクロコピーは株式会社オレコンの登録商標です。
