PageSpeed Insights においてスコアを向上させたい。
BtoBビジネスを行っている企業の Webサイトであっても、スマートフォンでアクセスされることは当然想定されるようになってきている昨今。
新規 Webサイトを立ち上げる際に、レスポンシブwebデザインを採用するなどしてマルチデバイス対応を行うのが、当たり前になっています。
その中で、気になるのが表示スピード。Javascript や CSS などで動きを付けたり、きれいな画像をあしらったり・・・ PC では気にならなくとも、スマートフォンで読み込んでみると、イライラしてしまうこともあるでしょう。
Goole PageSpeed Insights を利用すれば、様々な示唆が得られますが、このツールは名称通り、表示速度を短縮するための調査と課題提示を主としています。
簡単なものから難しいものまで、発見される課題と解決策は多彩ですが、まずは「サーバーの応答時間」と「画像形式と画質」を検討することをお勧めします。
CSS、Javascript、キャッシュなどは、その後の更新性能を犠牲にすることがよくあるので、比較的手軽に対応可能ではあるものの、経験上の感覚的に、更新の手間を増やす傾向が強いと言えます。
一方、サーバの応答時間、画像周りは、ある程度の専門家が必要になりますが、一度見直してしまえば、その後の更新においても手間を増やすことが少なく、効果が失われにくいといえます。
特に、動的なCMS(代表的なのは WordPress)でサイトを構築している場合は、『サイト全体を CMS に管理させることが本当に必要なのか?』をよく考える必要があります。
詳しいことは割愛しますが、ページを読み込む毎に、CMS はプログラム(主に PHP)を稼働させ、データベースを参照します。単純な HTML や PHP プログラムを呼び出すのに比べて、遙かに時間がかかります。
CMS 自体の選定や、CMS に組み込むページを最小限に限定するなどを行い、サーバの応答にかかる時間を短縮できるかを、リニューアル等のタイミングでよく検討すべきです。
ちなみに、このサイトもコラム等に一部 CMS を用いていますが、サービス紹介周りはすべて CMS の管理外として扱っています。
そして、画像ですが、モニタの解像度からみて、表現として過剰(見た目的に何も変わらない)高精細な画像を使っていませんでしょうか?適度にカラーパレットを減色し、できれば PC版とスマートフォン版で読み込む画像を分けるなどの工夫をしましょう。
画像は一度処理を適切に行えば劣化することはありません。読込にかかる時間を短縮するというメリットだけを得ることができます。
読込スピードを上げて、閲覧者に快適な Webサイトを目指しましょう。もちろん、PageSpeed Insights のスコアも向上します。