以前ブログの方でMobile Website Speed Testing Tool（モバイル ウェブサイト スピード テスティング ツール）についてご紹介しました。
上の画像は当サイトのモバイル表示速度の評価点数です。
あくまでツールの評価ですが、流石に57点は個人的にも納得できないので、今回は70点を目指して挑戦したいと思います。
誤解を避けるために先に言っておくと、「別にWixで作ったサイトの表示速度は特に遅くありません。」
サイトを表示する速度は、インターネット回線の通信速度や端末のスペックにも影響するのをお忘れなく
それでは早速、最適化のために行なった内容をご紹介していきます。
とりあえずモバイルサイトの画像を軽量化してみる
真っ先に思いついたのが画像の軽量化です。(かなり初歩的)
しかしながら、Wixのモバイルサイトは、プログラムでPCサイトのコンテンツをCSSで最適化しているので、モバイルサイトの画像のみ軽量化ということはできません。
なので、PCサイトの画像を軽量化することによって、モバイルサイトの画像も軽量化することができます。
とりあえず、モバイルサイト用の画像はどれくらいのサイズなのかを調べてみました。
元画像のサイズが194kb、モバイル用画像のサイズが158kb
うん。対して変わりませんね。と言うか全然軽いのでこの画像は問題なし
モバイルサイト上の画像のファイルサイズを調べてみた結果、どの画像もきちんとモバイル用にWix側でファイルサイズの最適化がされていました。
モバイルサイトのコンテンツを整理してみる
画像ファイルのサイズは関係ないと、いきなりつまずきましたが、今度はモバイルサイトのコンテンツを整理してみます。
整理といっても、単純に重要でないコンテンツはTOPページから消すといった方法です。
特に消すコンテンツは無かったので、ブログのフィード表示件数がやたら多かったのを少なくし、調節してみた結果
1点！！確かに上がったけど、ブログの表示件数を少なくしたのに対して、割に合わないといった感想です。
ファーストビューのコンテンツの表示を外部のJSやCSSで阻害してはならない
手詰まりか…と思っていたら、「MobileWebsiteSpeedTestingTool」の検証結果のページには、サイト表示速度を改善するヒントを教えてくれるページがあったことに気付きました。
そのページに、Eliminate render-blocking JavaScript and CSS in above-the-fold contentと、このサイトの速度改善に1番必要な改善が表示されていました。
適当に訳すと、「ファーストビューのコンテンツの表示を外部のJSやCSSで阻害してはならない」と書いてあります。
なるほど、そう言えばWixってAjaxとかでJS使ってるじゃんと思い、なら「モバイルサイトもJSで書き出しているから、モバイルサイトを開いた時に表示されるページをJSで処理する部分を少なくすればいいのでは」という発想に至りました。
この発想なら「ファーストビューのコンテンツの表示を外部のJSやCSSで阻害してはならない」を極めて少ない処理で行えます。
検証するためにモバイルTOPページの1番最初に表示されるページの、プログラム処理を多く行なっていると思われる部分を消してみました。
65点！！
やはり点数が上がりました。
Wixの仕様上やっぱりそういうことなんですね。
結論から言うと「モバイルサイト、PCサイトのTOPページにはあまりコンテンツを詰め込まない」のがWixでのサイト速度最適化に繋がるのではないかと思います。
実際のスマートフォンで見るユーザーの環境だったり、サーバーの通信速度、サイトを表示する端末のスペック、といったものに左右されます。
この記事では65点まで点数が上がりましたが、実際にスマートフォンでサイトを見てみると、表示速度の変化は体感できませんでした。
ちなみに、Wixのサポートにはモバイルサイトの表示速度の最適化を行なっているといった解答もあったので、今後サイトの表示速度がSEOの評価に大きな影響があったとしても、Wix側はしっかりと対応してくれるかと思います。
Comments