WordPress用に画像を最適化する方法

公開: 2019-11-12

あなたの画像はあなたのウェブサイトの設定に有害ではなく、ポジティブでなければなりません。彼らはあなたがあなたのサイトに設定した目標を達成するのを助けるはずです。

遅いウェブサイトはみんなの悪夢です。ウェブサイトの所有者として、生の形式の画像はウェブサイトの速度にとって悪いニュースであることを知っておく必要があります。ウェブサイトの速度が遅いと、SEOランキングが低下し、オーディエンスにコストがかかります。速度とは別に、できるだけ多くのユーザーを獲得して維持できるように、画像も適切な位置に配置する必要があります。

この記事では、WordPress用に画像を最適化する方法についてさまざまな方法を紹介します。画像の最適化は、1回のアクションでは達成できません。それはあなたのサイトをあなたが望むように印象的にするいくつかの手段の組み合わせです。これらの簡単なアクションをご案内します。

適切な画像形式を選択する

画像が多色でコントラストが高い場合は、JPEGが違いを確認するのに最適な形式です。この形式で写真を圧縮してファイルサイズを小さくすることはできますが、これにより品質がある程度低下します。一方、画像の色がそれほど洗練されていない場合は、PNGが最適なオプションです。 PNGは、画像の透明性をサポートするJPEGよりも優れています。ただし、PNG写真を圧縮すると、写真の品質は向上しますが、ファイルサイズは大きくなります。

コンピューターで画像を編集するときは、画像を保存するファイルの種類を選択する必要があります。画像の最も一般的な形式はJPEGとPNGです。

要点：複数のカラー写真の場合は、JPEGを選択して圧縮します。よりわかりやすい写真と透明な写真については、PNGを参照してください。

画像のサイズを変更する

画像のサイズを小さくすると（形式に関係なく）、ファイルサイズが小さくなります。画像を小さくするほど、サイズが小さくなります。ただし、夢中になってやりすぎないでください。Webサイトの幅を考慮し、画像の幅を狭くしてください。新しい写真を小さくしすぎると、コンテンツが見えにくくなる可能性があります。

サイトの幅を超える画像をアップロードして、ウェブサイトにサムネイルで表示することができます。しかし、これはあなたのサイトにあなたのサイトを遅くする大きな画像があるという事実を取り除くことはありません。サイズを変更することで、ファイルサイズを半分以上に減らすことができます。

アップロードする前に画像のサイズを変更しなかった場合は、WordPressメディアライブラリで特定の写真を選択し、編集を選択して、サイズを変更できます。

画像のトリミング

サイズ変更とトリミングの違いは、サイズ変更によって元の画像のすべての要素が保持されることです。一方、トリミングは元の画像のエッジの一部を切り取ります。

画像のサイズを変更すると、その要素の一部が細かくなり、どの画面サイズでもほとんど表示されなくなります。トリミングは、特に画像の焦点がある場合に役立ちます。画像の不要な部分を切り取り、ファイルを小さくすると同時に、関心のある要素をより見やすくすることができます。

画像の圧縮

画像のサイズを変更してトリミングした後、画像を圧縮することでさらに一歩前進できます。非可逆圧縮と呼ばれるプロセスでJPEG画像を圧縮できます。このプロセスでは、元の画像のデータの一部を失って、より小さな画像ファイルを作成します。

ここでは、画像のサイズと品質のどちらかを選択する必要があります。サイズを小さくすることが究極の目標ですが、品質が犠牲になります。したがって、画像に必要な機能を損なうことなく、可能な限りサイズを小さくする必要があります。ただし、圧縮しても画質はそれほど低下しません。品質スコアをチェックして、気に入ったかどうかを判断するだけです。

圧縮プロセスは、オンラインで利用可能な画像圧縮ツールを使用して可能です。TinyPNGは、10億を超えるPNGおよびJPEGに最適化された画像を誇る唯一の画像圧縮ツールです。それはあなたのウェブサイトにそれらをアップロードする前にあなたの画像を最適化するための完璧な方法を提示します。

TinyPNGはPNGとどのように連携しますか？

PNGファイルの場合、TinyPNGはスマート非可逆圧縮を使用してファイルサイズを縮小します。画像の色を選択的に縮小することを意味しますが、肉眼ではまったく目立たず、ファイルサイズが大幅に減少します。

