第一印象が重要:優れたビジュアルデザインが不可欠な理由

公開: 2021-07-22

人々は迅速な判断を下します。 人の第一印象を形成するのに1/10秒しかかかりません。 ウェブサイトも例外ではありません。

ユーザーがあなたのウェブサイトについて意見を述べ、滞在するか離れるかを決定するのに約50ミリ秒(ms)(つまり0.05秒)かかります。

この数は特定の研究から来ています。 最初の調査では、参加者は、それぞれ500ミリ秒間表示されたWebホームページの視覚的な魅力を2回評価しました。 追跡調査では、彼らは曝露時間を50ミリ秒に短縮しました。

全体を通して、視覚的アピールの評価は、50ミリ秒と500ミリ秒の条件の間の相関と同様に、あるフェーズから次のフェーズへと高度に相関していました。 したがって、視覚的な魅力は50ミリ秒以内に評価できます。これは、Webサイトで良い第一印象を与えるのに約50ミリ秒あることを示唆しています。

この第一印象は、構造、色、間隔、対称性、テキストの量、フォントなど、多くの要因によって異なります。 この郵便受け:

  • ウェブサイトと第一印象に関する詳細な調査。
  • 第一印象を改善するためのビジュアルデザインを作成する方法を示します。

注:以下のすべてのWebサイトのスクリーンショットは、説明のみを目的としています。

ウェブサイトと第一印象に関する調査

ユーザーは17ミリ秒で設計意見を形成します。

数年前、Googleは独自の調査で50ミリ秒の数値を確認しました。 実際、彼らの研究によれば、一部の意見は17ミリ秒以内に発生しますが、一部の設計要素ではその影響はそれほど顕著ではありませんでした。

彼らの研究から得られた重要な発見は、視覚的な複雑さが低く、プロトタイプ性が高いWebサイト(デザインが特定のカテゴリのWebサイトをどのように代表するか)が非常に魅力的であると認識されたことです。

プロトタイプのホームページのsquaresquareの例
人々はウェブサイトがどのように見えるべきかについての期待を持っています。 デザインがどれほど想像力に富んでいて印象的であっても、それらから逸脱することはリスクです。

重要なポイント: Webデザインをシンプルで親しみやすいものにします。 規則に従ってください。 人々はeコマースサイトどのように見えるべきかについて決まった考えを持っています。 革新的で型破りなレイアウトを選ぶと、人々はそれらを好きになる可能性が低くなります。

注:包括的なレポート(eコマース専用の247のガイドライン)で、大量のeコマースガイドラインとテストのアイデアを参照してください。

目がWebページの重要な領域に落ち着くまで2.6秒かかります。

ユーザーの目が第一印象に最も影響を与えるウェブサイトの領域に到達するのに2.6秒かかります。

研究者は、学生がWebページをスキャンするときに学生の目の動きを監視しました。 次に、研究者は視線追跡データを分析して、学生がページの特定のセクション(次のような)に集中するのにかかった時間を判断しました。 メニュー、ロゴ、画像、ソーシャルメディアアイコン-別のセクションに移動する前。

彼らは、第一印象が良いことを発見しました。 長いほど参加者はページにとどまりました。

  • トップ21のeコマースA / Bテストのアイデア

    CXLによる

    何が機能するかをテストして、第一印象を改善します。 調査から得られた上位21のeコマーステストのアイデアは次のとおりです。

  • このフィールドは検証用であり、変更しないでください。
ウェブサイトの第一印象の視線追跡研究の例
この調査では、Webサイトを6つのセクションに分割し、学生の被験者の目の動きを監視しました。 (画像ソース)

視聴者から最も関心を集めた6つのWebサイトセクションは次のとおりです。

  1. 機関のロゴ。 ユーザーは、次に進む前に、この領域に焦点を合わせて6.48秒を費やしました。
  2. メインナビゲーションメニュー。 ロゴとほぼ同じくらい人気があり、被験者はメニューの表示に平均6.44秒を費やしました。
  3. 検索ボックス。 ユーザーは6秒強に集中しました。
  4. サイトのメイン画像。 ユーザーの目は平均5.94秒間凝視しました。
  5. サイトの書かれたコンテンツ。 ユーザーは約5.59秒を費やしました。
  6. ウェブサイトの下部。 ユーザーは約5.25秒を費やしました。

