モバイルの表示速度を上げるTips（SEO効果も）

ソフトバンク・au・ドコモの方は、公式のオンラインショップを利用すれば頭金不要で通常のショップよりお得に購入できます。

2016年7月にThink Googleにページスピードの記事が載っていたので、３年前から言われていたことですが、改めて復習してみたいと思います。

自社サイトのページ速度を計測する

Think Google Tool（Test My Site）でURLを入力すると採点してくれます。これはPagespeed Insightの最新版ですね。

URL欄に入れると採点されます。

これに似た機能はGoogle Analytics（以下GA）にもあります。

GAのページ速度は定期的にサンプリングしてくれるので便利です。対策後もマメなチェックをしたい時に使えますね。

ここにも書かれていますが、シンプルに各読み込みの工程を小さくしていくことがコンバージョンに良い結果をもたらします。

不要なJavascript,CSS,HTMLなどを削除し、構造を簡略化することでページのロード時間を減らしましょう。

難しいように聞こえますが（実際本格的にやると難しいが）、呼び出しているファイルがテンプレートのまま、古いアニメーション用のJavascriptが残ってた、コメントアウトされた箇所、不要なCSSなどを削除する程度なら簡単にできるでしょう。

Googleの調査によるとコンバージョンしたサイトは画像数が19以内に収まり、コンバージョンしないサイトは39以上の画像があったことから、画像は少ないほど良いという結論になります。

画像は（圧縮率により）トータルの読み込み速度が最適化される可能性もあります。圧縮した状態の仕上がりを一度確認してみましょう。

Googleが利用しているのが小さなファイルを１ファイルにし、CSSスプライトで表示エリアを指定する方法です。

装飾のCSSやアニメーションのJavascriptなどは初期にレンダリングには必要のないファイルです。
HTMLの後方に配置することで、最初のレンダリングを高速化できます。

また「CSSに@import を利用しない」、「可能な限り同一ドメインにファイルを配置する」なども、重要な要素になります。

Data URLスキームで画像をHTMLに埋め込むことでHTMLは少し重くなりますが、画像がなくなるため、読み込み回数を減らせます。dataボリュームにもよりますが、画像を複数読み込むより、HTMLを読み込む方が、より早く表示されます。

File Not FoundやJavascriptエラーはロードの障害となります。可能なな限りエラーをなくしましょう。

全てを一気にやろうとすると、息切れしてしまうので、できることから少しづつ進めていくのが良いと思います。

改善ミスをして、むしろ遅くなったりしないようにテストは十分に行いましょう！