通常の非圧縮PNG画像には、24ビットカラーの組み合わせが含まれています。 TinyPNGを使用して圧縮すると、それらをますます小さな8ビットカラー画像に変換します。このプロセスは、量子化とも呼ばれ、不要なメタデータを取り除くことも伴います。 TinyPNGを使用すると、ファイルサイズを70％以上縮小し、画像を透明度と完全に互換性のあるものにすることができます。

最新のブラウザでどれだけうまく機能しますか？

TinyPNGをユニークにするもう1つの側面は、最新のすべてのブラウザーのサポートです。 Internet Explorer 6がPNGの透明性を認めることを拒否したにもかかわらず、TinyPNGはブラウザーの背景を透明にします。お使いのブラウザがアニメーションPNG（Chrome、Firefox、Safari）をサポートしている場合は、お気軽に試してみてください。

JPEG圧縮

JPEG圧縮が必要な場合は、もう探す必要はありません。 TinyPNGは当初、インテリジェントなJPEG画像圧縮をサポートするために構築されており、優れた機能を発揮します。

ウェブサイトの読み込みが遅いことに不満を感じている場合は、ウェブサイトに画像をアップロードする前にTinyPNGを使用して、圧倒的な違いを体験してください。すべてのJPEGおよびPNG画像を圧縮することにより、帯域幅を節約し、サイトの読み込みを高速化します。

CDNから画像を提供する

サーバーからWebサイトから離れているユーザーは、読み込み速度が遅くなる可能性があります。これを処理するために、CDNをインストールできます。 CDNを使用すると、訪問者は最も近いサーバーを介して接続できます。 CDN URLを取得したら、それを使用するキャッシュプラグインにコピーします。 CDNのURLが含まれるように、画像のURLを置き換えます。このようにして、同じCDN基準を介して画像が訪問者にも提供されます。

遅延読み込みを使用する

WordPressの性質は、ページをリクエストした瞬間に、すべてを同時にページにロードすることです。画像の読み込みはテキストよりも遅いため、ページの読み込みが遅くなります。

遅延読み込みでは、ページの読み込みが開始されるとすぐに、ビューアのインターフェースの下にある画像が読み込まれないようにします。代わりに、上部の画像が最初に読み込まれます。次に、訪問者が下にスクロールすると、残りが読み込まれます。このように、あなたがそれらに持っている画像にもかかわらずあなたのページは速くロードされます。遅延読み込みを容易にする一部のプラグインは、実際の読み込みが完了するまで、低品質の画像バージョンを表示します。

画像をキャッシュする

あなたが速いウェブサイトを持つことに熱心であるならば、あなたはまだそれらを試していなければ、あなたはキャッシュプラグインを試す必要があります。 Webサイトやページにコンテンツをキャッシュすることは、要求に応じてすぐに利用できるように、それらのバージョンを作成することを意味します。恒星のキャッシュプラグインは、簡単にアクセスできる代替手段である「ブラウザキャッシュ」を介して画像をキャッシュするオプションを提供します。

画像ファイルに適切な名前を付ける

画像をアップロードするときは、必ず名前を付けてください。あなたがそうするように、あなたのプラグインがそれらに代替テキストを自動的に追加することに気付くかもしれません。画像に名前を付ける最良の方法は簡単な説明であるため、この状況は理想的です。あまりにも多くのキーワードを追加することはあなたにとって大丈夫ではありません。キーワードはSEOに関してあなたに利点を与えます。ただし、画像にそれらが多すぎると、スタッフィングのペナルティが発生するリスクがあります。

Googleスニペットで機能するように画像を最適化する

検索結果でリッチスニペットを取得するのは簡単ではありません。ユーザーに正確で簡潔な答えを与えるいくつかのキーワードが必要です。ターゲットとするキーワードを説明する画像を作成します。クリックを促すための事実に基づくコンテンツのユーザー品質リファレンス。キーワードの最初のページに表示されない場合は、編集してコンテンツを改善してください。

また、構造化データ（スキーマ）プラグインを使用して、リッチスニペットを使用できる可能性を高めます。

元の画像を使用する

他のウェブサイトの画像は使用しないでください。彼らはあなたが写真を借りたウェブサイトのサーバーを満たすために追加の要求を伴うのであなたを遅くします。

結論

これらは、WordPress用に画像を最適化する方法についての説明です。すでに述べたように、良い結果を期待して、1つを選んで実行することはできません。画像の最適化には、いくつかの戦略による統一された取り組みが必要です。アイデアを理解し、適用し、訪問者だけでなく自分自身も驚かせる準備をしてください。