Category

ランディングページ

Category

こんにちは! 皆さん、今運用しているランディングページを改善しようと思ったことはありますよね? でも、何をしていいのか分からない、なんて事になっていませんか? そこで、今回は、海外で有名なA/Bテストツール・Unbounceの共同創設者のOil Gartner氏の記事を抄訳しました。 この記事はおよそ2500シェアがあった超良記事です。 また、時流に合わせた加筆と、チェック用のスプレッドシートも作成いたしました。 スプレッドシートのダウンロードはこちらから チェックできなかった項目の改善に役立つリンクもつけておいたので、ご参考ください。 元記事はこちらから↓ A 50-Point Checklist For Creating The Ultimate Landing Page それでは見てみましょう! チェックリストを使ってみよう いま行っているすべてのものにチェックしてみてください。 このスコアが、そのランディングページがどれほど良いか悪いかを示します。 残りの項目からto-doリストを作成し、より良いランディングページの作成をしましょう! ※チェックリストの項目がサイトに適切でない場合は、とりあえずチェックしてください(ビデオの埋め込みの有無など) 1.ランディングページの見出しは、広告のメッセージと一致していますか? http://promotionalads.yahoo.co.jp/online/lpo_2.html 2.ランディングページのメッセージは 、一つの目的にフォーカスしていますか? http://uxmilk.jp/489 3.初心者が5~10秒で目的を理解できますか?  http://kroneko-line.com/archives/45 4.会社が何者であるか、そして、何をしている会社かはクリアになってますか?  http://matome.naver.jp/odai/2141167487774378901 5.シンプルな説明で見出しのコピーを強化していますか? http://uxmilk.jp/489 6.製品/サービスの利点を箇条書きで説明していますか? http://www.web-writing.net/how_to_writing/a_subject/easy_understand/simple.html 7.製品の使用状況と関連する画像や動画を使用していますか? http://www.movie-times.tv/feature/8258/ 8.音読して理解できますか? http://lpo.gaprise.com/blog/lp-checklist-1480/ 9.メインの見出しは、このページが何を言おうとしているのかを表していますか? http://rdlp.jp/archives/lpopinion/1585 10.不要なリンクを整理して、ページリークを削除したことはありますか? http://directmarketingtips.weebly.com/12480124521252412463124881251012540124651248612451125311246412398125021252512464/5 11.ランディングページは、あなたの製品/サービスがどうユニーク(USP)であるかを説明していますか? http://okugoe.com/attract/%E3%82%A2%E3%83%AC%EF%BC%9F%E3%82%BA%E3%83%AC%E3%81%A6%E3%81%AA%E3%81%84%EF%BC%9F/ 12.メッセージは特徴よりもメリットに焦点を当てていますか? http://www.lpo-consulting.com/2012/11/lpstep2/…

