必須項目が、入力チェックで「OK」になるフォーム – 郵便局

フォームで入力が必須が項目には「必須」といったアイコンを表示するのは一般的です。

郵便局のWebサイトでは、これを一歩進めて入力チェックのロジックと組み合わせています。

「ゆうびんID」を入力する際、最初は以下のように必須アイコンになっています。

図:必須アイコン

ここに、正しく情報を入力すると必須アイコンの代わりに「OK」アイコンが表示されます。

図:OKアイコンに変わった状態

利用者は、赤くなっている「必須」アイコンを、全部緑にすれば正しく入力されていることが一目で分かるということ。分かりやすいですね。

たにぐち まこと

『よくわかるPHPの教科書』や『マンガでマスター プログラミング教室』の著者。 ともすた合同会社で、プログラミング教育やこども向けの講座などを Udemyや YouTubeで展開しています。

Top