BLOG

CMAブログ

株式会社シーエムエーホーム CMAブログGoogleのSpeed Update対策は、画像と動画ファイル圧縮が効果的！！

ホームページ制作 SEO対策 GoogleのSpeed Update対策は、画像と動画ファイル圧縮が効果的！！

浜松本社ディレクター深谷
2018.08.01

こんにちは。クリエイティブプランナーの深谷です。
「GoogleがSpeed Updateを正式導入」の記事はご覧いただけたでしょうか？

今回はSpeed Update対策として、
画像と動画ファイルを劣化させずに軽量化する方法をご紹介いたします。

もくじ
画像の圧縮方法
・TinyJPG
・JPEGmini
・Optimizilla
動画ファイルの圧縮方法
・HandBrake
まとめ

画像の圧縮方法

画像の圧縮方法について、3つのサイトをご紹介いたいます。

TinyJPG

https://tinypng.com/

PNG・JPEG画像ファイルを圧縮できる「Tiny PNG」です。
ブラウザ上で圧縮したい画像をドラッグ＆ドロップするだけで、高画質なまま「60%～80%」くらいの軽量化が可能です。

・最大20枚
・最大5MBまで

Optimizilla

https://imagecompressor.com/ja/

PNG・JPEG画像ファイルを圧縮できる「Optimizilla」です。
読み込みファイルの容量制限がなく、圧縮のクオリティ設定も細かく調整することができます。

・最大20枚

JPEGmini

https://www.jpegmini.com/

JPEG画像ファイルを圧縮できる「JPEGmini」です。
JPEGminiの特長は、圧縮前と圧縮後の画像を比較でき、高画質なまま80％近く減らすことも可能です。

・インストールタイプもあります（有料）

動画ファイルの圧縮方法

HandBrake

https://handbrake.fr/

mp4・avi・movなど動画ファイルを圧縮できる「HandBrake」です。
数GBの重いファイルも、高品質のまま数MBまで圧縮することが可能です。

summaryタブ

Format:「MP4」を選択します。
「Web optimized」にチェックを入れます。（Web用の最適化処理を行ってくれる設定）

videoタブ

Video Encoder:「H.264(x264)」を選択します。（映像コーデックの設定）

Framerate(FPS):「Same as source」を選択します。（フレームレートの設定で、読み込んだ動画のfpsを保持します）
Variable FramerateVFRにチェックを入れます。

Average Bitrate (kbps):ラジオボタンにチェックを入れます。
数値を1200から600あたりをおすすめします。

2-pass encodingにチェックを入れます。（書き出しに時間がかかりますが、高画質になります）
Turbo first Passのチェックを外します。

最後に『Start』ボタンを押し書き出しを開始です！

まとめ

画像や動画ファイルを軽量化することによって、

・Google Speed Update対策
・ページの表示高速化
・ユーザビリティの向上
・SEOにも有利

などメリットがございます。

PageSpeed Insightsで「画像を最適化する」の指摘がないか、
ぜひ一度、検証してみては如何でしょうか？

浜松本社ディレクター深谷

Tweet

人気の記事ランキング

posted on 2023/02/082023年度版 Google PageSpeed Insights（ページスピードインサイト）を使って読み込み速度を改善したら、何点になるのかチャレンジしてみた
posted on 2018/10/31無料でGoogleマイマップの配色とアイコンを自由にカスタマイズ！Webサイトのデザインテイストに合わせるやり方とは！？
posted on 2021/07/14XMLサイトマップ（sitemap.xml）を毎日自動で最新に！自動生成に加えて自動更新するプログラムを開発してみた
posted on 2022/04/21WordPressで画像をWebP（ウェッピー）に対応する方法
posted on 2019/05/22Google 翻訳のウェブサイト翻訳ツールが終了？！まだ使える裏技をご紹介

おすすめの記事

メンバー

おすすめタグ