あなたのランディングページは、この子猫に負けないくらい『モバイルフレンドリー』ですか? 画像は FlickrのPrime Numberさんのものを転載。 この記事は、Landing Page and Conversion Optimization Blog | Unbounceに掲載された「How “Best Practices” Change When You’re Dealing with Mobile-Responsive Landing Pages」を翻訳した内容です。 どんなデバイスからユーザーがアクセスしてきても、あなたのランディングページを快適に見ることができますか? 『画面を拡大しなければコピー文章が読めない』なんてこと、あなたのランディングページでは起こっていないでしょうか。CTAボタンを探すために、スクロールを繰り返す必要はないでしょうか。長いページを全て読み終わる頃には、指が疲れているなんてことも、あってはならないことです。 もし、全てのサイト訪問者にとって快適なページにしたいなら、ランディングページをスマホ用に最適化する必要があります。 そうは言っても、実際には何をすればよいでしょうか?スマホ用にページを最適化するといっても、いったいどうすればよいのでしょうか?私は、『コンバージョン率アップの専門家』8人に取材し、その答えにたどり着きました。 スマホで最大限の効果を発揮できるようにページを改善する方法は、従来のものとはどのように違うのでしょうか。 その答えとなる『6つの手法』をこれから紹介していきたいと思います。 1. スマホユーザー特有の目的に応えよう パソコンユーザーとスマホユーザーの目的は、それぞれ異なります。Three Deep Marketing 社のAngie Schottmuller さんは、次のように説明しました。 画面の大きさも、使っている機器も、状況(環境や心構え)も違うため、ユーザーが 期待すること、必要としていること、やりたいことも全く違ってくるのです。 『コンバージョン率アップの専門家』の多くは、『スマホユーザーはパソコンユーザーと同じ様に買い物をしない』ことに気付きました。 ContentVerve社のミッシェル・アーガルド(Michael Aagaard )さんは、このように説明しています。 たいていの場合、スマホユーザーのコンバージョン率は低くなります。パソコンユーザーが最も高く、次がタブレットユーザー、最後にスマホユーザーの順番です。 ここ数年に渡って、スマホユーザーはもっと増加するでしょう。それでも、何か買い物をする時はパソコンを使いたいという人が多いのも事実です。もちろん、販売している商品によって、”コンバージョンの意味”や”スマホユーザーの割合”は変わってきます。 あまり調べる必要の無い”手軽な買い物で”は、スマホが好んで使われているようです。 逆に、何か大きな買い物をする時には、たくさん調べる必要が出てくるので、 あまりスマホは使われないようです。 どちらにしろ、スマホで買い物をしようとする人は、比較的少ないようです。 しかし、…

あなたのランディングページでは、素晴らしいユーザー・エクスペリエンスを提供できていますか? 画像はFlickr社のJoachim S. Müller さんのものを転載。 この記事は、Landing Page and Conversion Optimization Blog | Unbounceに掲載された「4 Fresh Tips for Building Better User Experiences on Your Landing Pages」を翻訳した内容です。 ウェブ・マーケティングを担当しているあなたは、 『サイト訪問客を理解している』という姿勢を、ページで示す必要があります。 しかし、実際にはこれが難しいのです。 それができている人達の大半は、すばらしいユーザー・エクスペリエンスを ランディングページで提供しています。 逆に、もしあなたができていないのだとしたら、 『サイト訪問客の目的に共感することも、彼らが欲しがっている物を与えることもできていない』 ということになります。 その結果、あなたのコンバージョン率は最悪の状況になり兼ねません。 Page Fightsの最近の番組では、レギュラー審査員のオリ・ガードナー( Oli Gardner )さん、 ピープ・ラジャ(Peep Laja)さんに加えて、 AppSumo社のノア・ケーガン(Noah Kagan )さんが ゲスト審査員として登場し、10人分のランディングページを対象に、辛口で酷評しました。 その審査の中で、彼らはユーザー・エクスペリエンスを(おそらくコンバージョンも) 台無しにしてしまう『ありがちな間違い』をたくさん発見しました。 番組を全て確認したい人は、以下の動画を見て下さい。 ※英語の動画となっています。 もし、『あまり時間はないけど、すばらしいユーザー・エクスペリエンスを…

