キーワードマーケティングとしての売れるスマホ・ランディングページ
キーワードマーケティング研究所
滝井秀典

自己紹介
キーワードマーケティング研究所 代表
２００４年創業 １１年目
リスティング広告運用会社経営 社長業
中小企業向け 年間の取扱高２０億円
２００６年「検索キーワード」からビジネスをはじめるノウ
ハウ本
５万部ベストセラーAmazon年間ランキング８位
基本マーケターワールドビジネスサテライト出演
朝日新聞、日経新聞他取材多数

2(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

何が特徴なのか• 最大で８００社以上の中小企業会員コンサルティング• ５００サイト以上の広告反応率・コンバージョン率データを保持• ３００サイト以上のコンバージョン率アップおよびダウンの実例• 主催セミナー・イベント計１００回以上、延べ参加人数３０００名
以上、教材販売２０タイトル超、延べ購入者約１万８千名

2014/9/26

3(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

ＰＰＣ（リスティング広告）の成功要因

３０％

７０％

広告

ランディングページ（セリングぺージ）

2014/9/26

4(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

なぜコンバージョン率が大事なのか？
１０万円かけて、１,０００人広告をクリックさせた場合・・・

コンバージョン率

コンバー
ジョン数

一人あたりの顧客獲得単価

２０人

５千円

１０人１万円

１人１０万円２％
1％
１,０００人0.1％

わずか１．９％の差で、顧客獲得単価は５千円にも、１０万円にもなる。
5

たった一つの大きな悩み

今、検索エンジンマーケティン
グ関係者の多くが悩んでいる
ことって？

6(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

スマホからの流入がすごく多くなってる！
なのに、ＰＣに比べてスマホのコンバージョン率がめちゃ悪い！
→ダブルパンチ！
7(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

物販ではスマホからのアクセスがとっくに上回っている

出典：ニールセン http://www.netratings.co.jp/news_release/2014/03/Newsrelease20140326.html
8(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

よくありがちな例

ＰＣスマ
ホ

コンバージョン率

ＣＰＡ（顧客獲得単価）

＝１．０％

＝５千円

＝０．５％

＝１万円

悪いほうが増えてしまっている悪循環2014/9/26

9(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

実例
リスティング広告の悪いパフォーマン
スの多くの原因はスマホページ

10(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

このセッションの目的は・・・
スマホからの流入が多くなってるのに、スマホページのコンバージョン率が低い、という困った問題を解決する。
それによって、コンバージョン数の最大化を狙う。

11(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

成功事例
スマホでＰＣサイトを見せていた

売れるスマホサイト化

2014/9/26

12(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

2014/9/26

13(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

売れるスマホランディング
ページ（サイト）
ページ数：１０

2014/9/26

14(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

ＰＣサイト

ページ数：３０

2014/9/26

15(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

成功例• 昨年比：ＰＣサイトをスマホで見せていたバージョンとの比較＝コンバージョン率２倍

2014/9/26

16(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

成功事例→以前のスマホサイト

参考：ＰＣサイト

17(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

アフター

18
(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

３つの結論1.
2.
3.

売れるスマホサイトをつくれば、既存の２倍以上のコンバージョン率が出ます
しかも、ＰＣよりもスマホの方が、コンバージョン率は高くなります
しかも、今は競争ゆるいです※要注意
適当なスマホサイトをつくってしまうと、ＰＣサイトを見せていたときよりコンバージョン率は悪くなります2014/9/26

19(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

本日セッションのお題目
1.
2.
3.
4.
5.

一般理論モデル
ＰＣサイトをスマホで見せると反応が下がる４つのポイント
スマホサイトにしてもむしろ反応が悪化する６パターン
売れるスマホランディングページ６つのポイント
成功を加速させる秘訣

2014/9/26

20(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

このセッションにおける言語の定義
スマートフォン＝スマホ
スマホページ＝１ページを指す
スマホサイト＝下層ページを含むページ群
ランディングページ＝検索結果をクリックした先の着地ページ（※１枚ものの長いページ、という意味ではない）
ＰＣ＝パソコンスマートフォン＝スマホ＝電話ができるシングルウィンドウの携帯端末

21(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

スマホランディングページ
一般理論モデル22

一般理論モデル（机上の論理）
前提条件
ＰＣとの比較
スマホでのキーワード検索結果からの流入

本来、スマホのコンバージョン率はＰＣよりも良くて当たり前！
スマホＰＣ

１ シングルウィンドウで比較しにくい

マルチウインドウで比較しやすい

検索結果のファーストビューのサ
イト数＝２～３

検索結果のファーストビューのサイ
ト数＝最低でも８～１０位上

２語以上の複合キーワードでの検３ 索がＰＣよりも多い＝コンバージョン率高め

ビッグキーワードの単語検索が依然多い

４ クリック単価低め

クリック単価高め

２※２００７年～のガラケーの理論と原則同じ
23(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

８３24(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

スマホは２語以上複合キーワードが多い

2014/9/26

25(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

手指の構造の問題

2014/9/26

26(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

ではなぜスマホサイトのコンバージョン率は悪くなるのか？
→会員制度５００社のパターンを研究しました→コンバージョン率がＰＣよりもすごく悪い例（間違いは何か？）を徹底分析しました→ランディングページの極意「改善する」のではなく、「間違いを避ける」

27(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

「勝ちに不思議の勝ちあり、負けに不思議の負けなし」～松浦静山の剣術書『剣談』

2014/9/26

28(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

ＰＣサイトをスマホで見せると反応が下がる４つのポイント

29

ＰＣサイトをスマホで見せると反応が下がる４つの理由
ＰＣサイトをスマホで見せて何が悪いのか？
1. スマホで見えないコンテンツがある（フラッシュのコンテンツ、メニューなど）
2. 画像が見えない、文字が読めない、読みにくい（ピッチ拡大しても）
3. 電話できない（と思われてしまう）
4. フォームに入力しにくい30(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

スマホで見えないコンテンツがある

2014/9/26

31(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

読みにくい（ピッチ拡大しても）2014/9/26

32(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

読みにくい（ピッチ拡大しても）←拡大ピッチすると途中で文字が切れる

2014/9/26

33(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

電話できない（と思われてしまう）

2014/9/26

34(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

フォームに入力しにくい

2014/9/26

35(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

スマホサイトにしてもむしろ反応が悪化する６パターン

36

スマホサイトにしてもむしろ反応が悪化する６パターン
1.
2.
3.
4.
5.
6.

ＰＣサイトへそうとする自信のなさ
途中でＰＣページになってしまう
ページトップに正方形のボタンだらけ
フォームがスマホ化されていない（むしろ逆のほうがマシ）
ページ遷移が多い
そもそもやる気が感じられない

37(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

ＰＣサイトへ飛ばそうとする自信のなさ（最悪）2014/9/26

38(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

ＰＣサイトへ飛ばそうとする自信のなさ

2014/9/26

39(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

途中でＰＣページになってしまう

中途半端はコンバージョン率を徹底して落としてしまう

2014/9/26

40(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

ページトップに正方形のボタンだらけ

2014/9/26

41(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

ページ遷移が多い
この程度のコンテンツならアコーディオンで2014/9/26

42(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

やる気が感じられない

ヤル気のなさが伝わると・・・

2014/9/26

43(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

これさえやっとけば！

売れるスマホランディングページ
６つのポイント44

売れるスマホランディングページ ６つのポイント
1.
2.
3.
4.
5.
6.

かなり縦長のページ（ページ遷移が極力少ない）
バナーボタンの多用
固定ヘッダー（フッダー）
徹底した軽量化
最後を詰めるスマホ向けフォーム（カート）
売れる雛形

45
(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

１，超縦長はスマホユーザーにまったく問題ない
スクロール

46
(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

１，かなり縦長のページ（ページ遷移が極力少ない）
ＰＣサイト（ページ数８）
トップページ
会社概要
メニュー
お客様の声
予約状況
料金表
お役立ち情報申込フォームスマホサイト（ページ数２）• トップページ– 会社概要– メニュー– お客様の声– 予約状況
– 料金表– お役立ち情報• 申込フォーム

47(C) Copyright 2011 Keyword Marketing Research Institute Inc. All rights reserved. No reproduction without written permission.

２，バナーボタンの多用
どこでもスマホは使えるため、片手で操作するケースがある
片手に「つり革」「飲み物や食べ物」「鞄」「傘」など、何かを持っていると、手が離せないため片手でスマホを操作する

2014/9/26

48

２，独特のインターフェース
片手でスマホを操作すると、親指の届かない位置にあるボタンは押せない
ダメな例

左手で片手操作していたら、右上のボタンに指が届かない…

2014/9/26

49

２，バナーボタンの多用
どちらの片手でも操作できるインターフェイスを採用

ボタンを横長にすることで、どちらの手で操作しても親指が届くように設計
また、ボタンへのヒット面積も大きくなる
ことで押しやすくなる

2014/9/26

50

３，固定ヘッダー（フッダー）
スマホはコンテンツが長くなる
スマホの横幅が狭いため、1行に入る文字数が少ない。
そのため、文章の改行数が増えてコンテンツが長くなる

コンテンツコンテンツコンテンツコンテンツコンテンツ

コンテンツコンテンツコン
テンツコンテンツコンテン
ツ

横幅が狭い

2014/9/26

51

３，固定ヘッダー（フッダー）
コンテンツが長くなることで、レスポンスデバイス（申込みボタン）が遠ざかる
スクロール

やっと問い合わせができる…
レスポンスデバイス
2014/9/26

52

３，固定ヘッダー（フッダー）
固定ヘッダーで、常にレスポンスデバイスを表示するヘッダが画面内に残り続けますスクロール

2014/9/26

53

アプリのようにスマホサイトを使ってもらう

←４４
ピクセ
ルの奇跡

JavaScript
使用が最も安定する

2014/9/26

54

３，固定ヘッダー（フッダー）
スライドするサイドメニューを採用（例）サイドメニュー

メニューボタン

ボタンを押すことでメニューが展開

2014/9/26

55

４，徹底した軽量化
スマホサイトの表示速度が遅いと、離脱されてしまう
隙間時間に見ている→「あまり時間はない…」
他にもサイトはある→「よそに行ってしまう…」
とりあえず「5秒表示」を目標に設計する

2014/9/26

56

４，徹底した軽量化
データの重さとは、画像やファイルの容量のこと

400KB

2014/9/26

400KB

500KB

2MB

1.5MB

1.5MB

57

４，徹底した軽量化
通信回数とは、サーバーとやりとりする回数のこと
通信回数
スマホからサイトへアクセス

ユーザー
Index.htmlを送ってください

httpリクエスト
httpレスポンス

top.jpgを送ってください

main.jpgを送ってください

サーバー
OK。要求データを送ります

OK。要求データを送ります

OK。要求データを送ります

サイトを表示データの重さと読み込み回数が多くなるほど、表示は遅くなる※一度に同時接続してデータやり取りできる数は6つ
2014/9/26

58

４，徹底した軽量化
画像をあまり使わない（CSS ）取り組み例（例）エクセルオンライン講座サイト

CSSソース2014/9/26

59

４，徹底した軽量化
読み込む画像数を減らす（CSSスプライト）

複数の箇所で使用するアイコンを配置した1枚の画像を用意
CSSで、この箇所のみを表示する

CSSを使い、指定した個所のみをサイト上で表示して他のアイコンを隠す。同じような方法で、他のアイコンも表示することができる。複数のアイコンを1枚の画像で表示することが出来るため、1枚の画像のダウンロードのみで済み通信回数が減るので、表示速度が早くなる。

2014/9/26

60

４，徹底した軽量化
読み込む画像数を減らす（CSSスプライト）取り組み例（例）医療レーザー脱毛サイト

2014/9/26

61

５，最後を詰めるスマホ向けフォーム（カート）
ボタンや枠が大きく入力しやすい申込みフォーム（例）
入力しやすくするために入力箇所を大きく、ボタンを押しやすく、選択肢はわ
かりやすくして、入力項目数も必要最低限に絞ってる

2014/9/26

62

５，最後を詰めるスマホ向けフォーム（カート）
選択した入力項目ごとに操作パネルが変わる（必須）（変わらないスマホサイト５割以上）
（例）

キーボード

テンキー

フリック入力※ＷＥＢ制作会社さんやＳＯＨＯのコーダーさんに、「こうしてくれ」といえばす2014/9/26
ぐやってくれます63

６．売れるスマホページのファーストビュー雛形 １）
４４ピク
セル
コンバージョ
ン率アップ
ほぼ１００％

設計思想＝「今すぐ客」と「そのうち客」両方を取る

ロゴ サイト名＜三メインイメージＩ＞

メニューへのリン
クボタン
反応装置ボタン：最大３つ（推奨２つ）
電話、申込フォームリ
ンク他

キャッチコピー
サブキャッチ
サイト概要orソーシャルエビデンス
３～５の特徴or

２ステップビジネス
or
単品～数点の物販問題提起
2014/9/26

64

特別な難しさ：商品点数８０以上の中小物販サイト•

独特の難しさ••システムとの統合問題
すべての商品を縦長スマホ専用サイト化が難しい（☓８０の労力）• 解決策方針•••

2014/9/26

基本はシステム統合で自動表示
売れ筋１０～１５点の重点商品のみ手動スマホサイト化
検索キーワードとランディングページの設定

65

成功を加速させる方法

66

スマホサイトにＰＣサイトへのリンクは必要か？

ソニー スマホサイト

2014/9/26

ユニクロ スマホサイト

67

スマホサイトにＰＣサイトへのリンクは不要か？

コンバージョンを目的としたスマホ専用サイトの場合・・・
1. ＰＣサイトへの誘導ボタンがあると覚悟が決まらない
2. いっそＰＣサイトへの誘導ボタンをカットする
3. スマホページだけでコンバージョンさせる執念を燃やす
4. 情熱と愛が最後に勝つ

2014/9/26

68

ＳＥＯへの応用
コンテンツページ
苔の研究
セリング（売りっ気強）ページにしなけ
ればコン
バージョン
率は決して上昇しない

コンテンツページ
日本の究極の秘境スポット

コンテンツページ
もののけ姫ファンサイト

2014/9/26

69

お役立ちアプリ・サイトのご紹介【スマホプレビューアプリ】
Mobilizer
・PCでスマホ表示のプレビューが可能なアプリ
http://www.springbox.com/mobilizer/【スマホサイトチェック（有料サービス）】
Remote TestKit
・クラウドサービスで複数端末環境での動作チェックが可能
http://appkitbox.com/testkit【画像圧縮】
JPEGmini
・jpg画像を圧縮するサイト
http://www.jpegmini.com/main/shrink_photo?test_cookie=1

Shrink PNG files
・png画像を圧縮するサイト
http://tinypng.org/【データ変換】
画像ファイルのBase64エンコード
・画像をエンコードして文字列に置き換えるサイト
http://www.crystal-creation.com/web-appli/image/base64/

2014/9/26

70

みんなで知恵を出し合いましょう• 正解はない• いいとこ取りでオリジナルを

2014/9/26

71

ご静聴ありがとうございました。

2014/9/26

72