WirelessWire News Technology to implement the future

by Category

なぜ、あの会社のモバイルサイトは、すばらしいと言われるのか?〜表示スピードという性能

2014.09.16

Updated by MobileLab on September 16, 2014, 10:00 am JST

201409121530-1.jpg

モバイルサイトで重要なのは、ブランディング?

ようやくスマホ用に最適なサイトが必要だということが認知されるようになってきました。なにしろBtoCでは、モバイルアクセスのほうがPCアクセスを上回ってしまったのですから、なおさらです。

ところで、モバイルサイトを構築する場合に、求められるべき性能とはいったいなんでしょうか? ほとんどのWeb担当者がまず考えてしまうのが「スマホ用のデザイン」です。とにかく見た目をスマホに最適化させたいというゴールです。PCサイトでも腐心したように、モバイルサイトでもブランディングは重要です。デザインにはこだわりたいところです。

デザインが重要だという落とし穴

ところが、こうして作られてしまうのが、画像をふんだんにつかった重量級のデザインです。画像だけではありせん。スライド表示の「フリックスライド」や「ドロップダウンメニュー」などの最新技術を、Web制作会社はしっかり売り込んできます。そして、こうした要望や最新技術を取り込むと、ファイル容量が大きく、表示が非常に遅いモバイルサイトが誕生してしまいます。

モバイルサイトなのに、ファイル容量が3MB、5MB、なかには8MBもするサイトがゴロゴロあったりします。おおよそモバイルサイトのファイル容量目標値が500K前後だと考えると、これは明らかに容量オーバーです。ちなみに、Amazonのモバイル用サイトは、どれくらいの容量で作られているでしょうか? どのページも 100KB〜200KBで作られています。だからAmazonのサイトは、極めて速く表示されるのです。

もっともWeb担当者の気持ちも分からないではありません。なにしろ、PCサイトの世界ではファイル容量や表示スピードなどは、ほとんど考慮されていなかったのですから。

なぜ、速く表示されることが重要なのか?

日本ではあまり認知されてきませんでしたが、Webサイトのパフォーマンス(サイト表示のスピードや反応速度)は極めて大事です。ネット企業の各社がこんな発表をしています。

・57%のユーザーは、サイトの表示に3秒以上かかるとサイトを離脱してしまう。5秒以上かかると74%の人が離脱する。(Google)

・サイトの表示速度が0.1秒遅くなると、売上が1%下がってしまう。(Amazon.com)

・サイトの表示速度が0.4秒遅くなると、トラフィックが5〜9%下がってしまう。(yahoo.com)

・ページの読み込みが1秒遅くなると、コンバージョンは7%落ち、ページビューは11%落ち、ユーザー満足度は16%低下する。(Strange Loop)

とくに有名なのは、2006年に発表されたAmazonの減衰率です。これはレコメンドエンジンの開発者だったグレッグ・リンデン氏が、A/Bテストにおいて1/100秒単位で遅延を作りだして導いたデータです。逆にいうと、表示スピードは速ければ速いほどコンバージョンや売上げに結び付くと言い切ることができます。

201409121530-2.jpg

モバイル環境下では、スピードが安定しない

2つめの問題は「すでに日本のモバイル環境は速い」という誤解です。確かに日本のモバイル環境は4G(LTE)が整備されてきていますが、それは条件のいいところでの性能です。

駅のホームや商店街の中、都心のターミナルや、逆に郊外の電波の弱いところなど、条件によっては極めてつながりにくく、表示が遅くなる場合がでてきたりします。

これらはパケットドロップなど、モバイル特有のつながりにくさの現象が原因ですが、これらのマイナス状態を回避する方法の1つが、モバイルサイトのファイル容量を軽くすることです。Amazonが実行している超軽量のモバイルサイトの秘密がここにあります。

超軽量にモバイルサイトを作ることにより、モバイル環境でのつながりやすさを実現し、訪問者数、ページビューを上げ、コンバージョン率のアップを環境的に生み出しているのです。

PCサイト以上に、モバイルでは、つながりやすさ、表示スピードをあげていくことが重要になってきます。

ページスピードインサイトを使って、表示速度を測ってみよう

さて、ここまで来たら、Web担当者としては、自社のモバイルサイトのスピードを測ってみることです。最適なのはGoogleが提供している「PageSpeed insights」です。

「PageSpeed insights」
http://developers.google.com/speed/pagespeed/insights/

201409121530-3.jpg

このサイトは、モバイルとPCの両方のページスピードを測定し、モバイルサイトのUXを評価してくれます。また、サイトの改善ポイントを指摘してもらうこともできます。ページスピードの目標値は60/100以上です。

ちなみに、ECサイトトップ300を測ったところ、60以上のサイトはわずか40サイトです。トップはAmazon.co.jpの96/100。ヨドバシカメラの73/100などが極めて優秀なサイトです。逆に50を下回る表示の遅いサイトが130もありました。これらは明らかに表示スピードによって売上げの機会損失となっているに間違いありません。(なお、スマホ未対応は66サイト(!)もあり、こちらはスピード計測対象外としています)

▼ECトップ300のスピード評価(株式会社ドーモ調査 2014年7月)
※速い60/100以上 普通50~59/100 遅い49/100以下
201409121530-4.jpg

モバイルサイトを作る上で、見た目のデザイン以上に大事なのは、表示スピードです。これは以外にも盲点であり、多くのWeb担当者が最初のモバイルサイト構築時には忘れがちなことなので、特に注意をしてみてください。また、このほかにもOne Web(1URL+1HTMLの構造)、Webの構造化・正規表現、モバイルファーストでの設計など、大事なことはたくさんあります。これらをトータルに設計していくことが重要です。

〈文:株式会社ドーモ 占部雅一〉

【この記事を最後まで読んだ方におすすめの記事】
重いサイト...どうスマホ表示させる? 8つのテクニック

WirelessWire Weekly

おすすめ記事と編集部のお知らせをお送りします。(毎週月曜日配信)

登録はこちら

MobileLab(モバイルラボ)

株式会社ドーモによる「マルチデバイスを考え続ける情報サイト」。スマホやタブレットのサイト制作に関する記事を配信中。このコーナーでは、モバイルラボに掲載された中から、WirelessWire News編集部が選んだ記事をご紹介します。