JetB株式会社

HPの印象を劇的に改善する6つの印象効果

HPの印象効果のイメージ

HPの印象で企業が評価される時代

今や誰もがパソコン、スマートフォンなどでネットにアクセスできる時代です。
インターネットの情報をもとに良し悪しを判断する傾向が年々高まっています。もちろん企業やお店も例外ではありません。
HPの印象によって会社やお店のイメージが決まると言っても過言ではありません。
HPの印象が良ければ売り上げにつながるのはもちろんのこと、金融機関の与信審査や採用活動にも有利に働くと言われています。アメリカでは採用活動の中心は自社のHPのため、HPの開発にもっともコストをかけると言われています。
今回はHP上で印象を左右するポイントを解説したいと思います。

HPが与える印象効果【1】初頭効果

初頭効果とはWebマーケティングの世界でよく使われる心理効果の一つです。
ファーストビュー、つまりサイトを開いて一番最初に目に入るキャッチコピーや画像で、ユーザーは自分に欲しい情報がサイト上にあるかどうかを判断します。いくら有益なコンテンツであっても、初頭効果に失敗すると見てもらうことができません。一般的にファーストビューでサイトを離れる割合(直帰率)は実に70%以上と言われています。
ファーストビューでいかに商品の魅力をアピールし、「さらに読み進めよう」と思わせるかが重要です。
見方を変えれば、初頭効果に力を入れることで、自社や自社の商品・サービスにさほど興味がないユーザーを引き込むことができます。

HPが与える印象効果【2】色の効果

人は色から影響を受けやすいと言われています。色の効果を考慮しないとユーザーに意図していない印象を与えてしまう可能性もあります。

◆色の基本要素

印象の観点から色を分けると寒色系、暖色系、中性色の3つに分類されます。

%e7%ad%86

寒色系

青色、白色など冷たさ、寒さを感じさせる色です。
寒い、クール、信頼感、清潔感、誠実さ、落ち着きといった印象を与えるのに役立ちます。

暖色系

赤、オレンジ、黄色、ピンクなどあたたかさや温もりを感じる色です。
情熱、躍動感、温もり、親しみやすさ、幸福感などを表現する時に用いられます。
ピンクは可愛らしい印象を与えたい時に使われることが多いです。
暖色系の色は強い印象を与えるため、ピンポイントで使うことで目立たせる効果もあります。

中性色

紫、緑など寒色と暖色の両方のイメージを程よく持っている色です。
安らぎ、生命力、癒やし、上品、エキゾチックといった印象効果があります。

ざっくりとした分類で印象を書きましたが、青といっても様々な色合いがありますし、彩度や明度によっても印象が変わってきます。
色の与える印象効果を意識した上で、最適な色を選定しましょう。

HPが与える印象効果【3】形の効果

デザインにおいて一番影響が強いのが「形」です。人は新しいモノに出会うとまず形を理解して記憶すると言われています。
形の持つ印象を理解し、効果的に取り入れることが大切です。
ここでは代表的な形の持つイメージを紹介します。

「○」

丸みのあるデザインは親しみを感じさせてくれます。
他の形でも角に丸みを持たせることで印象をソフトにしてくれる効果があります。

 

「△」

尖っていて、安定しない三角は革新的な印象を与えます。
「現状を打破したい」と思っているユーザーに刺さる形です。
また注意を喚起するのに効果的です。

 

「□」

四角は安定感をイメージさせます。
ユーザーに安心感を与え、落ち着いて読み進めることができます。
また読みさすさという観点でも多用される形です。

 

顔は強い印象を与える

人間の脳には形を認識する細胞とは別に、顔を認識する細胞があるのだそうです。
顔を載せているHPが多いのはもちろんユーザー安心感を与えるためでもありますが、印象効果の上でも有効だと言えます。

事業内容によっては、運営者の顔を出す事で一気に信頼感&親近感がアップすることがあります。

以下は弊社のクライアント様で地域おこしの活動をおこなうNPO法人の例です。

%e5%8d%81%e6%97%a5%e7%94%ba%e5%b8%82%e5%9c%b0%e5%9f%9f%e3%81%8a%e3%81%93%e3%81%97%e5%ae%9f%e8%a1%8c%e5%a7%94%e5%93%a1%e4%bc%9a%e3%80%80%e6%b1%a0%e8%b0%b7%e3%83%bb%e5%85%a5%e5%b1%b1%e3%82%ab%e3%82%99

HPが与える印象効果【4】導線設計

見た目を整えるだけがデザインではありません。どこにどの情報、パーツを配置したらコンバージョンにつながりやすいか、ユーザーが見やすいかを考えるのもWebデザインの重要な役割と言えます。いわゆるユーザービリティです。どれだけおしゃれなサイトでも、どこをクリックしていいかわからないサイトでは、ユーザーは不便を感じて離れてしまいます。
導線の工夫が重要なのはWEBサイトだけではありません。コンビニを例に考えると分かりやすいかもしれません。

HPの印象効果のイメージ

コンビニではお客様を誘導するために売り場の配置を工夫し、お客さんに長く店内にとどまってもらう事が売上げを左右します。そのため。常にフランチャイズ本社の幹部が、導線や配置を研究していると言われています。
HPでもこの導線の重要性は全く違いがありません、同じように導線設計を考える必要があるのです。

HPが与える印象効果【5】画像の効果

画像がなくて1万字以上のテキストが並んでいるHPがあったらどうでしょう?見づらいのはもちろん、何だか難しい印象で、とても読み進められないと思います。
画像は内容の理解を助けたり、HP全体に統一感を持たせたりする効果があります。

HPが与える印象効果【6】文体の効果

ユーザーはテキストの文体から会社の姿勢を感じ取ります。
「です・ます」調であれば優しく柔らかい印象や誠実な姿勢が感じますし、「である」調だとスタイリッシュで強い印象となるでしょう。ビジネスには馴染まないかもしれませんが、場合によってはタメ口も親しみやすさや可笑しみを醸成するのに役立つと思います。
ユーザーに寄り添っているのか、専門家として世間的にあまり知られていない情報を紹介しているのか、あるいはコミカルなキャラクターで楽しませようとしているのかなど、コンセプトに応じて文体を選ぶことが大切です。
文体は統一するのが基本です。中途半端に混ぜることで文章のリズムが悪くなり、稚拙な印象を与えてしまいます。
もちろん、箇条書き部分だけ「である」調にするとか、実際のお客様の声は「ですます」調にするといったルールで織り交ぜるのはこの限りではありません。

■HP印象改善例

理屈だけでは今ひとつピンとこないという方もいらっしゃるかもしれません。
そこで、弊社が過去に手掛けたHPを例に説明したいと思います。

改善例①自動車教習所のサイト「ツルモータースクール」

HPの印象効果のイメージ

山梨県の届出教習所であるツルモータースクール様。何かの事情で免許取り消しや失効された方でも柔軟なスケジュールで教習を受けられるという、仕事や学校と両立して免許を取得したい方にとって魅力的な教習所です。
リニューアル前のサイトは文字情報が主体で、ファーストビューでは何が利点なのか分かりづらい状態でした。また、フォントに寒色系の色を使っているためにどこか冷たい印象でした。
弊社でのリニューアルではメインビジュアルで最短10日で免許が取得できる点を打ちだしました。暖色、中性色を用いることでやさしく、温かみのある雰囲気に仕上げています。また、写真を多用することでスクールの雰囲気をしっかり伝えています。

改善例②高級品を取り扱うサイト「ベルカメオ」

HPの印象効果のイメージ

工芸品として資産価値の高いイタリアンカメオをネット中心に販売されているベルカメオ様。イタリアの職人が作る本物のカメオだけを販売されているこだわりのお店です。商品単価が数十万円から数百万円のため、購入のハードルが高く、なかなかコンバージョンに繋がらないという課題をお持ちでした。
リニューアル前のサイトではファーストビューでイタリアンカメオの価値が分からない状況でした。
また、サイトのベースとなる色が暖色系のため、高級商品とミスマッチを起こしていました。
導線設計で言えば、商品が並列に並べられているだけのため、どこから購入すればよいのか分かりづらい印象でした。
リニューアル後はメインビジュアルで「唯一無二」「貴方だけの」という言葉とベルカメオの画像を大きく打ちだし、初頭効果で資産価値の高さを印象づけました。
メインカラーは黒。シックな高級感を出しています。
また、LPでベルカメオの歴史から特徴、購入にあたって保証がつくことなどを順を追って説明し、安心して購入できる導線設計を行っています。

印象効果を利用してビジネスを有利に進める

いかがでしたでしょうか?
HPはもはやただのプロモーションツールではありません。
ネットを通じて初めてあなたの会社やお店を知る人にとっては、評価の全てなのです。
今回紹介した観点に気をつけて、印象効果の高いHPを作れば、中小企業や個人事業主でも十分ビジネスチャンスがあります。
参考にしていただけますと幸いです。


関連記事Related article