Google擬きパスワード強度チェッカー

ホームページを作る人のネタ帳の2009年3月9日の記事 導入が手軽なGoogleみたいなパスワード強度チェッカーJavaScript に紹介及び実際に使用したコードを掲載されるのが、 Code and Coffeの2007年6月26日の How to Make a Password Strength Meter Like Google に公開されたjavascriptにて実装さるパスワードの強度チェッカーにて、 ホームページを作る人のネタ帳記事を参考に当ブログにも実装して見たのが下になります。
スポンサーリンク

Password Strength:

フォームデザインでは上記紹介記事同管理人Yamada氏に依る IT Qualityの2008年8月18日の記事 ユーザーが入力するフォームを素敵にするCSS に紹介された Enhance your input fields with simple CSS tricks を折角ですので此処で利用して見ました。 jQueryに依り、通常はグラデーションで表示されるテキスト入力エリアが フォーカス時にはエリア自体もボーダーも少し青が濃くなった一色へと変化し、 なかなか小粋な装飾かに存知ます。

TVゲームの名前の定番の「あああ」宜しく「aaa」抔と取敢えずは入力すれば 入力範囲の右部分のバーが赤く伸び出し、 打ち続けるに従い黄色から緑へと漸次、安全な表示へと変化するにあたり、 ぞんざいな名前を引き下げ様々打てども、 矢張り、一見文字数への依存が大きい印象を受けますが、 大文字や数字も混入すれば黄色及び緑への変化点が下がるのが見て取れ、 凡そ感覚通りの結果が得られる様に思います。 然れど試行を重ねるにバーを緑表示にするには6文字が最低必要で、 扠、5文字にて緑表示にする文字列並びは有る哉否哉。

色だけで強制力を伴う必須入力の判定に使用するのはアクセシビリティ的に問題もありますが、 例えば直ぐ思いつくと云えば、自サイトで閲覧者にパスワードを新規作成して貰う場合、 条件判定に最低文字数を含み置けば、緑なる安全表示になる様にパスワード入力を強いる手法があるかに思います。