重要なポイント:第一印象が良いと、訪問時間が長くなります。 ここにリストされている6つの要素が見栄えがすることを確認してください。

第一印象は94%がデザインに関連しています。

英国の研究者は、さまざまなデザインと情報コンテンツの要因がオンライン健康サイトの信頼にどのように影響するかを分析しました。 この調査は、ウェブサイトのルックアンドフィールが第一印象の主な推進力であることを明確に示しました。

クリーンなウェブサイトデザインの例
英国の調査によると、ほとんどのWebサイトの批評は、コンテンツではなく、サイトのデザインの認識に依存していました。

テスト参加者から寄せられたすべてのフィードバックのうち、94%は設計に関するものでした。

  • 繁雑;
  • ビジーレイアウト;
  • 航法援助施設の欠如;
  • 退屈なウェブデザイン;
  • 色の使用;
  • ポップアップ広告;
  • サイトの紹介が遅い。
  • 小さなプリント;
  • テキストが多すぎます。
  • 企業のルックアンドフィール。
  • 不十分な検索機能

フィードバックの6%だけが実際のコンテンツに関するものでした。 視覚的な魅力とウェブサイトのナビゲーションは、サイトの人々の第一印象に最も大きな影響を与えました。

同時に、不十分なインターフェース設計は、ウェブサイトの急速な拒絶と不信に関連していました。 参加者がデザインの側面を気に入らなかったとき、ウェブサイト全体がホームページを超えて探索されることはめったにありませんでした。

スタンフォード大学の信頼性の専門家が実施したConsumerWebWatchの調査でも、同様の結果が見つかりました。 彼らは、人々は、彼らがウェブサイトの信頼性を評価する方法について言うと、彼らは本当にどのように何が異なっていることがわかりました。

データは、平均的な消費者が、コンテンツよりも視覚的な手がかりなど、サイトの表面的な側面にはるかに注意を払っていることを示しました。 たとえば、全消費者のほぼ半数(46.1%)が、レイアウト、タイポグラフィ、フォントサイズ、配色などのビジュアルデザインの魅力に部分的に基づいて、サイトの信頼性を評価しました。

重要なポイント:優れたデザインにより、人々はあなたを信頼し、固執することができます。 貧弱なデザインは不信感を生み出し、人々を去らせます。

第一印象としては、視覚的な魅力が使いやすさを上回っています。

ある調査では、視覚的な魅力と使いやすさが、ユーザーのパフォーマンスとWebサイトの満足度に与える影響を調べました。

ユーザーは、視覚的な魅力(高と低)と使いやすさ(高と低)が異なるWebサイトでさまざまなタスクを完了しました。 結果は、第一印象がサイトの視覚的な魅力によって最も影響を受けることを示しました

ユーザーは、魅力の高いサイトに高い「ユーザビリティと関心の評価」を与え、 アピール。 魅力の低いWebサイトに対するユーザーの認識は、サイトでのエクスペリエンスが成功した後でも、サイトのユーザビリティに大きく影響されることはありませんでした。

重要なポイント:設計に投資します。 これは、ユーザーを引き込むために最も重要なことです。面白いことに、優れたビジュアルデザインは、より高いユーザビリティ評価につながり、実際のユーザビリティはそれほど重要ではなくなります。

ポジティブな第一印象は、全体的な満足度を高めることができます。

製品の期待が主観的なユーザビリティ評価に与える影響を調査するために実施された実験では、参加者は、ユーザビリティテストの前に、新しいモバイルデバイスのポジティブまたはネガティブな製品レビューを読みました。 対照群は何も読まなかった。

