[PR] 大手アパレルECサイトが導入する月額1万円〜ファイル数無制限の画像軽量化ツール「LightFile」

Google Speed Updateで表示高速化しようと思ったら、まずは画像軽量化からはじめましょう

【注】情報が錯綜してるようですが、Googleの金谷さんがツイートしています。当初と違うことはないようです。

もう少し情報を集めたいと思います。

--2018/07/03追記ここまで

2018年7月から開始されるGoogle Speed Update、どうも当初と少し違うところが出てきているようです。日本国内でSEOな人として有名な方々が、こぞって以下の部分についてアルゴリズムが異なると情報発信しています、当初と同じく遅いサイトに限定して検索順位に影響があるとのことです。

この "Speed Update" (と私たちは呼んでいます)は、ユーザーに本当に遅い体験を提供しているようなページについてのみ影響し、ごくわずかな割合のクエリにしか影響しません。
Google ウェブマスターブログより引用

SEOとして、検索順位に影響がある?

当初「明らかに表示に時間がかかる場合のみ、検索順位に影響がある」という認識でした。しかし、表示速度が速ければ、プラスアルファの要因として用いられるような流れになっています。

上記の2つのサイトでは、それぞれ当初と少し違いがあるというようなニュアンスで伝えています。SEMリサーチの渡辺さんは、アイレップの渡辺さんだと思うのですが、ずっと昔からSEOの情報を発信されていますね。それこそHTML4.01以前からだと思うので、相当な経験値と知識力がある方だと思います。

上記の2サイトでも、「表示が速ければ上位表示される」ということではなく「著しく遅い場合に、検索順位に影響が出る」というようになっております。情報が変わっておりますので、ぜひご確認ください。

表示高速化は「かんたん」と「かんたんじゃない」がある

表示高速化は、いろいろとやることが多いものです。しかも範囲もとても広く、深い知識が必要になるものもあります。まだあまり表示高速専門家というのは確立されていませんが、アイデアマンズでは昨年から「表示高速化」をメインとした新規事業を展開しています。

導入がかんたんなもの

ここでは導入がかんたんなものを紹介していきます。ただし、システム構成や要件によってはかんたんじゃないケースも多くあります。あくまで参考としてチェックしてください。

2018-07-03-google-speed-update-01.png

画像最適化ツールの導入

CMS(コンテンツ・マネジメント・システム)のプラグインを入れれば終わるものや、Photoshopで画質を下げて上書きするなどすれば対応できます。自動化したい場合は、弊社のLightFileを使えば「わずか5分」で導入完了しちゃいます。

JPGの最適化は、LightFile Core | 画像の最適化でページ表示を高速に!

JPGの最適化は、LightFile Core | 画像の最適化でページ表示を高速に!

自動でJPEGファイルを容量削減し、表示の高速化/転送量の削減を実現します。

他にも、以下のサービスやツールを利用すると画像軽量化が可能です。

CDNの導入

静的なウェブサイトであれば、CDN(コンテンツ・デリバリー・ネットワーク)を入れましょう。これによりインフラ側の対応は完了します。CDNは専門家の知識が必要なケースが多いです。

トップページのカルーセル(スライダー)をやめる

日本企業のウェブサイトトップページは、カルーセルが導入されているケースが非常に多いです。カルーセルはDOM操作と呼ばれる描画を行うため、非常に動作が重くなります。カルーセルやめて、ビジュアルを作り変えましょう。

  • カルーセルをやめて、一枚絵にする
  • カルーセルをやめて、動画を流す(外部ストリーミングサーバを利用すること)

導入がかんたんじゃないもの

ここでは導入するときに開発が必要になったりするケースを説明します。これも当てはまらないケースもあると思うので、参考まで。

2018-07-03-google-speed-update-02.png

HTML/CSS/Javascriptのソースコードをファインチューン

画面に描画されるのは、ソースコードに書かれているとおりに表示がされます。その中でも、文書構造を表すHTML、装飾をつかさどるCSS、インタラクティブな操作やデータのやり取りなどをさまざまなことを行えるJavascriptは、表示速度に多くの影響を与えます。ファインチューンすれば、確実に高速化できます。

SQLのクエリを減らす

動的なサイトでは、データベースに情報を投げたり取り出したりして、ページの表示を行います。その場合、表示するときに「これ表示したい」とシステムに投げ、「じゃあ、これでよろしく」という感じで表示するものを渡す、というようになります。そのため、問い合わせする→回答する というセットがあり、このやり取りが多いと表示するまでに時間がかかります。DBにインデックスをもたせたり、パーシャルキャッシュを作ったりすれば、大幅に改善することが可能です。

AMP対応する

Google検索のみに影響ですが、AMP対応することで検索結果でタップされたページが高速表示されます。bingとかでは意味がありません。AMP対応はGoogle対応のひとつなので、検索エンジン対策としてはやるべきものだと思います。

最後に

いかがでしたでしょうか?Google Speed Updateに限らず高速化は進めるべきです。検索順位に影響があるとなるとちょっと優先順位が変わりそうです。表示高速化のタスクは非常に広範囲ですので、優先順位をつけて一歩一歩進めていくのがよいです。

リクエストはこちらから

前へ

月刊アイデアマンズブログ 2018年6月の人気ブログ記事は?MTDDC Meetup HOKKAIDO 2018と上場企業ウェブサイトのベンチマーク結果が人気!

次へ

Macだけでできる!画像をリサイズして、ファイルサイズを軽量化しよう![プレビュー.app編]