ユーザが入力しやすいように、あらかじめフォーカスを設定してあげるべき

[programming]

ユーザが最初に操作するだろう項目に、あらかじめフォーカスを設定しておくことによって、ユーザビリティ(操作性)の向上につながると思ってます。

  • ログイン画面だったら、ログインIDのテキストボックスに
  • △△入力画面のような画面ならば、最初に入力してもらいたい項目に

実際、多くのWEBサイト(特にメジャーなサイト)で、そのようなことが行われていますが、そういったことが行われていない(考えられていない)サイトも多々あります。


実装自体はとても簡単(onloadイベントでフォーカスを当てたい要素のfoucs()メソッドを実行するだけ)なので、開発者としては、出来る限りやったほうが良いと思ってます。

<!-- とりあえずbodyのonloadで -->
<body onload="document.getElementById('loginId').focus();">
  <table>
    <tr>
      <td>ログインID</td>
      <td><input id="loginId" type="text" name="loginId" /></td>
    </tr>
    <tr>
      <td>パスワード</td>
      <td><input id="password" type="text" name="password" /></td>
    </tr>
  </table>

ログイン画面でログインIDにフォーカスがないって、、それだけで、とても使いづらいサイトだなぁと思ってしまいます。

                              • -

追記@2008/10/01
フォーカスが奪われるのが良くないっていう人もいて、必ずしもこれが万人にとってよいことではないみたいです。
テキストエリアなどにフォーカスが当たっていないときに使えるショートカット(例えばカーソルキーの上下でスクロールとか、ワンキーショートカット)が効かなくなってしまうのは、確かにうれしくない場合も多々ありそうですね。


いまのところ、ログイン画面のように、その画面でやることが限定されているようなところだったら、適用してよいかなぁって思ってます。
あとは、ターゲットとするユーザ層によりけりなのかなぁ。