肯定的な製品レビューでプラ​​イミングの研究に使用されるモバイルデバイス。
研究で使用されたデバイス。 肯定的な製品レビューにより、割り当てられたタスクを完了できなかった場合でも、ユーザーはより肯定的なエクスペリエンスを得ることができます。

この研究は、主観的な実験後の評価に対する肯定的な期待の驚くほど強い効果を明らかにしました。 肯定的なレビューを読んだ参加者は、否定的なプライムグループと非プライムグループよりも、デバイスに実験後の評価を大幅に向上させました。

ポジティブプライムのこのブースト効果は、ユーザーがほとんどのタスクに失敗したハードタスク条件でも保持されました。

重要なポイント:ユーザーがあなたのサイトを「即座に」気に入った場合、ユーザーは一時的な中断のためにあなたにいくらかのたるみを減らします。 この種のプライミングは、他の方法でも機能する可能性があります。 第一印象はあなたのサイトの全体的な満足度を低下させます。

それで、あなたが良い印象を与えたいならば、どこから始めるのが最も良いですか?

ビジュアルデザインで素晴らしい第一印象を与える方法

1.あなたのデザインであなたのウェブサイト(そしてあなたの会社)を差別化してください。

あなたはシックで、愚かで、セクシーで、知識が豊富で、スマートで、クラシックですか、それとも何ですか? 競合他社とどう違うのですか? あなたのウェブサイトのタイポグラフィ、画像、デザインを通して、それをできるだけ早く伝えていますか?

消費者を先延ばしにする可能性のある「革新的な」デザインを回避することと、独自の視覚スタイルを模索することの間にはバランスがあります。 多くの場合、同じ業種の企業は、デザインの美学において「me-too」アプローチを採用しています。

場合によっては、競合するサイトが非常に似ているため、サイトのヘッダーからロゴを削除すると、あるサイトを別のサイトと区別することがほぼ不可能になります。

私が気づいたことから、これは2つの主な理由によるものです。

  1. デザインの美学についての内部の会話は、明確な視覚的アイデンティティを開発するのではなく、機能についての会話に発展します。
  2. 競技会で「機能しているように見える」機能と美学が採用されています。

もちろん、新しいサイトが立ち上がると、誰もが忙しくてハイタッチをし合って、新しいデザインがメジャーのカーボンコピーに近いことに気付くことができません。 競合他社選手、 または、そもそもなぜ既存の顧客があなたの会社で買い物をするのが好きなのかを尋ねることを完全に怠ったこと。

ビジュアルコミュニケーションをさらに際立たせたいが、どこから始めればよいかわからない場合は、Zaltman Metaphor Elicitation Techniqueをチェックして、定性調査に適用してください。 これ、訪問者を遠ざけることなく、ブランドのコアバリューを伝える第一印象をデザインするのに役立ちます。

Taylan DemirkayaからマーケティングリサーチでZMETテクニック

「ブランドアイデンティティ」は、シャッフルされるスクイーズなものだけではありません。 Cheskin Research&Studio Archetypeは、1999年までさかのぼって、eコマース企業との信頼関係を構築する上で最も重要な6つの要素は次のとおりであることを発見しました。

  • ブランド;
  • ナビゲーション;
  • フルフィルメント;
  • プレゼンテーション;
  • 最新のテクノロジー;
  • セキュリティロゴ。

ちょっと考えてみてください。 あなたのサイトが他のウェブサイトと見分けがつかないという第一印象があるのなら、なぜ誰かがあなたの製品ページを探索する必要があるのでしょうか。

次に例を示します。「革のジャケット」をグーグルで検索して、ランダム検索で視覚的な区別と全体的な第一印象が問題になるかどうかを確認しました。 これらは最初の3つの結果でした:

これらの3つのサイトを分離するものはありますか? 彼らは同じ正確な人口統計を共有していませんが、実際にはそうではありません。

上記のサイトとは異なるサイトを見つけるまで、検索結果をスクロールするのにしばらく時間がかかり、ついにBomboogieに出くわしました。 このページが競合他社とは異なることは否定できません。