ランディングページのコンバージョン率をアップさせたいのなら、ストーリーの流れを考えましょう。 画像はこちらのサイトから転載。 この記事は、Landing Page and Conversion Optimization Blog | Unbounceに掲載された「7 Landing Page Mistakes That Are Stopping Your Prospects Dead in Their Tracks」を翻訳した内容です。 優秀なマーケティング専門家は、つい読み進めたくなるような流れのあるストーリーを展開します。 デザイン、コピー文章、客観的証拠など、全ての要素が相乗効果を生み、 サイト訪問者をコンバージョンへと導くのです。 しかし、全てのランディングページが、こんな風にうまくいくわけではりません。 もしランディングページの中に、コンバージョンにつながらない要素があったり、 サイト訪問者が立ち止まって考え込んでしまうような原因があった場合、 コンバージョン率が伸びることはないでしょう。 Page Fightsの最近の記事の中で、 審査員のオリ・ガードナー(Oli Gardner)さんや、ピープ・ラジャ(Peep Laja)さん、 そしてゲスト審査員のイアン・ルーリー(Ian Lurie:Portent社の社長) さんらが、 ページのストーリーを台無しにするような”やってはいけない間違い”について教えてくれました。 この”7つの間違い”を犯しているサイトは世の中に沢山ありますが、 実はその内容はほとんど知られていません。 しかし、その間違いが存在することで、サイト訪問者はページを読み進めるのを止めてしまい、 コンバージョンまで到達しなくなるのです。 1. ランディングページの内容がバラバラ Speak2Leads社のランディングページに掲載されているバナーは、デザイン自体は優れています。 しかし、ページの上の部分に配置されていることで、何が言いたいページなのか、 全体的に分かりにくくなってしまっています。 Speak2Leads 社のランディングページでは、ページの上の部分にバナーを掲載しています。 しかし、そのバナーは解読するのに時間のかかる内容になっています。 バナーの代わりに、見出し文章を掲載した方がいいでしょう。 審査員が出した結論は、 『解読するのに時間がかかるバナーを掲載することで、ユーザーが混乱してしまう』 ということでした。 オリ審査員は、 『ヘッドラインにもう少し文章を入れることで、論理的な流れを…

こんにちは。つなぎです。 僕も自社のランディングページの企画をすることがありますが、 どういう構成にすればいいのか? 何を重点的に考えて制作すればいいのか? コンテンツは何を配置すればいいのか? など、なかなか1人では思いつかないものですよね。 やはりそういったときは、具体的に他のサイトを参考にするのがイメージも湧いて一番はやいです。 そこで今回はランディングページの制作時に参考になる 海外のイケてるランディングページを集めました。 様々な種類のランディングページを見ていきましょう。 海外のイケてるランディングページ 10選 Path icon-external-link https://path.com/moments 少し前に話題になったクローズドSNS「Path」のランディングページです。 ファーストビューに目を引く「赤」が使われていて非常にインパクトがあります。 ランディングページではアクセスしてきたユーザーに対するインパクトが大切です。 DAYS icon-external-link http://daysapp.co/ カウントダウンが特徴のスケジュールアプリ「DAYS」のランディングページです。 上で紹介した「Path」とは対照的に、こちらは非常にシンプルなイメージです。 Grovemade icon-external-link http://grovemade.com/ 温かみのある木製や革製の製品を販売している「Grovemade」のランディングページです。 製品がもつ温かみや高級感などをうまく表現できています。 またページ中にGrovemadeのスタッフの方の一覧がありますが、 ホバーさせた時のエフェクトが非常に面白く、何度も遊んでしまいました。 Moto360 icon-external-link https://moto360.motorola.com/ MOTOROLAのスマートウォッチ「Moto360」のランディングページです。 スクロールエフェクトが非常に面白くスマートウォッチが 組み立てられていったり、文字盤が変わるなどをスクロールで表現しています。 気が付くとランディングページの下までスクロールしていました。 LIX icon-external-link http://lixpen.com/ 3Dプリントペン「LIX」のランディングページです。 スクロールする際にページ中央にペンで線を引いているような動きが 非常に斬新でイケてます。このページも思わず下までスクロールしていました。 PNG HAT icon-external-link http://pnghat.madebysource.com/ Photoshopプラグイン「PNG HAT」のランディングページです。 可愛らしいイラストが特徴です。画像部分はカルーセルになっており 次々に画像が切り替わります。 画像の1つに、かつてSNKから発売されていたゲーム「餓狼伝説」の テリー・ボガードがいてビックリしました。知ってる人はぜひ見てください。 Lily icon-external-link https://www.lily.camera/ 最近何かと話題のドローン「Lily」のランディングページです。 ドローンのデザインも去ることながら、…

