ウェブサイトをデザインする際に注意すべきことは何ですか？視線追跡を使用してウェブデザインを改善する

あなたは機械を見ており、機械もあなたを見ています。最近、視線追跡技術の応用事例が数多く登場しています。たとえば、Intel は眼球を追跡して感情を理解できる 3D ラップトップ カメラを開発しました。また、Shanghai Zhuoshi の純粋なソフトウェア視線追跡機能は、目で飛行機を撃つゲームをプレイすることをサポートします。 EyeQuant は現在、高度なニューラル テクノロジーを使用して、ユーザーが Web ページを閲覧する際の目の動きを研究し、デザイン要素と Web ページ領域 (つまり、ユーザーの注目が集中している領域) のヒート マップを生成して、Web ページのデザインを改善する方法を研究しています。彼らが見つけたものは次のとおりです。

ウェブデザインで注意すべきこと

アイトラッキング技術の最初の発見は、Web の F 字型と E 字型のレイアウト設計 (ユーザーが画面の左側を見ることが多いという事実を利用) が必ずしも正しいわけではないということです。コンテンツが目を引くものであれば、F 字型や E 字型のパターン領域以外の領域でも注目を集めます。たとえば、コントラストが高く、中央に配置され、きちんと整理されたコンテンツなどです。実際、Web ページを設計するときは、3W、つまり Web ページの内容 (What)、ユーザーが注目するべき理由 (Why)、次にどこに行くか (Where) にもっと注意を払う必要があります。

いくつかのウェブデザインのベストプラクティスは疑問視されている

また、視線追跡技術によって課題となる Web デザインのベスト プラクティスもいくつかあります。たとえば、人々は常に顔に注目するというのが常識です。 EyeQuant は、視線追跡技術を使用して何千もの異なる Web サイトを研究した結果、顔と注目度の間には確かに関係があるものの、人々が必ずしも常に顔に注目するとは限らないことを発見しました。 Web デザインのもう 1 つの観点は、テキストを目立たせたい場合は、フォントを大きくする必要があるということです。しかし、調査では、一部のページでは大きなフォントが使用されていたにもかかわらず、ユーザーはそれを無視していたことが判明しました。

画像ライブラリの選択と使用について

画像が目を引くために最も重要なのは、画像自体だけでなく、ページの残りのコンテンツとの関係でも高いコントラストであることです。これは色のコントラストだけでなく、明るさのコントラストについても言えます。写真はページの上半分、中央、または上部に配置する必要があります。乱雑になりすぎないように、ページに空白スペースを残してください。

回転するバナーやスライドショーなどの画像を多用する要素はどれくらい効果的でしょうか?

動きは最初は注目を集めます。言い換えれば、それらは気を散らす可能性があり、これらの要素は Web を閲覧している一部のユーザーにのみ関連することが多いため、商用サイトではコンバージョン率に悪影響を与える可能性があります。

Apple が使用していて、ますます人気が高まっているような大きなヒーロー エリアは機能するでしょうか?

いわゆるビッグヒーローエリアとは、大きな画像と少量のテキストが並んだレイアウトを指し、Apple はこれを特に得意としています。ベイマックス ゾーンは、グラフィックが適切であれば非常に効果的ですが、そうでない場合は気が散る可能性があります。ストック画像を使用する場合は、伝えたいメッセージをサポートし、ページ上の他の重要なコンテンツの邪魔にならない画像を選択することが重要です。

長いスクロールをするか、重要な要素をページの上部に保持するか?

実際に、いくつかの長いスクロール ページは非常に成功しており、ユーザーはますますそれに慣れてきているようです。しかし、データによれば、平均的なユーザーは依然としてページの上部半分でほとんどの時間を費やしています。

リンクボタンはどのようにデザインすればよいでしょうか?

人間はコントラストの生き物なので、ボタンと背景色、ボタンのテキストとボタンの間には明確なコントラストが必要です。

ユーザーはどこを見るでしょうか?

デザイナーとして、ユーザーがどこを見るかに影響を与える能力を持つべきであり、特定のレイアウトやパターンの奴隷になるべきではありません。ページ上の要素の配置は、ユーザーの注目に影響を与える要素の 1 つにすぎません。注意の構成要素を理解すれば、彼らはあなたが見たいところを見るようになります。注意に影響を与える要因は何でしょうか? コントラスト、位置、サイズ、余白の 4 つです。

[この記事はthenextweb.comから翻訳されました]

元のタイトル: ウェブサイトをデザインする際に注意すべきことは何ですか? アイトラッキングを使用してウェブデザインを改善する

キーワード: