コンバージョン改善の鍵となる直感的なWebサイトとは?

Tracy Vides

Tracyはコンテンツの戦略家・リサーチャーです。小規模の企業や新規企業にマーケティングやソーシャルメディアについて助言を与えています。

この記事はUsabilityGeekからの翻訳転載です。配信元または著者の許可を得て配信しています。

How Intuitive Website Design Is The Key To Better Conversions (2017-01-23)

ユーザーは大抵10〜20秒でWebページを去ります。しかし、明確な価値提案のあるページはさらに長い時間ユーザーの注意を引きつけておくことができます。

これはJakob Nielsen氏のある記事の要約です。ユーザーがWebページ上でどのように振る舞うかを解き明かした記事です。さらにその後の調査で、ページを訪問してから最初の10秒が「決定的に重要な意味を持つ」ということがわかりました。しかし、仮に10秒間ページにユーザーが滞在したとして、彼らはさらにサイトに出入りするようになるのでしょうか?

「直感的」とは

Nielsen氏の調査では、平均的なWebサイト訪問者の思考における重要な要素を明らかにしました。ユーザーはサイトに対して懐疑的な考え方を抱いて訪問するというものです。大抵の場合、がっかりするサイトだろうと予想しつつも、ただ気になるために訪問するのです。そのため、ユーザーが期待するものを見つけるのに役に立つWebサイトは、足がかりをつかむことができるでしょう。

たとえば自動車販売店にいて、試乗してみたいモデルを見つけたとします。そこで車に乗ってみたものの、ハンドルがないことに気付きます。これは、直感的でないデザインの例です。これではカスタマージャーニーへと顧客が飛び込もうとしているのに、そこに障害を追加してしまっています。一般的な顧客は、お金を支払うのに余分な手間をかけたり頭を使ったりすることを嫌います。大抵の顧客はお金を支払おうというのに、余分な労力を必要としたり頭を悩まされたりするようなことを嫌います。不慣れな状況の場合は特にそうです。

あとから考えてみると、おそらくこれはGoogleが自動運転車に従来のハンドルを設置した理由なのでしょう。

なぜ直感的なWebサイトを構築するのか

Webデザインにも同じことが言えます。直感的にデザインされたWebページでは構成要素が上手に組み合わされているため、ユーザーが情報にアクセスしやすく、ナビゲーションやトランザクションは自然で手間がかかりません。直感的なデザインは目立ちませんが、必ずしも注意を引かないものである必要はありません。

デザイナーはサイトを芸術的に美しくしようとして、ユーサビリティを犠牲にしてしまうことが多いです。最初の10秒で明確な価値提案を見つけることができなければユーザーは去ってしまう可能性が非常に高いということを考慮すると、これはもはや犯罪とも言えるでしょう。サイトはデザインを通して、その目的を明確にする必要があります。

INBOUND 2016におけるMozのRand Fishkin氏による「How Marketers Can Keep Up With Google In 2017 And Beyond」というプレゼンにおいて、今後Google検索で発見してもらうために企業が追及すべき1番の目標は、「検索者のエンゲージメント」だと断言しています。

直感的なWebサイトの見た目とは

直感的なWebサイトの見た目を知るには、実際に見てみるのが1番です。今回は2つの事例を紹介します。1つは飽和状態にある業界の小規模会社のもので、もう1つは、大成功しているIT系のスタートアップです。

Playa Del Carmenはメキシコのカリブ海沿岸位置する、混雑するカンクンのビーチから45分ほどのエキゾチックな街にちなんだ名前の観光情報サイト兼旅行代理店です。このWebサイトは、直感的なデザインのWebサイトとして完璧です。