買い手の4タイプを理解できれば、サイト訪問客の”買わない理由”をくつがえす事ができます。 画像はFlickr社のTrev氏のものを 転載。 この記事は、Landing Page and Conversion Optimization Blog | Unbounceに掲載された「How to Make Your Landing Page More Persuasive Using Buying Modalities」を翻訳した内容です。 ランディングページのコンバージョン率をアップさせる- その第一歩を踏み出すためには、 サイト訪問客がその商品を『買わない理由』を予想することが重要です。 そして、それをくつがえすための答えをランディングページに用意しておくのです。 しかし現実には、『言うは易く行うは難し』 です。 ( コンバージョン率最適化の手法のほとんどがそうですが) 結局は、顧客の気持ちなんて複雑で予想し難いものなのです。 最近、”実行に移す時が来た”というセミナーが開かれました。 そこでは、『三つのマーケティング根本策』を指導している アンジー・スコットミラー(Angie Schotmuller )さんが、 『顧客の複雑な心理を読み解く方法』について発表しました。 彼女はプレゼンの中で、『買い手の4タイプに合わせて説得する方法』を発表しました。 『買い手のタイプによって行動パターンが異なる』という事実と、 『買いたい気持ちをかき立てるためには、各タイプにとって何が効果的なのか』と いうことについて説明しました。 この画像は、買い手のタイプを4つの典型的なパターンに分けたもので、 元々はブライアン・アイゼンバーグ著:”行動を起こす時が来た”という本の中で紹介されたものです。 買い手の4タイプ全てを『買いたい気持ち』にさせるためには、 彼らが抱くであろう疑問や不安を予め予想し、答えを用意しておくことが大切です。 要するに、『買い手の疑問を解消すること=コンバージョン率アップ』という方式が成り立つのです。 では、各4タイプにはどういった特徴があるのか。 あなたのランディングページを見た時どんな反応を示すのか。 そして、コンバージョン率をアップさせるには、それぞれ何が必要なのかを見ていきましょう。 その答えを知りたい方は、こちらをクリックすると、 アンジーさんのプレゼン内容を確認することができます。 もしくは、これから各タイプについて噛み砕いて説明し、 『コンバージョンに必要なものは何か』を紹介していくので、このまま読み進めて下さい。 好戦型の買い手 最初にアンジーさんが発表した買い手のタイプは、『好戦型』です。 彼女はこのタイプを、トニースタークに例えています。 画像はこちらのサイトより転載。 そして、他の成功者とパートナーになりたがります。 クイズに挑戦して評価を得るなど、自分の能力を試すのが大好きです。 つまり、『好戦型の買い手』は、目標を立て、達成感を得るために行動するのです。 あなたのランディングページを訪れた時、彼らは自分自身にこう問いかけるでしょう。 商品が私にとって何の役に立つのか? あなたの会社の商品を選ぶのが一番だという、その根拠は何か? このような疑問に対して、ランディングページではどんな対策をとればよいでしょうか? ユニークではっきりとした商品価値 『商品がどのように自分の目的の役に立つのか』を知りたがっています。 そのため、『UVP(商品の利点を明確に説明すること)』を、 ページの正面中央の目立つところに掲載しましょう。…

