web-dev-qa-db-ja.com

検索ボックスを左側または右側に配置する必要があります

ヘッダーに検索ボックスがあるWebアプリでは、ヘッダーの左側または右側のどこに検索する必要がありますか?この決定を行う際に考慮すべき点は何ですか?

他の人たちが何をしているのかという観点から、人気のあるいくつかのウェブアプリの概要を以下に示します。

右側の検索ボックス

  • ドロップボックス
  • アルトメール
  • LinkedIn
  • ヴィメオ
  • ドリブル
  • ツイッター
  • 振る舞う
  • Last.fm
  • Flickr

左側の検索ボックス

  • Gmail
  • Grooveshark
  • Outlook.com
  • ヤフーメール
  • フェイスブック
  • Ohmytracks
  • Youtube
  • Pinterest
  • Outlook Web Access
  • Salesforce
  • タンブラー
  • Evernote
  • おいしい

中央の検索ボックス

  • Box.net
19

私はこの記事を読むことをお勧めします IE上のJARスプール ここで、コンテンツの位置付けと、それが紙に基づいてユーザーの使用にどのように影響するかを評価します 検索はどこにありますか?Webのユーザーの期待を再検討しますオブジェクト

記事を引用するには

私たちの経験は、うまく設計されたページであり、毎回ユーザーの期待に勝るものです。

enter image description here

17%の参加者が、検索ボックスの右上隅を期待していると述べました。

論文に基づく彼の最終的な分析は以下の通りです

ユーザーが検索ボックスが右上(少なくとも27%の時間)にあることを期待しているからといって、他の場所で検索ボックスを見つけることができないというわけではありません。結局のところ、私たち人間は私たちの環境に非常に適応しています。

これ smashing magazineによる記事 これは、探査機の位置付けについて述べています。

検索ボックスをどこに配置しますか?

多くの可能性がありますが、正しいものは2、3しかありません。ユーザーにとって最も便利な場所は、ユーザーが一般的なF字型のスキャンパターンを使用して簡単に見つけられる、Webサイトのすべてのページの左上または右上です。ただし、一部のブログでは、検索ボックスを(左または右)サイドバーの下部に配置する傾向があります。それはおそらく良いアイデアではありませんが、広告の考慮事項のために行われる可能性があります。

左または部分的に左揃えで検索を使用しているサイトの例を見ると、いくつかの一般的なテーマが表示されます。

  1. 検索は技術的に完全に左側ではなく、ロゴの後にのみ配置され、ユーザーが検索を使用できるようにロゴの続きになります。

  2. これらのサイトのほとんどは、機能の検索に大きく依存しています

enter image description here 検索は複数のサービスを一緒に結びつけるので、Googleのメールでは重要です

enter image description here

ここでの検索は音楽を検索するために重要です。多くの場合、ユーザーにとって最初の出発点です

enter image description here

Youtubeの膨大なデータベースにアクセスするための主要なエントリポイントとして機能するため、YouTubeにとって検索は重要です。

ただし、右側にサイトがあるサイトを例にとると、一般的なテーマは、これらのサイトは検索を使用する必要があるものの、サイトの重要な部分または主要な駆動点ではないため、目立つ場所に配置されず、場所に配置されるということです。ユーザーが以下に示すようにそれを期待する場所

enter image description here

enter image description here

15
Mervin

2010年、ウィキペディアは検索ボックスをページの左側(ナビゲーションボックスのすぐ下)からページの右上に移動しました。彼らはそれを行うために 詳細な説明 を投稿しました。これには、多数の研究記事への参照と自分の研究の結果が含まれます。

抜粋をいくつか引用しますが、記事全体を読むことをお勧めします。

ユーザーの期待に影響を与えた可能性のあるもう1つの要因は、Webブラウザーウィンドウの右上隅にある検索エンジン機能の一般的な配置です。右上に検索を配置することには実際的な利点があります...

...いくつかのユーザビリティ調査では、ナビゲーション要素が右側に配置されている主な利点が指摘されています。これにより、ブラウザのスクロールバーにすぐにアクセスできます。これは、a)検索結果のリストを上下にスクロールする、b)情報を求めて呼び出したばかりの記事を上下にスクロールする場合に特に役立ちます。