Playa Del Carmenのホームページ(画像ソース:Playa Del Carmen

ホームページの要素は、Playa Del Carmenの街に関する必須情報へ訪問者にアクセスさせます。また、そこへの旅行計画と予約(トランザクション)が可能になっています。

ホームページでもっとも優れている機能は、リアルタイムの天気ウィジェットです。マウスをウィジェットの上に移動すると、週全体の天気予報がドロップダウンで表示されます。旅行先を探す際、旅行者のために行う最優先の仕事の1つに天気の確認があります。この情報を最初から表示することで、ユーザーはほかのWebサイトで天気予報を探す手間が省けます。そして、そのまま旅行日を決定することが可能です。

天気が望ましいと仮定して、天気ウィジェットの横にある明らかな検索のコールトゥアクション(CTA)は、訪問者に宿泊可能なホテルを探し始めるよう、直感的に駆り立てます。少しスクロールすると、最新のプロモーションやおすすめのホテルの情報がわかります。そして情報と一緒に、Playa del Carmenでできる面白いことのビジュアルグリッドが表示されます。

「するべきこと」ページのスニペット(画像ソース:Playa Del Carmen

直感的なデザインのWebサイトに関する、もう1つの素晴らしい事例はShopifyです。これ自体が直感的なECソフトウェアであり、使いやすい独自のプラットフォームを備えています。またエンドユーザー(販売業者)によって作成されるチャネルも、独自のセールスポイントです。サイトをざっと見るだけでそれが何のサイトであり、DIYのオンライン販売においていかに革命的であるかを、すべての訪問者に伝えるでしょう。

Shopifyについて(画像ソース:Shopify

中央の明確なCTAが、無料で始められることや金融情報を共有するリスクさえもユーザーに知らせています。不明瞭な契約条件などはありません。スクロールダウンしていくと、Shopifyを使って作られたECストアの例が表示されます。さらに下に行くと、プラットフォームの機能やShopifyが提供する長所について知ることができます。さらに、個人ビジネスの提案や製品に合わせたカスタマイズがいかに簡単かもわかります。

Shopifyの長所(画像ソース:Shopify

最後にもう1度、金額を表示するリアルタイムのカウンターの下に、先程と同じCTAがあります。これは決定的な要因で、コピーは将来の儲けという非常に魅力的な誘惑をさり気なく利用する一方で、行動を起こすこと緊急性を組み合わせています。

ShopifyはCTAと緊急性を組み合わせています(画像ソース:Shopify

なぜほとんどのWebサイトは直感的なデザインではないのか

私の推測はあなたと同じですが、ほとんどのデザイナーと開発者が買い手の視点からの価値提案を理解し損ねていると考えています。そのため、やるべきことが非常に明確であったとしても、適切に提示できていないのです。私の友人のRohan Ayyar氏は、いくつかの提案をまとめました。また、それについてジョークも言っています。

「SEO業界の人には自分の作ったコピーを声に出して読んでみて欲しい(中略)」という皮肉に対して、Rohanは「開発者に自分たちのアプリを使うように言えっていうのか?まさか!」と皮肉をかぶせています(画像ソース:Twitter

直感的なWebサイトを作る方法とは

Webサイトを、営業活動の延長だと考えましょう。UXは製品やサービスを宣伝するために機能するだけではなく、ブランド価値を反映し、人々の生活を改善する期待がどれほどあるかも示すべきです。それを実行するのに役に立つ要点をいくつか紹介します。

徹底的な市場調査

すべての投機的事業は、デューデリジェンスから始めるべきです。ターゲティングやテストの正しい手法を使うことで、コンバーション率を飛躍的に高められることはあらゆる研究で判明しています。ランディングページのA/Bテストを実施する場合も、顧客へアンケート調査を実施する場合も、あるいは業界で影響力のある人がSNSでどんな発言をするかただ見るだけの場合でも、最重要なタスクは「知識のギャップ」を埋めることを中心とするべきです。

Jared Spool氏の記事では、知識のギャップの定義を「現在の知識とターゲットとする知識のギャップ」としています。現在の知識とは、顧客がWebサイトを訪問する前にインターフェイスについて知っていることです。それに対し、ターゲットの知識とは、ユーザーが目的を達成するためにプラットフォームで獲得したいと思うもののことです。真に直感的なデザインは、これらのギャップを埋めるものです。

市場調査は、このインサイトを獲得できるものでなくてはなりません。失敗すると、効果的なWebサイトを作成することはほぼ不可能になります。そもそも、なぜユーザーはあなたのサイトを訪れるのかを、自分に問いただしてみましょう。どのページをユーザーに見てほしいと思い、それはどうしてですか? ユーザーにどんな行動を取ってほしいですか?

市場調査の最終結果は、ターゲットユーザーの「意図」が理解できるものでなければなりません。ユーザーの意図は、セールスファネルの位置に応じて次々に変化します。そのため、ユーザーが使用する「自然な言葉」を正しく用いて、ユーザーに提示するコピーを書き、微調整する必要があります。

AhrefのKeywords Explorerはこれらのキーワードやフレーズに焦点を合わせ、きちんとしたトラフィックを獲得する最大限のポテンシャルを持つものを解き明かします。なので、その結果に応じてコピーを作成することができます。

AhrefのKeywords Explorer(画像ソース:Ahrefs)

デザイン

全体的なレイアウトとデザインは、Webサイトを直感的にするための基盤です。市場調査に基づき、ユーザーの立場になって考えてみましょう。ホームページは企業に関するすべてを明確に伝えていますか?

ブランドの個性は、サイトに訪れてから数秒以内ではっきりとわかるべきです。ユーザビリティとナビゲーションはシンプルかつ魅力的で、インターフェイス全体を通して一貫性を持つ必要があります。クリエイティブなコピーとグラフィックはペルソナにブランドの個性を伝えると同時に、ランディングページにスパイスを与えるための良い方法です。

Dropboxはサービスをプロモーションするだけでなく、企業のブランディングをWebサイトで行うという役割を果たしています。

サービスのプロモーションとブランディングを行うDropbox(画像ソース:Dropbox

目を引くデザインのメインテーマの1つは、簡潔さです。企業に関するすべてのことと、生活をどれほど便利にできるかを、ホームページ上において少ない言葉で明確に伝えます。短いコピーと、より綿密な情報を得るためのオプションを使用して、UXの強化や製品の素晴らしさを見せるため、またそれを使用する利点を宣伝するために、Webサイト上の各要素を注意深くデザインし、配置しましょう。

それでもまだ確信できない人のために、こんな情報があります。CEBによると、顧客が意思決定を行うプロセスをシンプルにすることで、なんと96%も購入の可能性が増加するそうです。

まとめ

近年の顧客には、非常に豊富な選択肢があります。ユーザーの限られた関心を獲得するため、同じような製品やサービスを販売するWebサイトがしのぎを削っています。

そのようなサイトの内、直感的にデザインされたWebサイトだけが訪問者を保持して、好みや行動を理解することができるでしょう。そして最終的に、購入やブランドの推奨といった形でコンバージョンに繋がります。