テクニカルSEO

TinyPNGで画像の容量を削減・最適化する方法

TinyPNGで画像の容量を削減・最適化する方法

ページスピードインサイトで「効率的な画像フォーマット」を改善するよう指摘されていませんか?

その場合は、画像容量削減や画像フォーマット変更の余地があります。

画像を最適化すると、読み込み時間を速くして、モバイルデータ量を抑えることができます。

この記事ではTinyPNG」というオンラインツールを活用して、画像容量を削減する方法をご紹介いたします。

効率的な画像フォーマット

TinyPNGの使い方

TinyPNGに画像をアップロードする

TinyPNGにアクセスし、「Drop your .png or .jpg files here!」の部分に画像をドラッグ&ドロップするか、ファイルを選択して画像をアップロードします。

TinyPNGに画像をアップロードする

すると、画像の圧縮が始まります。

TinyPNGで圧縮された画像をダウンロードする

画像の圧縮が完了したら、「Download all」ボタンをクリックして、容量を削減された画像をダウンロードしましょう。

TinyPNGで圧縮された画像をダウンロードする

ダウンロードされたzipを解凍して、画像を取り出し使用します。

画像によっては画質が落ちて粗くなりすぎる場合があります。
緻密に行うには、Photoshopなどで画像を加工・保存することがおすすめです。

同じ解像度の画像でも、保存する画像フォーマット(JPEG、PNG、GIFなど)によって、画像ファイルサイズが変わります。

Photoshopを使えば、画像ごとに画質が劣化しすぎず、必要最低限のファイルサイズになるよう最適化することができます。

【補足】SEOに適切な画像形式(画像フォーマット)とは?

SEOのために直接的に関わってくるわけではありませんが、画像サイズを最小化(最適化)して、ページスピードを速いまま維持することは重要です。

2018年の夏頃から、ページスピード(ページ表示速度)が検索順位の決定に影響すると、Googleから公式発表がありました。

解像度の高い、ファイルサイズの大きい画像をどんどんアップすると、サーバー容量を圧迫したり、ページの読み込み時に必要以上に大きなサイズの画像を呼び出すことになるので、ページスピードに悪影響を及ぼします。

特に、スマホやデジカメで撮影した画像を、サイズを加工せずにそのままどんどんWordPressにアップすると、1枚1枚がとんでもなく大きなサイズになっているので、特にページスピード低下の要因になりやすいです。

PhotoshopやSUMO Paintなどで、解像度・画像サイズを小さく加工して保存し、TinyPNGでさらに容量削減すると、だいぶ最小限のファイルサイズになります。

さらに、ここまでこだわる人はあまりいないかもしれませんが、画像最適化に関するポイントがあります。

同じ解像度・サイズの画像でも、保存する際の画像形式(画像フォーマット)によって、ファイルサイズが変わるということです。

細かく見るためには、フォトショップで調整します。

以下の2枚の画像はPhotoshopでJPEGで保存する場合とPNGで保存する場合の画面です。

いずれも横幅1000px、高さ656pxの画像ですが、JPEGで保存する場合は409K、PNGで保存する場合は526.6KとPNGの方が少し効率が悪くなっています。

Photoshop JPEGで保存する場合のファイル容量 Photoshop PNGで保存する場合のファイル容量

どのフォーマットが効率的かということは、大まかにですが以下のように判断できます。

●人や景色などの写真の画像
→「JPEG」

●グラデーションなどなく、主に単色が使われている
イラスト・図・グラフなどの画像
→「PNG」「GIF」

で保存しておけば基本的には間違いありません。

PNGとGIFの区別は、白黒や三色程度のグラフやアイコンなら、GIFを使います。
GIFは一番軽くなりやすいです。

何でもGIFにすれば良いという訳ではなく、多少グラデーションぽかったり色が多く含まれているものをGIFにすると、かえって容量が大きくなっていることが多いです。
Photoshopで確認できます。

このあたりは微妙な容量の差なので、ここまでこだわらなくても特別問題ありません。

(ただ微妙な容量の差も、何千枚、何万枚になってくると結構大きな差になっていくのと、あとから1枚ずつすべての画像を加工し直すのは大変なので、早いうちから画像サイズは意識して頂けると良いと思います。)

あとは、画像を最小サイズにしてもサーバー自体の応答速度が遅いと、ページ表示速度が遅くなりやすいので、エックスサーバーなど高速なサーバーを使うことがおすすめです。

まとめ

ページスピードインサイトの結果では、画像に関する改善項目が複数表示されることも多いです。

それだけ画像は容量が大きくなりやすく、ページスピードに影響を与えます。

専門性・権威性・信頼性や検索意図を踏まえて網羅性の高いコンテンツを継続的に発信し続けることがSEOでは重要ですが、ページスピードや内部の構造・設計など、土台となる内部の技術的なSEO対策も重要です。

検索順位や自然検索からの訪問数を伸ばし続けていくために、コンテンツSEOとテクニカルSEOの両輪を意識していきましょう。

その他のページスピード改善方法については、以下の記事をご参照ください。

ページスピード高速化に関する記事一覧

ページスピードインサイトをもとにサイトスピードを改善する方法リンクをクリックしてから、ページが読み込まれ表示されるまでの時間が長くなりすぎていませんか? 「読み込みが遅い、サイトが重たい」と...
ABOUT ME
渡部 瞬
一人ビジネス戦略家&Webコンサルタント。得意分野は、テクニカルSEO。 「1ヵ月後に月間PV数1.7倍、2ヵ月後に月間PV数2.3倍」や「7ヵ月後に月間オーガニック流入数 100万件超、前年比507%」など改善実績・事例多数です。 個人起業家から上場企業まで、7年間で180以上のWebマーケティング、Webサイト改善に携わり事業成長を支援しています。 エンジニア・デザイナー・クリエイター、コーチ・コンサルタントなど、労働集約型ビジネスの一人社長・複業家・フリーランス・副業サラリーマンの方向けに、一人ビジネス専門メディア『ナノ経営』を運営。 一人ブラック企業状態を脱却し、週3日稼働で高収益な一人ホワイト企業に転換するための情報を発信しています。 お問い合わせフォームはこちら »
現状分析・課題抽出のためのSEO診断

●対応内容:
サイトの現状調査・分析により、順位上昇・SEO対策の効果を高めるための改善点・課題点抽出を行います。

●成果物:
Word数ページにて、チェック項目・改善点を一式ご報告させていただきます。

※箇条書き、テキストベースのシンプルな体裁とさせていただいておりますが、ご了承いただけましたら幸いです。

※調査結果とあわせてご参考までに、改善・改修作業を弊社で対応させていただく場合のお見積もりをお送りさせていただきます。

※改善・改修作業をこちらで対応させて頂く場合は、調査料金3万円をお見積もりから差し引かせて頂きます。

●所要期間:
お振り込み頂き着手してから、1週間以内に調査結果をお送りさせていただきます。

【特典】
Googleデータポータル(旧Googleデータスタジオ)を活用し、アナリティクスやサーチコンソールの各種データを連携して作成した10ページ前後のアクセス解析オンラインレポートをご提供します。

アナリティクスよりもアクセスの推移やコンバージョン数(申込数、成約数)などの成果が見やすくなります。
Googleデータポータルの仕様が変わらなければ、無料でずっと使えます。

毎日自動でデータが反映され、日々の指標確認、アクセス分析、スピーディーな打ち手検討、モチベーション維持などにご活用いただけます。

【料金】
現状分析・課題抽出のためのSEO診断 一式 30,000円(税別)

SEO診断に申し込む »