コンバージョン率の高いスマホ版ランディングページを作るには、どうすればよいか分かるかね? これから3つの質問を訊ねるから、その答えを言うのだ。画像はこちらのサイトから転載。 この記事は、Landing Page and Conversion Optimization Blog | Unbounceに掲載された「3 Questions You Must Answer to Create Mobile Landing Pages That Convert Like Crazy」を翻訳した内容です。 スマホからも読みやすいランディングページを作るのは、簡単なことではありません。 まず始めに、ランディングページから必要不可欠な要素を全て抜き出し、 元のサイズの半分の大きさまで、ぎゅっと縮める必要があります。 ここで気を付けなければならないのは、スマホを手に持った瞬間、 ユーザーの行動パターンは全く違ったものに変わってしまうということです。 パソコンユーザーと比べた時、スマホユーザーのモチベーションはどう違ってくるでしょうか? あなたのランディングページに訪れたスマホユーザーは、どんな不安を感じるのでしょうか? 『どの質問について答えを考えるべきか。』 これが、高いコンバージョン率を叩き出す スマホ版ランディングページを作るための、唯一の答えになるでしょう。 最近開いたウェブセミナーの中で、 ブライアン・アイゼンバーグ(Bryan Eisenberg)さん (20年以上もコンバージョン率最適化の分野で活躍。著書:”行動を起こす時がきた”)は、 スマホユーザーの気持ちやモチベーションについて解明しました。 そして、コンバージョン率の高いスマホ版ランディングページについて、 噛み砕いて丁寧に教えてくれたのです。 こちらのサイトをクリックすると、そのセミナーの一部始終を記録した内容を見ることができます。 『どうすればスマホユーザーにとって快適なランディングページを作ることができるのか?』 そのキーとなる3つの質問について、これから紹介していきます。 質問1:あなたのスマホユーザーは、どの位の情報量を本当は求めているのか? ブライアンさんはこう言います。 ”スマホユーザーの行動パターンは、パソコンユーザーとは根本的に異なります。 何か情報を集めている時は特にそうです。 調べ物をしているパソコンユーザーの行動パターンは、フルコースを準備し、 席に座ってきちんと食事をする様子に似ています。 グラスに水を注ぎ、ナプキンを取り出して、テーブルをセットします。 自分の知りたい事について、より深く最後まで追求していくための心の準備ができているのです。 しかし、スマホを使うとなると、全く状況が変わってきます。 「スナック菓子でも食べているかのように、次から次へと移ってしまうのです。まるで『情報のかけら』を集めているようなものです。」 このことは、あなたのスマホ版ランディングページと、どのように関わってくるのでしょうか? スマホユーザーは、一番最初のファネルで、調べ物を終わらせてしまう傾向があります。 ですので、読んだらすぐ分かるようなページにしなければ、 あきらめて別のサイトに行ってしまうでしょう。 Intuit 社とPayPal社のスマホ版ランディングページを比べてみると、このことを実感できます。 PayPal社のランディングページは、11画面から構成されています。 ブライアンさんによると、スマホユーザーには情報量が多すぎるとのことです。 PayPal社のスマホ版ランディングページは、11画面にも渡っています。 スナック菓子のような手軽さを好むスマホユーザーには長すぎます。 画像はこちらのサイトから転載。 スマホユーザーは、スナック菓子のような『お手軽さ』を好みます。 何回もスクロールしなければならないページは、 読む気を失って他のサイトに移っていってしまうのです。 スマホユーザーとって、11画面にも渡るランディングページは、情報量が多すぎます。 一方、 Intuit社のランディングページは、スナック菓子のような…

サイト訪問者の感情や欲求を満たしていますか?  写真:Flickr.社の Daniel さんのサイトより転載。 この記事は、Landing Page and Conversion Optimization Blog | Unbounceに掲載された 「How to Create Landing Pages That Address the Emotional Needs of Prospects」を翻訳した内容です。 ランディングページの改善策を考える時に、”感情”について議論することはほとんどありません。 しかし、実際には、人は”感情”で物事を決断します。どの商品を購入するか、決める時も同じです。 ということは、サイト訪問者の感情や欲求を満たすことで、”買いたい気持ち”を引き出し、 コンバージョン率をアップさせることができるのです。 説明内容が抽象的で少し分かりにくいかもしれませんが、 もっと具体的に”感情を引き出す”方法を教えてくれる記事があるので見ていきましょう。 きっと、あなたのランディングページにも効果を発揮するでしょう。 1943 年、アブラハム・マズローは、”人間のモチベーション理論”という論文において、 ”マズローの欲求段階説”を発表しました。 それは、人間の生理的・感情的な欲求を、心理学的に理論化したものでした。 この理論によって、 ”人間の欲求を引き出すために必要なものは何か” を理解することができます。 人間進化論のベースとなる考え方でもあり、心理学から社会学、 管理者向けの研修まで、幅広く活用されています。 さらには、ランディングページの最適化にも非常に役立つものです。 ただしこの理論は、今あなたが使っているランディングページ改善手法の 代わりとなるものではありません。 しかし、 ”やるべきことは全てやったか” を確認するのに非常に役立つのです。 これから、”マズローの欲求段階説”の各レベルについて見ていきます。 そして、他のマーケティング専門家がランディングページで、 どのようにこれを活用して結果を出しているのか (そして、どうすればあなたも同じ様にできるのか)を見ていきましょう。 レベル1:生理的欲求 人間の最も基本的な欲求は、この生理的欲求です。 人が生きていく上で欠かせない重要なものになっています。 食事、水、睡眠、性的欲求、排泄等がこれにあたります。 ”私はIT系の会社でランディングページを作成しているけど、 この生理的欲求といったい何の関係があるのか?”と お思いになった方もいらっしゃることでしょう。 世の中には、この生理的要求と関係性の深い業種もあります。 サイト訪問者の生理的欲求を掻き立てた例を実際に見ていきましょう。 (Airbnbというサービスです) ハウストリップ(House Trip)というサービスがあります。 ロンドン内で、家賃の安い住居を探すためのサービスです。 安全性を保証することによって、サイト訪問者の生理的欲求を刺激しています。 コピー文章とロゴを見ていきましょう。  ”安心して暮らそう”  – 医療サービスが24時間体制のマンションであることを説明しています。  ”7百万人が暮らしてきました”  – 何百万人もの人が安心してこのサービスを…