さらに、検索ボックスのサイズがページのどこに配置できるかに影響を与えることに特に関心がありました。

古い検索ボックスの幅は約20文字ですが、新しい検索ボックスは24文字に対応しています。さらに重要なのは、レイアウトのサイドバーに古い検索ボックスが配置されていたため、検索を広げたり、サイドバーを広げたりせずに検索を広げることは不可能でした。

右上の検索ボックスの配置により、ページ間の固定標準幅を維持しながら、その幅を最大限に柔軟にすることができます。

英語以外の言語に関しては:

...ロゴのすぐ下に検索ボックスを配置した他の言語に対して英語版ウィキペディアをテストしていません。この代替配置は、ユーザーの期待に応えるためにすでに改善されていることを認識しています。ただし、上記の調査と、検索ボックスを右上に移動する設計上の理由に基づいて、検索を移動する全体的なケースは、これらの言語でも少しでも魅力的であると信じています。

最後に、要約:

つまり、a)Webプラクティスとユーザーの期待に一致するように検索ボックスを移動しました。b)一般的なユーザビリティの推奨事項と一致するように検索ボックスを広げることができます。c)古い検索を使用したときにテスト対象で実際に観察された問題に対応します。

また、何百万人ものウィキペディアユーザーが以前の配置に調整していたため、新しい配置に再調整する必要があることも認識しています。ただし、ウィキペディアの全世界のオーディエンスは毎年数千万人のユーザーが増加しており(現在、世界中で月間3億7,500万人のユニークユーザーがいます)、この10年間で数億人の増加が見込まれています。そのためには、すべての新規ユーザーが私たちに適応することを期待するのではなく、一般的なユーザーの期待に適応する必要があります。これは、残念ながら古い配置に適応した人には不便です。私たちはそれが正しい決定であることを絶対に知っていますか?いいえ。ただし、既存のユーザーが一時的に不便を感じているという事実は、それが問題ではないことを示すものではありません。

15
CJF

私によると、左側の検索ボックスは、boxofficemojo.comで特定の映画を検索するような特定のエンティティを検索することを意味し、右側の検索ボックスは、ポータルで特定の機能またはセクションを検索することを意味します。 「検索」がアプリの中心的な機能(検索エンジンなど)である場合、検索ボックスは中央にあるはずです。

「左側の検索ボックス」にこれらの名前を投稿していなかった場合、サイトの右上のセクションに検索ボックスが表示されることに慣れているため、検索ボックスは右側にあるはずです。これらの検索ボックスのほとんどはヘッダーの一部であり、コンテンツセクション(このWebサイトなど)とは無関係です。

YouTube、Facebook、Gmailが左側にあるとは言いませんが、中央にあります。左側の検索ボックスの例は、BoxOfficeMojoです。

3
ripu1581

UIの共通部分の標準的な場所の重要性のため、この質問に1票投票してください。

この研究 一般的なWebオブジェクトのアイトラッキング(公開された検索を含む)で公開されました。検索が一般的な場所で行われた場合、凝視が少なく、検索時間が短くなりました。検索フィールドでは、通常の場所から離れる動きの最も強い影響は、ニュースや会社のサイトと比較してeコマースサイトにありました。

それらの場所は Webオブジェクトのメンタルモデル の調査に基づいていました。

彼らは、eコマースサイト、ニュースサイト、企業サイトで、検索ボックスを含む一般的なWebオブジェクトの場所について136人を調査しました。予想される検索場所は、サイトのタイプによって異なります。

調査の第2部では、516人の参加者がWebオブジェクトを画面に配置してWebアプリケーションUIを構築しました。

上記のリンクから結果を確認できます。 「右上に向かう傾向」は、検索ボックスの場所の結果についての私の説明です。

ウィチタ州のSURL 2002年に同様のタイプの調査を発表 「典型的なeコマースWebページ」。図5は、予想される検索場所を示しています。この調査では、場所はページの上部中央でした。 [彼らは2006年に別の方法でこれを追跡しました] study( http://psychology.wichita.edu/surl/usabilitynews/81/webobjects.asp )。 2002年から2006年の間に、一部のWebオブジェクトの予想が変更されました。検索の場所が中央から離れて右上に移動しました。

2
user1757436