モバイルサイト構築の大誤解！

i メディアをもっと面白く！

スマートフォンサイト
対応の大誤解！

Copyright © 2014 DOMO.INC All Rights Reserved.

1


モビファイ

マルチスクリーン対応のための信頼のサービス

Googleのマルチスクリーン
アプルーブド･ベンダー」に認定
「アプルーブド･
モビファイは、米Googleによる「アプルーブド･ベンダー」に認
定されています。Googleはレスポンシブウェブデザインをマルチ
スクリーン時代の推奨Webとしていますが、モビファイはレスポ
ンシブウェブデザインと同じ状態をJavaScript適合で実現します
。結果、SEO対策、ソーシャルシェア、アクセス解析においても
理想的なWeb環境を作り出します。

米フォレスター･リサーチ：レポート

モバイルEコマースのトップベンダー10社の
中で、Web部門において最高得点を獲得
米フォレスター･リサーチは、2013年12月27日、今後のEコマー
ス・リテイラーの用途や目的にかなうトップモバイルベンダー10社
の評価を発表しました。このモバイルWeb部門において、モビファ
イ社は全10社の中でもっとも高い評価ポイント（5.0point）を獲得
しました。

Mobile Web部門
部門
5点満点
点満点


マルチスクリーン時代へ
モバイルの波は今後…
モバイルの波は今後…
スマートフォンからタブレットへ

さらにマルチスクリーンへ
ポータル革命

1995～
～

サーチエンジン革命

2000～
～

ソーシャル革命

2010～
～

マルチスクリーン革命

2014～
～

マルチスクリーン革命が必ず来る！

3


大誤解１

日本はモバイルの先進国だ


4


2012年スマートフォン普及率

←後進国？
後進国？


5


数字で見るモバイル時代
• アメリカでは普及率はすでに５８％に到達
（出展: comScore）

12億人以上がモバイルからWEBアクセスをしています。
（出展: Trinity Digital Marketing）

• 日本の保有率 45.6％（博報堂DY）
• スマートフォン（多機能携帯電話）の２０１２年末の世
帯普及率が４９・５％と前年末（２９・３％）から大きく伸
び、世帯のほぼ半数に達した（出展:総務省）
• Eメールのうち25.85% はモバイルで開封され、10.16%
はタブレットで開封されます。（出展: Knotice ４６％）

6


私たちがここ数年で感じる数字
•
•
•
•
•

ガラケーを問う人 2012年春に絶滅！
PCが残るという人 40-50代の男性か？
女性の普及率が 40％を超え始めてきている。
ファーストフードでは８０％越えもでてきた
スマートフォンの滞在時間が非常に長い

• シニア層のタブレット利用が２０％を越えはじめ
てきた。


7


大誤解２
まずは、スマートフォン対応だ。
まだタブレットは少ない！


8


iPad対応も時間の問題です。
2012年のモバイルコマースの売上高は前年比81%増の約250億ドル
約250億ドル、また2013年は前年比55.7%
億ドル
増の384億ドル
384億ドル
384億ドルに達すると予測。eコマース総売上高の中でモバイルコマースの占める割合も、
2012年が11%
11%で、2013年が15%
15%と増え続けています。注目はモバイルデバイス別の売上高で
11%
15%
2012年には、タブレットによる売上げは、スマートフォンの売上げを追い越し、さらにその差は広
がっていくと予測されています。今後のモバイルコマースを牽引するのはタブレットであり、日本
でも、PCに置き換わる利用が見込まれています。 eMarketer調査


9


モバイル最適化とは？
2012年以前
＝
スマートフォン対応のみ
2013年
＝
＝
＝

スマートフォン対応
タブレット10inch
タブレット 7inch

スマホ対応から、
マルチスクリーン時代へ

10


スマホ対応だけの問題ではない！

By Brad Frost

11


大誤解３

アンドロイド躍進。
iOSを塗り替えていく！


12


