マルチスクリーン時代のモバイルサイト構築方法～Googleのルールにかなう方法～

マルチスクリーン時代のモバイルサイト構築方法～Googleのルールにかなう方法～
1
Copyright © 2014 DOMO.INC All Rights Reserved.

ゴールは、確かなモバイルサイトを持つことで、貴社ビジネスを成功させること。売上を上げ、運用をラクにする。だから、表示だけの適合策ではなく、効果の上がる最適化策へ。
2

マルチスクリーンウェブ
大切な要素は？
Webの構造化
モバイルファースト（リニューアル）
One Web
表示スピード
最適表示
適合のみ→
最適化

4
１．モバイルサイトなし
２．モバイルサイトあり
Q１. 検索結果で、どちらのサイトが上位に表示されるでしょうか？

5
Q２. 検索結果で、どちらのサイトが上位に表示されるでしょうか？
１．表示が速い
２．表示が遅い

6
Q3. 競合他社に勝つためには、どの方法でモバイル対応を行うのがいいでしょうか？
１．スクラッチで専用サイト２．プロキシーソリューション３．レスポンシブウエッブデザイン４．サーバーサイドテンプレート調整

7
Q４. 競合他社に勝つためには、 WEBの構造はどちらがいいでしょうか？
１．構造化されていないサイト
２．構造化されたサイト

モバイルWebの高速化～モバイル環境は速くない
8
Lesson １

生活シーンの中では、接触ポイントは、モバイルが中心です。
大切なのはスピード！

10
データ：高速化によるメリット・Google発表表示速度が0.5秒遅くなると、検索数が20%減少。表示時間に５秒以上かかると74％のユーザーが離脱します。・Yahoo発表表示速度が0.4秒遅くなると検索結果閲覧が5-9% 減少します。・DOMO：滞在時間が50％増。40秒から60秒に拡大（食品メーカー：当社実績）

amazon
11
【アマゾン発表】ページ表示の遅れは
0.1秒ごとに１％のコンバージョンロス
AmazonのGreg Linden発表（リコメンドエンジンを開発）

米Strange loop発表： 1秒遅れると、７％のコンバージョンロス
７％
のコンバージョンが減少
11％のページビュー減少
16％
のユーザー満足度の減少

リサイズのイメージ人力では不可能な作業です

モバイルSEO Googleの検索レギュレーションについて 2013年6月マット・カッツ氏発表
14
Lesson２

レスポンシブウェブデザインとは？
15
スマホ
タブレット
デスクトップ
グリッドが変わることが大事ではありません。

大切なこと
16
One Web（ワンウェブ） =１つのURL ＆１つのHTML

ランディング領域が異なる問題。
17
領域B
yourdomain.co.jp/sp/
m.yourdomain.co.jp
領域A
領域C
t.yourdomain.co.jp yourdomain.co.jp/T/
www.yourdomain.co.jp/
PC
スマートフォン
タブレット
Googleのクローラーが複数必要になる
「Mobify」の特長②

２つの領域を別々にクローラーする。
SEO対策
検索結果に表示されたページにたどりつけない。
領域B
モバイル
領域A
PC

19
異なるスクリーンで表示崩れが発生する。
１．離脱が起きる２．ページビューが減少する３．ユーザーロイヤリティが下がる
Share
いいね！
ソーシャルシェア＆メールリンク
領域B
領域A
モバイル
PC

やってはいけない構築方法
× スクラッチで別サイト
例：www.domain.co.jp/sp/
× プロキシ変換
例：sp.domain.co.jp/
20

21
CMS+テンプレート調整
プロキシーソリューション
専用サイト・スクラッチ制作
レスポンシブウェブデザイン
推奨する
推奨しない
適合化
最適化
2013年6月～

アクセス解析の本当の目的とは？
「お客の行動を描き出すことが重要」
・デバイスごとのユーザーの行動把握
・複数チャンネルへのユーザー遷移の把握
・オフライン施策との連携
・外部の顧客データベースとの連係
・ユーザーのライフタイムバリュー（LTV）を知る
（大内範行氏・グーグル株式会社 Googleアナリティクス・ソリューションコンサルタント）

