Googleは、簡単に利用できるいろいろな無料のチェックツールを提供しています。今回は、ページ表示のスピードに関するチェックをしてくれるPagespeed Insightのお話です。
利用の仕方は、表示をチェックしたいURLを入力して「分析ボタン」をクリックするだけ。しばらく待つと、チェック結果がレポートされます。
シンプルなインターフェース。URLを入力し、「分析」ボタンをクリック
1分も待たずに診断レポートが生成されます。モバイルでの表示と、デスクトップでの表示、2種類のレポートが行われます。今回は、本ブログ記事の中から1ページを診断にかけてみました。
レポートには、改善するためのポイントと対象が示されています。これらが無料でレポートされるというのは、本当に驚きですよね。
この中に、「画像を最適化する」という項目があります。ココが今回のポイントです。
結論からいうと、この項目は画像の表示サイズに適した画像を利用しているかどうか、を診断しています。小さなサムネイル画像の部分に、何倍も大きい画像を利用している、というような具合です。表示サイズに合わせた画像を利用することで、この項目は改善することが可能です。
今回診断対象としたページでは、比較をする部分の画像に、表示よりも大きな画像を利用しています。そのため、今回のチェックに引っかかっています。
画像のファイルサイズは診断されないので、軽量化はこのレポートからは判断できない
ファイル容量が大きい画像が、軽量化しているかどうかは判断されません。また、これは機械的に判断することも困難かもしれません。そのため、軽量化はこのレポートには含まれないので、しっかりと対策することが重要です。
実は、同じページで大きな画像を呼び出している場合は、大きな画像をサムネイル画像に利用するケースも存在します。これは、画像の呼び出しを1回にすることで、ダウンロードを減らす事ができるからです。サムネイル画像といえど、数KBや数0KBはありますし、PNGなどの重いデータにしている場合は、無視できない容量になることも多々あります。このあたりは、ケースバイケースですので、ページを作ってくれた方に聞いてみるのがよいと思います。