他のサイトとは異なり、このページはすぐに別の感覚を映し出します。これは、繊細でファッション性の高いジャケットを製造している会社ではありません。 彼らのジャケットは「飛行士が使用するジャケットから着想を得た」もので、サイトはその一部に見えます。

数年前、私が最初にこの調査を行ったとき、私が見つけた最も明確なサイトはショットでした。 イメージスライダーやソーダキャップのナビゲーションなど、偽物のテクスチャーは捨ててしまいましたが、特に古いブランドであるため、第一印象が強いデザインには魅力がありました。

ショット

性格や感情を感じ、信頼できるかどうかを感じることができ、それが第一印象全体です。

しかし、デザインのトレンドも彼らに追いつき、今では他のすべてのサイトと非常によく似ています。

Shopifyは、明確な第一印象を持つ企業を特徴とする100の美しいeコマースデザインのリストを作成しました。

重要なポイント:ユーザーを混乱させたり苛立たせたりするほど革新的でなくても、独自のブランドアイデンティティを伝えることができます(そして伝えるべきです)。

2.サイト訪問者を刺激して、最初に強力なものを作成します 印象。

観光ウェブサイトでの第一印象の役割を調べた研究では、インスピレーション関連の要素が最大の影響を及ぼしたことがわかりました 第一印象s。

これは、視覚的に魅力的な刺激が、人々をサイトに長く滞在させ、より多くの訪問者を購入者に変えるための重要なツールであることを示唆しています。

チリの旅行サイトでの自然の感動的なビュー

使いやすさは、第一印象形成の2番目に重要な推進力であり、信頼性がそれに続きました。

全体として、これは旅行者が目的地(画像)についてインスピレーションを得たいと思っていることを示しています。 彼らは物事を理解することに精神的なエネルギーを浪費したくない(使いやすさ)、そして旅行プロバイダーが合法であることを確認したい(信頼性)。

重要なポイント:夢を販売している場合(たとえば、チリに休暇をとるというアイデア)、感動的な写真は第一印象の主要なクリエイターです。

3.折り目の上の領域が揺れることを確認します。

何年にもわたって、上記の問題は熱く議論されてきました。 調査によると、人々はスクロールに問題がなく、実際、分割コンテンツを多くのページに。 これは第一印象と何の関係がありますか?

9ウェブサイトの信頼性キラー

アレックス・バーケット

懐疑論ではなく、信頼を刺激するWebページを作成する方法を学びます。これは、購入を阻止するのではなく、購入を支援します。

  • このフィールドは検証用であり、変更しないでください。

上記の問題についての新しい考え方は次のとおりです。それはあなたのウェブサイトの最良の部分である必要があります。 第一印象は0.05秒で形成されます。 その間、ユーザーは下にスクロールしません。

したがって、スクロールせずにすぐに表示されるのは、下にスクロールするかどうかを決定するものです。 それを念頭に置いて…

ナビゲーションには特に注意してください。

明確なサイトナビゲーションの例

多数のヒートマップ調査により、ナビゲーションは通常、Webサイトで最初に表示される領域と最も表示される領域の1つであることが示されています。 しかし、典型的なカテゴリーを超えて、あなたは何を含めるべきですか

Business Insiderの調査によると、人々がショッピングカートを放棄する理由については、25%の人が「ウェブサイトが複雑すぎる」(つまり、ナビゲーションが使いにくい)と述べ、60%近くが「隠れたコスト」(つまり、送料)と述べています。 )彼らがpaなしで去った主な理由として ying

買い物客がeコマースストアで支払いをせずに去る理由を示すグラフ
隠れたコストと複雑なウェブサイトは、ユーザーがお金を払わずにウェブサイトを離れる2つの主な理由です。

eConsultancyによる別の調査では、見慣れないeコマースサイトからの購入について尋ねられた訪問者は、「プロフェッショナルなデザイン」、「サイトには有名なブランドが含まれている」、「連絡先情報が表示されている」すべてが購入(または購入しない)の決定に影響を与えたと述べています。 )。

あなたが知らない小売業者との買い物の結果を研究します。