ランディングページをデザインする時に必要なのは、きれいな画像だけではありません。 サイト訪問者を購入ボタンへ導くために、ページの構成をよく考えることが重要です。 上記の写真はFlickr社のBaldiriより転載したものです。 この記事は、Landing Page and Conversion Optimization Blog | Unbounceに掲載された「6 Articles on Design Theory to Help You Create Beautiful Landing Pages」を翻訳した内容です。 社内に優秀なウェブ・デザイナーがいる会社はいいでしょう。 でもたいていの場合は、そんな優秀なウェブ・デザイナーなんていません。 苦労して作り上げたウェブページのデザインが、かえってコンバージョン達成の邪魔に なってしまっているケースが多く見られるのです。 大切なのは、ページの見た目だけではありません。 コンバージョン率の高いランディングページに必要な、全ての要素に着目する必要があります。 矢印などのウェブ素材やフォントの活用方法、色の使い方、レイアウトのコツなど。 デザインが不得意という人にこそ、この記事は大いに役立つでしょう。 私はその手のブログを読み漁り、ついに最高のものを見つけました。 それは、”ランディングページのコンバージョン率を高めるデザイン手法”について 書かれたもので、色心理学からタイポグラフィ、目の錯覚の活用方法まで教えてくれます。 さあ、始めましょう! 1. 色心理学(Quick  Sprout社著) 消費者心理を理解するための完全ガイド 第四章:色心理学 著者:Quick Sprout社のNeil Patel、Ritika Puri これから、 Quick Sprout社の”消費者心理を理解するための 完全ガイド 第四章”を紹介します。 その内容は”配色”の方法から始まります。 色彩調和のみならず、それぞれの原色が与える 心理的な影響から、色影、淡色まで教えてくれます。 そもそも”色”とは、社会文化的な意味合いを持っています。 そして、この完全ガイドは、異なる社会集団において、 ”色”がどのような意味合いを持ってくるのかを教えてくれます。 (例えば、同じ色でも、北アメリカで使われるのと、インドで使われるのとでは、 意味合いが変わってくるのです。) この完全ガイドでは次のようなことも教えてくれます。 性別によって好きな色が変わってくる、その関係性 色の使い方でコンバージョン率をアップさせる方法 お体の不自由な方にも分かりやすいデザインの作り方 上級者ポイント! 多くのデザイナーは、同じページに沢山の色を使い過ぎて 逆効果になってしまっているのが現状です。 色は影響力を持っているので、一度に沢山使い過ぎると、 それを見た人の感情が入り乱れ、混乱を招くことになり兼ねません。 ですので、メインとなる色を一つ決めて、補助的に白やグレー、 黒といった無彩色を使うことをお勧めします。 2.…