23
「デジタルメディアは、
計測できからこそ価値がある」
従来のメディアではできなかったことが、デジタルメディアにはできます。アクセス解析から多くを見つけ出していますが、計測できなければそれは意味がありません。
（前：コムスコア日本代表・前川洋輔氏）
デジタルメディアの価値

24
One Web
以外では？
アクセス解析が手間
時間、手間ヒマ、分析、スピーディさ
GAの設定がしにくい。みえにくい
クッキーの解析ツールでは、設置が難しい
できたとしても、フィルタをかけてのデータ整理、設定変更に困難が伴う
ドリルダウン的な分析は不可能
マルチスクリーンでは不可能
リダイレクションによるリファラー不明
リファラーが不確かになる
メールのリンクで正しく表示されない
ソーシャルシェアで正しく表示されない
PV数が余計に増える
サイト内の遷移が不確かになる
エンハンスドキャンペーンに向かない
モバイルとPCがひとつのキャンペーンとなる
複数のランディングページは無駄
Googleはレスポンシブデザインを推奨
破綻しやすい
リダイレクションのリンク切れ
人為的な処理によるミスが多くなる
ユニーバーサルアナリティクスがやりにくい
デバイス間のユーザー把握
ユーザー特定のID が必要
マルチドメインに対応してなくてもいい
DSP/SSPなど、ワンウエブは不可欠
監修：江尻俊章
（株）環：アクセス解析コンサルタント
アクセス解析での問題

25
・レスポンシブウェブデザインは、サイト管理の資源だけでなく、Googleのクローラーの資産も節約できる。・One Webだと、Googleのアルゴリズムがコンテンツに割り当てるインデックス資産が無駄にならない。・利用者がシェアしたり、リンクを張ったりしやすい。・リダイレクトが不要である。 →ユーザーエージェントを識別してリダイレクトさせる方法は、間違いが起こりやすく、ユーザーエクスペリエンスを低下させる。
Googleが「One Web」を推奨する理由

•スマホ＋タブレットなど、１つのHTMLでさまざまなデバイスに対応できる
○
×
レスポンシブウェブデザインの場合
26
•設計に手間がかかる
•コストがかかる
•表示スピードに時間がかかる
•UIの変更がしにくい
•オールドIEなどに未対応
•エラーが出やすい
•リニューアルが必要
適合化

適合化から最適化へ →表示、スピード、One Web、モバイルファースト、構造化…
求めるべきは、
モバイルマーケティングの最大化。

まだ「PCリニューアル」ですか？
28
Lesson３

PCリニューアル
デスクトップファーストでフルリニューアル（従来型）
テンプレートの削減とメンテナンス性の向上を目的
※タブレットを軸に
タブレットリニューアル

行動スタイルのモバイル優先とは？＝コンテンツと機能を同一化させる
•モバイルで必要なコンテンツとは？
–検索可能なコンテンツ
–交通アクセス情報
•モバイルで必要な機能
–検索
–カート決済
–音声検索
30

WEBの構造化（正規表現）が欠かせません
31
Lesson４

20年続いたPCサイト。あまりにも多すぎる「非構造化」状態…
32
スマホはともかく、タブレットサイトは不可能！

ウェブの構造化が必要
•テンプレートが増えすぎる
•制作・調整コストが上がってしまう
•エラーが起こりやすくなる
33
マシン・リーダブルな仕組みにする

マルチスクリーンにはWebの構造化が必要
34
サイト全体で共通する部分
ジャンルごとに共通する部分
ページ内で共通する部分
ページ内の個別要素
（今まで）
各ページごとに共通するルールが
設定されていない
マルチスクリーン対応での改修後
?
?
?
?

35
マルチスクリーンのための
新しいサイト作りが必要です
http;//www.domore.co.jp/mobify

マルチスクリーン時代のモバイルサイト構築方法～Googleのルールにかなう方法～

Recommended

Recommended

More Related Content

Similar to マルチスクリーン時代のモバイルサイト構築方法～Googleのルールにかなう方法～

Similar to マルチスクリーン時代のモバイルサイト構築方法～Googleのルールにかなう方法～ (20)

マルチスクリーン時代のモバイルサイト構築方法～Googleのルールにかなう方法～