うまくいけば、サイトのナビゲーションには、訪問者が購入するのを思いとどまらせるものの一部またはすべてを含めることができます。

私のお気に入りのサイトの1つであるThinkGeekのナビゲーションで、サイトのコンテンツにアクセスすることなく、どれだけの情報が伝達されているかを見てください。

たくさんの貴重な情報を伝えるサイトナビゲーション。

あまり狩りをしなくても、簡単に見つけることができます。

  • 時間に敏感プロモーション;
  • サイトをより深くナビゲートするための複数の方法(カテゴリ、興味、検索)。
  • 新製品、トップ製品、限定製品、およびそれらが運ぶ製品のヒント(ギフト、Tシャツ、電子機器、ギフト券)。
  • 報酬プログラム。
  • 販売中の製品;
  • 彼らの「送料無料」のしきい値。
  • カスタマーサポートの可用性(「ライブチャット」および「ヘルプ」ボタンを介して)。

これをZaraのような極端な例と比較すると、これが重要である理由がわかります。

ミニマリストナビゲーションの例

ケーススタディ:Alightはサイト検索を16%増やし、購入を25%増やします

オールドアライト

Alight(現在はCurvyHQ)は、自分たちのサイトが古くなっていると感じていることを知っていました。 プラスサイズの女性小売業者は、サイト全体のナビゲーションをより現代的にしました。

彼らは検索バーのサイズを大きくし、信頼のシンボルを削除し、ピンクのナビゲーション領域に「販売」と「新規」のカテゴリを組み込み、その他のマイナーな更新の中でも特に価値提案を明確にしました。

検索バー付きの更新されたホームページナビゲーション

その結果、サイト検索が16%増加し、購入全体が25%増加しました。これはすべて、ナビゲーションが強い第一印象の一部となったことによるものです。

ウェブサイトやNBAでの第一印象は、何年も続く可能性があります。

エコノミストのバリー・スタウとハ・ホアンによる調査では、NBAのドラフト注文の影響を調査しました。 彼らは徴兵されてから5年間プレーヤーのキャリアを観察しました。 多くの点で自分自身を証明するには5年で十分なので、ドラフト注文は役割を果たさないはずですよね?

違う。 調査によると、プレーヤーが獲得するプレイ時間はドラフトの順序と相関関係があります。 チームは、ドラフトの多いプレーヤーにより多くのプレー時間を与え、プレーヤーのコート上でのパフォーマンス、怪我、トレードス​​テータス、プレーされたポジション、およびその他の要因を制御した後でも、それらをより長く保持しました。

ドラフト番号が増えるたびに(つまり、ドラフトが8番目ではなく9番目になる)、再生時間が23分も短縮されました。 信じられないことに、ドラフトオーダーは、調査で測定された最終年であるNBAでのプレーヤーの5年目までのプレー時間を予測し続けました。 最初のラウンドでドラフトされたプレーヤーも、より長いキャリアを持っていました。 彼らは他の人より3。5年以上遊んだ。

明確で強い第一印象を与えるホームページの例

別の研究では、第一印象の持続性を調査しました。 第一印象と矛盾する新しい経験が、それらが作られた文脈に「束縛」されることを発見しました。 ただし、第一印象は依然として他のコンテキストを支配します。

私たちの脳は、期待に反する経験を「ルールの例外」として保存します。 ルール(つまり第一印象)は、違反した特定のコンテキストを除いて有効として扱われます。

重要なポイント:第一印象が否定的である場合、それは何年もの間あなたに対してユーザーを偏見させるかもしれません。

結論

視覚的な魅力が重要です。 たくさん。 私のアドバイス:デザインにお金をかけようとしないでください。 「シンプルな」設計のオーバーホールがどのように大幅なコンバージョンの促進をもたらしたかを何度も見てきました。

人々はミリ秒単位であなたのサイトについての意見を形成します。 あなたのウェブサイトの最初の秒は、その後のすべての秒よりも重要かもしれません(もしあれば)。 1秒が素晴らしい第一印象を与えることを確認してください。