iPhone、iPadとiPodユーザーが
全体の85%を占めている
Mobify社調査
主要20のモバイルウェブ
サイトからデータを集めた
ものです。2012年にこれら
サイトは、合計
560,792,165人(約5.6億人）
から閲覧されており、この
数字は世界人口の約8%、
総計３0億個のウェブを閲
覧した人たちに相当。


13


もっとも利用が高いデバイスで
最適なWEBを考えるべき
最適な
を考えるべき
デバイス上位10位（ユニークユーザー）
iPhone
61.6%
iPad 17.1%
Unknown
8.6%
Sony Ericsson Xperia Arc
4.7%
iPod Touch
4.6%
Samsung Galaxy S II
0.9%
Motorola Droid X
0.9%
HTC Incredible
0.5%
HTC Incredible 2
0.5%
Samsung Galaxy Nexus
0.1%

85%が
アップル製品

14


つまり、
・注力すべきは、アップル製品である。
個々のアンドロイド端末は

１％にも満たない。
・iPhoneだけでなく、iPadへの対応は不可欠
・解決策として、
検証はコスト高。アプリのように割り切る
各機種対応を改める必要がある

15


大誤解４
これからもずっと
PC中心に
Webリニューアルがいい


16


「モバイルファースト」を提唱したLuke Wroblewski氏

Luke Wroblewski ルーク・ウロブルスキー
プロダクトの戦略や製品のデザインのコンサルタント会社「LukeW Ideation & Design」のデザイナー兼設立
者。
実績は素晴らしく、Twitterに買収された「Bag Check」のCTO、Yahoo！USAのチーフアーキテクトとしてマル
チデバイス向けの商品開発、eBayのユーザーインターフェイスデザイナーとして「eBay Express」のリリース
など様々な企業での役職を経験し、現場で活躍している ”できるデザイナー” として世界的に有名です。
さらには、Interaction Design Association（IxDA）はボードメンバーであり共同設立者の一人です。その実力
から世界初のグラフィカルがブラウザが生まれたイリノイ州立大学でインターフェイスデザインの教授として
教鞭をとっています。著書には「モバイルファースト」と「Web Form Design」がある。
著書
「 Mobile First 」
「 Web Form Design & Site-Seeing 」
「 A Visual Approach to Web Usability 」

17


「モバイルファースト」を
推進する理由
成長するモバイル市場をターゲットにできる。
モバイルのマーケットは、拡大しています。Google Map の利用者は40%がすでに
モバイルからです。また、シーズンによっては50%以上がモバイルからGoogle Map を
利用しています。そのモバイルの市場自体は、大きく成長しており2012年にはモバイ
ルの市場はデスクトップ市場を超えると予測されています。

コンテンツフォーカスできること。
モバイルのスクリーンは表示できるサイズが限られています。それゆえ不要なコン
テンツは表示せず必要なコンテンツだけを表示します。「モバイルファースト」を推し進
めることで重要で必要なコンテンツが浮き出ます。

モバイルの様々な機能を利用する発想を得ること。
モバイルには様々な機能が備えられています。例えば、GPS、加速度センサー、オリ
エンテーションなどの機能があります。モバイルを最初に開発することは、デスクトップ
にはない、モバイル固有の機能を利用したアプリケーション開発を意味することでもあ
ります。

18



19


大誤解５
専用サイトをスクラッチで
構築すれば、面倒ではないし、

安く、早くできる？


20


校正作業をできますか？


21


運用コストの削減

ワンソース・マルチデバイス

22


大誤解６

モバイルのサイトは
専用の別サイトで作る


23


OneWeb以外では、領域が異なる
SEO
PC

メールリンク

領域B
領域A

m.yourdomain.co.jp
yourdomain.co.jp/SP/

領域
領域C
スマート
フォン
タブレットの場合も

yourdomain.co.jp/T/
t.yourdomain.co.jp

24


●領域が変わると、リンクが異なる。ランディン
グページが別になる。
●スクラッチやプロキシーソリューションでは、
計測がしにくくなる。つまり…各デバイス間にお
けるユーザー遷移がわかりにくくなる。
デジタルメディアは、「計測できるからこそ価値
がある」。ーーComscore
WEBの問題ではなく、事業戦略の問題だ。

25


レスポンシブウェブデザイン


26


なぜ、OneWebが必要か？
が必要か？
なぜ、
グーグル、スマホ対応が不適切な
サイトの検索順位を引き下げへ

Googleは、リダイレクト設定の間違った例としてこの例を紹介している。Googleは、
この設定がモバイル端末でウェブサイトを閲覧しているユーザーにとってわずら
わしいものだと述べた。このような設定では、そのウェブサイトは、モバイル検索
結果での表示順序が下がることになる。
出展：Google

27


結論
マルチスクリーン時代は

One Web
でなければならない

28


マルチスクリーン対応で、さらに絞られる
レスポンシブ
プラグイン対応

携帯コンバート

スクラッチ構築


デザイン

最適化サービス

簡易コンバート
自動変換や
プロキシーソリューション

CMS
サーバーサイド
テンプレート調整

HTML5？

29


大誤解７
LTEの時代だから、
表示スピードは気にしなくていい


30


離脱が起こる

スマートフォンの表示時間に
5秒以上かかると、７４％が
離脱する。 By Google


31


アマゾン発表 amazon
0.1秒ごとに１％のコンバージョンロス発生


32


ページロードに

1秒遅れると・・・・・

７％

11％

16％

のコンバージョン
が減少

のページビュー
減少

のユーザー満足
度の減少

もし金額におきかえると、

1日1000万円を売り上げているEコマースリテイラーの場合、年間で
算出すると、

2億5000万円の売上損失となる。


33


大誤解８
とりあえずマートフォンサイトの
デザインをすればいい。


34



35


UIの改善で
効果がUP!

36


ポイント
• 柔軟なデザイン再現性はあるか？
• UI/UXデザインを高められるか？
→多くのソリューションでは、融通性が
きかないケースが多い

37


大誤解９

タブレット専用デザインは、
まだ時期尚早だ


38


タブレットも１５％が保有

総務省調査
タブレット型端末の普及率は前年末の８・５％から
１５・３％に上昇。パソコンは７７・４％から７５・８％
１５・３％
に微減となった。

■タブレットに適している対象
子供用
主婦層・女性層
シニア層


勉強・ホビー
料理、ショッピング
趣味、株トレード

39


国内実績

タブレットデザインの意味

4～5inch

ポートレート表示

確実にコンバージョンがアップ！
7inch

9.7inch

ランドスケープ表示

40


やってはいけないこと
×スクラッチでの専用サイト構築
×プロキシーソリューションでのサイト構築
×リダイレクト


41


マルチスクリーン対応
とは？

• One Web 同一
同一URL
• ワンソース・マルチ
デバイス
• 高速ローディング表
示
• デザイン再現性
UI/UX
• タブレット対応

42


Mobifyは米
は米Googleが認定した
が認定した
は米
が認定
マルチスクリーンベンダーです。
http://www.google.com/think/mult
iscreen/vendors.html


株式会社ドーモ
モバイル事業部
東京都中央区築地2-11-26
築地MKビル
TEL：03-6228-4616
今井・西村・山崎
43

モバイルサイト構築の大誤解！

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Ähnlich wie モバイルサイト構築の大誤解！

Ähnlich wie モバイルサイト構築の大誤解！ (20)

Kürzlich hochgeladen

Kürzlich hochgeladen (10)

モバイルサイト構築の大誤解！