検索ボックスが左側または右側にある場合

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

他の人が行うことに関して、ここに「人気のあるWebアプリのいくつかの簡単な概要を示します:

右側の検索ボックス

  • ドロップボックス
  • アルトメール
  • LinkedIn
  • Vimeo
  • Dribble
  • Twitter
  • Behance
  • Last.fm
  • Flickr

左側の検索ボックス

  • Gmail
  • Grooveshark
  • Outlook.com
  • Yahooメール
  • Facebook
  • Ohmytracks
  • Youtube
  • Pinterest
  • Outlook Web Access
  • Salesforce
  • Tumblr
  • Evernote
  • おいしい

中央の検索ボックス

  • Box.net

コメント

  • これは正確ではなくなりました。これらすべてを確認しましたが、 4はまだ同じでした。 MOSTは現在真ん中です。
  • @ user140421タブを維持していただき、ありがとうございます。 🙂

回答

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

記事を引用するには

私たちの経験では、適切に設計されたページは毎回ユーザーの期待を上回ります。

ここに画像の説明を入力してください

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

彼の決勝戦論文に基づく分析を以下に示します

ユーザーが検索ボックスが右上にあることを期待しているという理由だけで(少なくとも27%の時間) 、他の場所でそれを見つけることに適応できないという意味ではありません。結局のところ、私たちは人間は私たちの周囲に非常に順応性があります。

このスマッシングマガジンによる記事にはこれがありますサーチの位置について言うには

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

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

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

  1. 検索は技術的に完全に左ではなく、ロゴの後にのみ配置され、ユーザーを導くためにロゴの続きになります。検索の使用について

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

ここに画像の説明を入力 複数のサービスを結び付けるため、Googleのメールでは検索が重要です

画像を入力してくださいここでの説明

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

ここに画像の説明を入力してください

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

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

ここに画像の説明を入力してください

ここに画像の説明を入力してください

コメント

  • これらを見てください例を見ると、検索ボックスをより目立たせるには、左に行くほど大きくなると私は信じています。つまり、 "検索"が主要なアクションである場合、'は中心に向かっていますまたは左ですが、'二次アクションの場合、右にドリフトします。

回答

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

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

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

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

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

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

右上の検索ボックスの配置により、あるページから次のページへの固定の標準幅を維持しながら、その幅を最大限に柔軟にするため。

英語以外の場合言語:

…検索ボックスをロゴのすぐ下に配置した他の言語に対して英語版ウィキペディアをテストしなかったため、この代替配置は、ユーザーの期待に一致するようにすでに改善されています。ただし、上記の引用された調査と、検索ボックスを右上に移動する設計上の理由に基づいて、検索を移動する全体的なケースは、わずかに少ないとしても、それらの言語でも説得力があると考えています。

最後に、要約:

つまり、検索ボックスを次の場所に移動しました。 a)Webプラクティスとユーザーの期待を一致させる、b)一般的なユーザビリティの推奨事項と一致するように拡張することを可能にする、c)古い検索を使用するときに実際に観察された被験者の問題に対応する。

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

回答

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

「左側の検索ボックス」にこれらの名前を投稿していなかった場合、私のデフォルトの反応はサイトの右上のセクションに検索ボックスが表示されるのに慣れているので、検索ボックスは右側に配置する必要があります。これらの検索ボックスのほとんどはヘッダーの一部であり、コンテンツセクション(このWebサイトなど)から独立しています。 。

Youtube、Facebook、Gmailが左側にあるとは言えませんが、それらは中央にあります。左側の検索ボックスの例は、BoxOfficeMojo

回答

標準的な場所の重要性のため、この質問に1票を投じます。 UIの一般的な部分について!

この調査は、検索を含む一般的な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 )。一部のWebオブジェクトの期待は、2002年から2006年の間に変更されました。検索の場所は中央から右上に移動しました。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です