_ [Web制作] Web標準の日々「Yahoo!検索におけるアクセシビリティとユーザビリティについて」メモ

メモ。

Yahoo! 検索における UX 改善はリリース→リサーチ→テストの繰り返し

アイトラッキングを使ったリサーチ (ビービット協力)

1件目がよく見られる

タイトルはよく見られるがスニペットはあまり見られていない

↓

よく見られていないスニペット部分が2件目以降を見られにくくしているのでは?

スペルチェック

日米を比較すると日本は利用率が低い

↓

文言と色・大きさの検討

「〜でも検索してみてください」

「〜をお探しではありませんか?」

「〜ではありませんか?」

8パターンをランダムに利用者に見せて比較

↓

色・大きさは当然ながら大きく赤にした方が利用率が高くなった、

文言では「〜ではありませんか?」がトップ

↓

「〜ではありませんか?」を赤字で大きくすることに決定

Yahoo! Everywhere 構想

PC・携帯だけでなくどこでも Yahoo! を

10 ft UI (10フィート離れた場所でも使える UI)

• 数少ないボタン
• 低いリテラシー
• マニュアルフリー

水平方向 (縦横3マス、計9マス)、常にカーソルはセンター、2段階の奥行きを持つ UI

CSS 切り替え

PC・Wii・DS・PSP、HTML は全て同じで、CSS で見た目を切り替えている

↓

CSS 切り替えは サーバサイド (PHP) で判別

↓

判別方法は他にもある

• link 要素の media 属性
• JavaScript
• IE 限定になるがコンディショナルコメント

しかし

• JavaScript 切ってるとダメ
• パフォーマンス (link の media 属性だと使用有無にかかわらずダウンロードされる)
• 環境によって media 属性の対応が違う

ため、サーバサイド判別とした

PC と Wii の違い

PC は近い、文字入力しやすい → 前のめり型

Wii は遠い、文字入力しづらい → のけぞり型

• Wii は表示要素を絞り込んだ
• 文字大きく
• フォーカス範囲大きく
• フィードバック大きく
• ページ送りは ← → だけ (1〜10 に直接飛ぶ奴は省いた)

目的意識

誰のため、何のため、の目的意識が大事

今後

複数のサービスを串刺し検索

韓国では既にやってる (インフラが充実しているため)

ダイレクト検索

質疑

Valid な HTML でなかったり、TABLE レイアウト中心なのは?

これまではいろいろなしがらみ、システム上の都合で直しづらかった。えいやっでやらないと難しい。新トップページでは改善されるはず。

米国との関係は? 自由度はどのくらい?

検索結果の UI についてはかなり自由度がある。ご存知の通り日本法人はソフトバンク傘下。Yahoo! はのれん貸しをしているだけで、外資企業ではない。

検索結果のマークアップ、しばらく前に調べたとろ MSN だけが各タイトルが見出しタグだったが。

Yahoo! は今は <B> でタイトルをマークアップしている。これも次のリニューアル時に見出しタグになるはず。(Google は既に H2 になっているらしい)