2012年6月にGoogleが「Google がお勧めするスマートフォンに最適化されたウェブサイトの構築方法」を発表したことに伴い、ウェブサイトのモバイル対応は急速に進んでいる。2013年9月、日本の企業サイトの6割がすでにモバイル対応を完了しているというデータが電通ワンダーマンにより発表された（報道発表資料）。だが、モバイル対応の内実は「マルチスクリーン対応」には程遠いのが現状であることを、株式会社ドーモ 代表取締役CEO　占部雅一氏が指摘している。

同社は、「クラウド型One Web」をコンセプトに、PCサイトを元にするマルチスクリーン対応を提供するカナダの「Mobify」を、日本で展開しており、来る11月20日（水）、Mobify R&D Inc.CEOのイゴール ファレスキー氏の来日に合わせ、「「マルチスクリーン時代」に求められるWebサイトと北米最新情報」と題したセミナーを開催する。セミナーに先立ち、占部氏に国内のモバイル対応の現状と課題について聞いた。

日本国内の「モバイル対応」の6割はフルスクラッチ

マルチスクリーン対応ができていないときに一番問題となるのが、タブレットへの対応だ。初代iPadサイズの10インチであれば、PCの画面を縮小表示してもなんとかなったが、現在主流の7インチサイズでは小さすぎて文字が読みづらくなる。だからといって、5インチ台までのスマートフォンに最適化された画面を拡大しても間延びして使いにくく、タブレットの良さは活かせない。本当の意味でのマルチスクリーン対応の鍵となるのは、「7インチへの最適化」である。

そういう視点から見ると、日本の企業サイトの多くで完了したとされている「モバイル対応」は、マルチスクリーンに対応できていないようだ。株式会社ドーモが独自に国内大手企業のスマートフォンサイト389サイトを対象に調べた結果、その6割近くがフルスクラッチ（モバイル専用サイトを別途構築）による対応という実態が明らかになっている。次いで多いのがプロキシソリューションによる変換サービスだ。

▼国内大手企業のスマートフォンサイト（389サイト）のモバイル対応状況（提供：株式会社ドーモ）
（出典： One Web ワールド）

フルスクラッチでモバイル対応する場合、ソースは複数必要となり、原稿もデザインも別々に用意し、チェックする必要がある。7インチサイズに対応するためには、7インチに合わせたサイトを別途構築する必要があり。サイトガバナンスの点で問題がある。

また、プロキシソリューションの場合は、ソースは1つで運用できるにせよ、URLが別ドメインとなるため、SEO、SNSによるシェア、さらにアクセス解析に難点がある。筆者自身も「パソコンのブラウザでSNSでシェアされているページを見に行ったら、スマホ対応のとんでもなく巨大な文字と間延びしたテキストに、粗い画像が表示されて興ざめした」という経験をすることが、Facebookアプリがシェアに対応した最近では、特に増えている。商品の魅力を写真で伝えたいECサイトなどではかえって逆効果だろう。7インチのタブレット対応のプロキシを用意したところで、問題がさらに複雑になるだけだ。

レスポンシブデザインの問題点は「手間」と「重さ」

サイトのデザインそのものをレスポンシブ化した場合、これらの問題は回避できるので、マルチスクリーンに対応していると言える。しかしレスポンシブデザインの場合、「重い」「複雑でメンテナンスが難しい」という問題がある。

特に、重さの問題は深刻だ。レスポンシブデザインでは、ワンソースで全てのスクリーンサイズに対応するために、手元にあるデバイスにはソースやサイズの大きい画像もダウンロードするため、データのダウンロードそのものに時間がかかる。重いことは、表示するまでに時間がかかるということでもある。amazonのデータによれば、表示が0.1秒遅くなるごとに1％のコンバージョンロスが発生するという（参照情報）。

ユーザーの意識としても、最近のパケット定額制から通信量にキャップのついた料金体系にシフトしつつある中、「重いサイト」にはできるだけアクセスしたくないという傾向がある。もちろん、逼迫したモバイルネットワークにもあまりやさしくない。

マルチスクリーン対応の理想は「現在までのPCサイトの資産を活かしたまま、さまざまなサイズのスマートフォンやタブレットに最適化された高速な表示を実現する」ことだ。デザインとしては7インチ・3カラムへの対応を基本テンプレートとして、スマートフォン向けに1カラムに調整したバリエーションと、PC向けに横に拡張したテンプレートを準備し、ＯＳとスクリーンサイズに応じて出しわけることが必要になる。重さの問題を抜きにしても、レスポンシブデザインではPCサイトのデザインをレスポンシブ対応前提に作りかえる必要があり、その点でも負荷が高い。

ドーモが提供する「Mobify」は、クラウド型One Webソリューションとして、この課題に対するソリューションを提供している。ユニークな点は、mobify.jsというJavaScriptのコードをユーザーの端末上で動作させる（同社では「レンダリング」と呼んでいる）ことで、ダウンロードするデータ量の削減と高速化を実現していることだ。「従来は、モバイル変換といえば、iPhone用にリサイズしたキャッシュデータを、サイズの違うデバイスに向けて送出するものだったが、Mobifyのソリューションは、軽量化、最小化、キャッシュ化、に加えて、モバイルデバイスにキャッシュさせるなど本体のCPUパワーが高くなったことで、サーバー側でも連携して必要画像のロードのみを実現しています」（占部氏）という。

必要な準備は、PCのウェブの上部にmobify.jsというスクリプトを呼び出すコードを挿入することと、スマートフォンとタブレットそれぞれに対応するテンプレートを作成し、Mobifyクラウド上に置いておくことの2つ。スマートフォンやタブレットからPCサイトのURLにアクセスがあると、mobify.jsがデバイスのOSとデバイス名を判別し、クラウド上にある端末データベースと照合して適切なテンプレートを選択する。また同時に、クラウド側でソースコードから表示に不要な要素を削除する最適化を行い、画像は必要十分なサイズにリサイズすることで、ソースと画像の軽量化を行う。ユーザーが意識しなくても、mobify.jsが最適なデータをクラウド上から取得するので、受信するデータ量が少なくできる。一度誰かがアクセスしたコンテンツの最適化されたデータはMobifyのコンテンツデリバリネットワーク上のキャッシュに置かれるので、同じ端末からのアクセスはより高速化される。

占部氏によれば、国内企業のレスポンシブデザインサイトの8割が、Mobifyによるさらなる容量削減と表示の高速化が可能だという。

▼国内の代表的なレスポンシブデザインサイトの容量。Mobifyにより最適化することで、最大75％の容量削減が可能だという。（提供：株式会社ドーモ）
（出典：「 One Web ワールド」）

「タブレット対応」が無視できない北米の流れは日本にもやってくる

Mobifyの本拠地である北米ではタブレットの普及率が既に57％に達しており、特に女性ユーザーの多くがPCからタブレットへとシフトしている。モバイル対応とはスマートフォンだけでなくタブレットも視野に入れたマルチスクリーン対応であることが常識となりつつあるのだ。日本でもタブレット普及率は2014年には24％を超えるとみられており、早晩、マルチスクリーン対応を迫られることになるだろう。

「マルチスクリーン対応には"表示""One Web""スピード"の3つが大事だが、後ろの2つはまだ日本ではあまり意識されていない」と占部氏は言う。さらに、マルチスクリーン対応の先にはサイトガバナンスの問題がある。まずPCサイトありきで行われている制作を見直し、モバイルファースト、コンテンツファーストを軸にして、HTML記述の標準化やアクセス解析の見直しを進める必要がある。11月20日のセミナーでは、そうした話題も取り上げられる予定となっている。