WebP画像とWordPress：それらを使用する理由と方法
公開: 2021-11-25
WordPress Webサイトの速度を上げたい場合は、WebP画像形式を使用することをお勧めします。 あなたのウェブサイトのコンテンツがゆっくりロードされる理由の主な問題はすべてあなたのウェブサイト上の大きな写真のためです。
ただし、イメージコンプレッサーは、ユーザーにイメージファイルのメガバイトの読み込みを強制する可能性があり、接続のクロールを遅らせます。 これに加えて、コンプレッサーが原因でWebサイトの画像がぼやけることがあります。
ただし、画像を何も圧縮しないファイル形式もありますが、画像の品質に影響します。 非可逆JPEG圧縮がどのように機能し、画像がかろうじて見えるのが気に入らない場合は、WebPの使用を選択する必要があります。
WebP画像とWordPressとはどういう意味ですか、いつ使用するか、WordPressに基づくWebPをWebサイトに追加するにはどうすればよいですか？
これらすべての質問に対する回答は、このブログにあります。 さらに、ページの読み込み時間に影響を与えずに画像サイズを最小化し、読み込みを高速化するためのソリューションを見つけることができます。
WebP：それはどういう意味ですか？
私たちが使用する最も人気のある画像形式は、wwwの初めから広く使用されています。 もちろん、JPEG、PNG、GIFなどの一般的な画像形式は、可能な限り最善の方法で機能します。 では、何を、そしてなぜもっと画像フォーマットが必要なのですか？
画像形式の他の方法を探すことの主な問題は、これらの形式が最良の方法で画像を圧縮することができないということです。
インターネットの利用は日々増え続けています。 したがって、ますます多くの人々が、デスクトップコンピュータと比較して、小さなテクノロジー、つまりパワーパッケージが少ないモバイルデバイスを介して情報を検索することを好みます。
世界中でモバイル接続が利用できるため、従来の有線インターネットよりも速度が低下する可能性があります。
2010年に、長期にわたる問題の代替オプションが付属するWebP画像とWordPressが発表されました。 以前の画像形式を使用した場合よりも優れた圧縮と高品質の画像を提供します。
WebMと同様の目標があります。 WebMとは、Web用に最適化しながらオーディオとビデオを圧縮することを意味します。
WebPは、可逆圧縮と非可逆圧縮の両方を利用します。 これに加えて、メタデータ、カラープロファイル、透明度、アニメーションなどもサポートします。 したがって、すべての主要なブラウザとも互換性があります。
ただし、Internet Explorer、KaiOS、およびその他のサファリバージョンではうまく機能しません。 しかし、それでも、古いバージョンのサファリを含め、これらのブラウザを使用するユーザーは非常に多くいます。
WebPが不可欠であると考えられる理由
WebP画像とWordPressに関して、Googleは多くの調査を行ってきました。 しかし、彼らは毎回、アルゴリズムが非可逆画像では25〜34％小さく、可逆画像では26％小さく圧縮できることを発見しました。
これは明らかに、WebPが一貫性の提供に依存しているため、圧縮がより適切に行われることを意味します。 これに加えて、PNGなどのロスレスアルゴリズムと比較しても、画像の品質が失われることはありません。
これはWebPを使用する利点ですが、画像を圧縮するために古い手法を使用するユーザーはまだたくさんいます。
ただし、WebP機能を利用したWebサイトは0.3％にすぎません。 傾向はWebPで上昇していますが、それでも人々はあまり使用されていないテクノロジーに固執しています。
WebPの利点について話すとき、これは非常に驚くべきことです。
これは、WebPが透明性、アニメーションなどを含むサポート機能に加えて、一部の一般的なブラウザーとの非互換性を提供できないため、問題になる可能性があります。
さらに、PNGからWebPなどの他の画像形式に切り替える作業は簡単ではありません。 WebP画像をコンピュータに保存するだけでは、画像をWebサイトにアップロードすることはできません。 あなたが世話をする必要があるいくつかのより多くのステップがそれに含まれています。
ただし、Webサイトのコンテンツをすばやくロードする必要がある場合は、さらに努力する価値があります。
WebPおよびその他の画像ファイル形式の種類
非常に多くの画像ファイル形式があります。 すべてが特定のタスクを実行するための優れた機能を提供します。 一部のファイル形式は画像を適切に圧縮するのに役立ちますが、一部のファイル形式はアニメーションをサポートします。
また、透明な背景を提供する他のいくつかの形式もあります。 WebPがすべての選択肢に最適であるとは限りませんが、さまざまな状況で使用できる機能のいくつかを提供します。
世界的に使用されている一般的な画像ファイル形式のいくつかを見てみましょう
- PNG：PNGは、最も一般的なファイル形式と見なすことができます。 このファイル形式はロスレス圧縮でより一般的であり、アートワークと写真をオンラインで表示するのが最適です。
- TIFF：別のファイル形式は圧縮のないTIFFです。 この画像は、そのすべての賞賛で紹介されています。 これが、TIFFとして保存されるほとんどのファイルのファイルサイズが大きくなる理由です。 Webの場合、これは最良のオプションではありません。
- GIF：別の形式はアニメーションでサポートされているGIFです。 ただし、250色以上もサポートしている最古のファイル形式と言えます。 GIF形式で保存された画像は、低品質で見苦しく見えます。 アニメーションを探している場合は、GIF形式を選択する必要があります。
- EPSファイルとSVGファイル：これら2つは独自の関連付けです。 これにより、ピクセルで作成されていないため、スケーラブルでクリアなベクター画像が保存および表示されます。
- WebP：WebPの画質は、ファイルサイズが小さいPNGまたはJPGと同じです。 また、アニメーションと透明度をサポートしています。
小さい画像と引き換えにある種の画質を失うことに抵抗がない場合は、WebPが理想的な選択肢です。
ポートフォリオWebサイトのように画質が重要な役割を果たすプロジェクトに取り組んでいない場合は、トレードオフを行うのがよいでしょう。 いいえの場合、PNGは適切なオプションです。 これの代わりに、TIFF画像を使用するものはほとんどありません。そうでない場合、WebPは作業に理想的なオプションです。
WordPressにWebP画像をアップロードする方法
WebP画像とWordPressをアップロードするのに役立つ2つの異なる方法に出くわします
- 最初の方法は、WebP画像をWebサイトに手動でアップロードすることです
- 2番目の方法は、プラグインを使用してWebP画像をWebサイトにアップロードすることです。
プラグインを使用してWebサイトでWebP画像を取得することをお勧めします。これは、コーディングを処理する必要がなく、プラグインの操作中にセットアップがほとんど必要ないため、最も簡単な方法です。
ただし、WebP画像を手動で取得することを選択した場合は、最初にWebP画像を取得する必要があります。 WebPとして、画像やコンピューターに保存したり、拡張子を変更したりすることはできません。専用のコンバーターが必要になります。
このために、WebPShopとして知られているGoogleのPhotoshopプラグインを利用することができます。 または、オンラインWebPコンバーターを使用して、コンピューターに画像をアップロードすることもできます。
WebPイメージをアップロードする準備ができたら、HTMLまたはCSSでWebPイメージを紹介できます。 サポートされていないブラウザの場合、フォールバックイメージを確実に決定する必要があります。 しかし、これではなく、HTMLで別の画像を参照するのと同じです。
これには問題があります：
WordPressでは許可されていないため、メディアアップローダーを使用してWebP画像をアップロードすることはできません。 このタイプのファイルがブラウザでサポートされていないことを確認することによってのみ、エラーが表示されます。
サーバーでは、WebP画像を手動でアップロードし、それらを紹介するようにWebサイトを適切に構成できますが、多くの労力を必要とします。
プロセスを簡素化するために、いくつかのWordPressプラグインを利用できます。 プラグインは、変換をはるかに簡単に実行するのに役立ちます。 ただし、画像を追加するためにコードを編集するために、それほど多くのタスクを実行する必要はありません。
1.想像する
Imagifyは単なるWebP変換ではなく、アップロードする画像とサムネイルを最適化するのに役立つプラグインであると言えます。
Imagifyには、3つの異なるレベルの圧縮が含まれています。つまり、ウルトラ（最大損失圧縮）、通常（損失なし）、およびアグレッシブ（損失）です。
バルクオプティマイザーは、アップロードされたすべての画像を圧縮するのに役立ちます。 したがって、バックアップバージョンが保存されるので、画像を圧縮したくない場合は、元に戻すことができます。
Imagifyを使用してWebサイトに画像を追加するとすぐに、別のWebPバージョンが追加されます。 このようにして、Webサイトで、最適化されたWebP画像を紹介できます。
Imagifyの助けを借りて、毎月25MBの画像を無料で圧縮できます。
2.EWWWイメージオプティマイザー
もう1つの最も人気のあるWordPress画像オプティマイザープラグインはEWWWです。 このプラグインはWebPコンバーターとしても使用されます。 無制限の画像も無料で圧縮できます。
したがって、このプラグインを使用している間は、毎月のデータ上限について心配する必要はありません。 また、バルクアップローダーで構成されています。 ただし、メディアライブラリに保存されているかどうかに関係なく、すべての画像が圧縮されます。
このプラグインを使用すると、WebPを利用できます。 すべてのプロセスは自動です。 元の画像を変更せずに、圧縮、遅延読み込み、ページサイズのスケーリングも可能になります。
3. ShortPixel Image Optimizer
ShortPixelsを使用すると、画像を圧縮するためのさまざまな機能を利用できます。 数回クリックするだけで、その機能の使用を開始できます。
したがって、非常に簡単にWebPバージョンを自動的に生成できます。 バルクオプティマイザーを使用するか、直接アップロードすることで、画像を最適化できます。
さらに、画像ファイル形式をPNGからJPGに変換し、画像のサイズを変更し、サムネイルを最適化し、画像を最適化し、メタデータを削除し、サーバー上で最適化されていない画像をバックアップするのに役立ちます。
このプラグインは実際にはクレジットシステムに基づいて機能します。つまり、毎月100枚の画像クレジットがある場合、毎月100枚の画像を圧縮してさらに圧縮し、より多くのクレジットを購入する必要があります。
結論：
WordPressでは、WebPは実際にはサポートされていませんが、Webサイトでは引き続きWebPイメージを使用できます。 直接アップロードしようとしても機能しません。 しかし、あなたはあなたのウェブサイトにWebPを非常に簡単に追加するための多くのプラグインを見つけるでしょう。