今回は検索画面で検索条件を指定し、検索結果画面で結果を表示するという場合に気をつけるべき点を挙げます。

1.検索結果画面にも検索条件を表示する

まず、検索画面で「ウェブユーザビリティ.JP」と入力し、検索ボタンを押します。すると、該当する検索結果が一覧で表示されます。このようなときに、検索結果画面に検索結果だけを出してしまうと、どのような条件で検索したのか分からなくなってしまいます。

検索結果ページには、その検索結果の前提となる検索条件を表示してあげるようにしましょう。

more…

一般的にラジオボタンやチェックボックスは、それを選択することが何を意味するのかを表す文字列（ラベル）と共に用いられます。

そして、ラジオボタンやチェックボックスはサイズが小さくクリックしづらいため、WindowsなどOSレベルでは、ラベルをクリックした時もラジオボタンやチェックボックスをクリックしたのと同様の動作が起こるようになっています。

この仕組みはユーザビリティという意味でもアクセシビリティという意味でも有効なので、積極的に利用すると良いです。

more…

dfFlexiGridは、サイトのレイアウトや文章のフォントサイズなどを動的に変更する仕組みを提供するスクリプトです。

まずはデモを見てみてください。これは見てもらったほうが早いです。

にょきにょきとエフェクト付きで変化するのは見ていて楽しい・・・。なんとなく、ロボットの変形を思わせますね。

ツールとしてWebサービスを提供するような場合には、メニューを非表示にして、領域を確保したい場合などがあると思いますので、そんなときにいかがでしょうか？

more…

ラジオボタン（<input type="radio">）は複数の選択肢の中から1つを選択するための入力コントロールです。したがって、必ず1つ選択されている状態が正しく、RFCでもそのように定義されています。

At all times, exactly one of the radio buttons in a set is checked. If none of the <INPUT> elements of a set of radio buttons specifies `CHECKED’, then the user agent must check the first radio button of the set initially.

集合中のラジオ・ボタンは、いつも丁度1つがチェックされます。ラジオ・ボタンの集合の input 要素のどれも checked が指定されていなければ、利用者エージェントは初期状態として集合の最初のラジオ・ボタンをチェックしなければなりません。

RFC1866 / 8.1.2.4. Radio Button: INPUT TYPE=RADIO

しかし、現在のブラウザの実装では、html上でcheckedを記述していない場合に、どれも選択されていないという状態が起こり得てしまいます。

したがって、実装時に意識して一番最初の選択肢（一番左または一番上）にcheckedをつけておくようにしましょう。

また、選択しないという選択を許すために、ラジオボタンが何も選択されていない状態を利用しようとした場合には、一度選択したら選択していない状態に戻せないということが起こりますので、現状では、選択しないことを表す選択肢を用意しておくことが妥当な対策です。

今日は、昨日から開催されていたDESIGN IT! フォーラム 2008の二日目に参加してきました。

今回のテーマはインタラクションデザインということで、adaptive path社のDan Safferさんや、ソシオメディアの上野さんの話を聞いてきました。Danさんの著書の日本語版である「インタラクションデザインの教科書 (DESIGN IT! BOOKS)」という本が丁度昨日発売されたらしく、参加者全員に配られる太っ腹ぶりでした。ちらっとめくって見ましたが、Webだけではなくて、さまざまなインターフェースにおけるインタラクションについて書かれていて、楽しそうな内容でした。あとでじっくり読んでみます。

公演4つと最後にパネルディスカッションだったのですが、今日はその後すぐに群馬に行かなければならなかったので、残念ながらパネルディスカッションの前までしか聞けませんでした・・・。ということで今群馬からの投稿です！

Danさんのお話の中では、Office2007の事例が特に詳しくて参考になりました。2007敬遠してたけど、使ってみようかな…。上野さんの話は、今自分が問題に感じていることにダイレクトに響いてくるんですよね。

そんな感じでいつも通りメモメモ。

more…

先週の日曜日に時間があったので新宿のバルト9でスカイ・クロラを見てきました。原作を読んでいないだけに２時間では全然消化できませんでしたが･･･。

絢香のテーマソングがいい感じですね。

でも、今回は映画自体の話ではなく、映画館の話です。このバルト9、映画館自体のシステムが微妙ということで色々問題があるようです。

シネマコンプレックス「新宿バルト9」の驚嘆すべき大バカ最低システム

新宿バルト9への手紙

私はいつもWebで席を予約してから行っているので、現地でストレスを感じたことはあまりありませんが、Webの予約システムで不便に感じているところがあるのでちょっと書いてみようと思います。

more…

日付の入力をサポートする仕組みとしては、カレンダー型のpickerがよく用いられますが、何時何分という時間の入力の際に使えるpickerがこのNoGray Time Pickerです。

NoGray Time Pickerは、アナログ時計型のPickerで、時計の短針、長身をドラッグすることにより、時間を指定することができます。午前・午後表示と、24時間の2タイプがあるようです。

日付の入力の際には、曜日や何週目かなども判断材料になることが多く、普段良く見るカレンダーから選ぶというのが有効です。一方、時間の場合には、日付に比べるとアナログ時計を見ながら指定できるメリットは少ないですが、「10:25」のように、フォーマットを指定して入力させるような場合には、代替手段として用意してあげるととっつきやすくなるのではないでしょうか。

※AMとPMの切り替えがもう少し直感的ならなお良いのですが･･･（時計の中のAM,PMをクリックすると切り替わります）。

more…