WordPressでのWebP画像の使用

公開: 2021-03-30

ご存知かもしれませんが、Webサイトに関しては、速度が重要です。 Webサイトを高速化するためにできる最も重要なことの1つは、ページサイズを小さくすることです。 小さいほど、ダウンロードする必要のあるデータは少なくなります。 データが少なければ少ないほど、ページの読み込みが速くなります(理由の範囲内で!)。

画像は、Webページのファイルサイズのかなりの部分を占めます(ページデータの50%をはるかに超える場合は画像です)。 これにより、画像は、ページサイズを小さくするためのダイエットの最大のターゲットになります。 従来、Webサイトで使用されるほとんどの画像は、JPEGまたはPNGのいずれかです。 どちらも、Webサイトでうまく機能する優れたファイルタイプです。 ただし、サイズの問題が発生する可能性があります。 TinyPNGのようなツールを使用することをお勧めしますが(サイトに追加する画像のサイズに劇的な影響を与える可能性があります)、「箱から出してすぐに」小さい画像形式があった場合はどうでしょうか。 そうですね、WebPと呼ばれています。

この記事では、WebP画像を詳しく見て、それらが何であるか、WordPressWebサイトでどのように使用できるかを確認します。 だから、もしあなたがいつもあなたのウェブサイトをスリムにしたいのなら、コーヒーとケーキを手に入れて(誰も私たちのウェブサイトと同様にダイエットをしなければならないとは言わなかった!)そして始めましょう!

WebP画像とは何ですか?

では、おそらく人々が話しているのを聞いたことがあるこれらのWebP画像は何ですか? まあ、それについてあまりにも複雑で神秘的なものは何もありません。 基本的に、それは単なる別のファイルタイプです。 画像はJPEGまたはPNG形式で保存されるのではなく、WebPとして保存されます。 WebPは実際にはGoogleによって開発されました。 彼らは、WebPを「Web上の画像に優れた可逆および非可逆圧縮を提供する最新の画像形式」と説明しています。 WebPを使用すると、WebマスターとWeb開発者は、Webを高速化する、より小さく、よりリッチな画像を作成できます。

グーグルは速いウェブサイトを愛しているので、ウェブサイトがより速く動くのを助ける画像フォーマットを提供することにおいて彼らが先導するべきであることは理にかなっています。 WebPファイルは通常、同等のJPEGよりも25%から34%です(Google自身の調査による)。 画像がWebページ上のデータの大部分を占める可能性があることに基づいて、これは大幅な節約になります。

Pressidiumであなたのウェブサイトをホストする

60日間の返金保証

私たちの計画を見る

また、画像の品質が低下することを心配する必要はありません。WebPの全体的な目的は、視覚的な観点から高品質を維持しながら、同時に小さな画像を保存できる形式で画像を保存できるようにすることです。ファイル形式。 ウィンウィン。

したがって、WebP画像のサイズが小さく、ユーザーに優れた視覚的エクスペリエンスを提供している場合、なぜそれらがより広く使用されていないのか不思議に思うかもしれません。 これにはいくつかの重要な理由があります。

  1. 使いやすさ:現在、WebP画像は、PhotoshopやIllustratorなどのグラフィックデザインソフトウェアの大部分ではサポートされていません。 これらのプログラムで作業する人は誰でも、画像ファイル(すべての説明、JPEG、GIF、PNGなど)を開き、必要に応じて編集を開始することに慣れています。 さらに、これらのファイルの保存に関しては、通常、一般的な画像形式のいずれかにエクスポートできます。 WebPでは、これを箱から出してすぐに行うことはできません。 代わりに、「通常の」画像編集ソフトウェアを使用するために、WebPShopからプラグインをダウンロードする必要があります。 WebP画像がJPEGやその他の形式と同じくらい普及するまで、「過度に複雑な」ものには常に消極的であり、多くのWebデザイナーはより伝統的な画像形式を使用し続けるでしょう。
  2. ブラウザの互換性:WebPはすべてのブラウザで普遍的にサポートされているわけではありません。 つまり、ChromeやMozillaなどの最新のブラウザを使用する訪問者の大多数はこれらの画像の表示に問題はありませんが、保存されたWebサイトの画像を表示できないかなりの少数派がいることになります。 WebPとして、特に使用されているバージョン(執筆時点)に応じて部分的なサポートのみを提供するSafariが含まれています。 すべての訪問者が意図したとおりにWebサイトを表示できるようにするには、回避策(以下で説明します)が必要です。

したがって、問題は「WebPを使用する必要がありますか?」である必要があります。 まあ、それは確かに人々が信じられないほど革新的なファイル形式が何であるかにもっと注目し始めているように見えます。 そして、速度が本当に重要であり、WebP画像を使用してWebサイトを作成するためのリソースがある場合は、なぜそうしませんか? すべての新しいテクノロジーと同様に、スタートゲートから出るのが遅い場合もありますが、競争に追いつくためにレースをするよりも、カーブを先取りする方が良いでしょう。 これを念頭に置いて、WordPressWebサイトでWebP画像を使用する方法を見てみましょう。

WordPressでWebP画像を使用する方法

2021年7月より前にWordPressWebサイトに直接飛び込んでWebPファイルをアップロードしようとした人は、少しがっかりしたでしょう。 MediaCenterを介してアップロードされたWebP画像は通常どおり保存されると思われます。 代わりに、次のような画面を見たことがあるかもしれません。

ありがたいことに、WordPress 5.8のリリース以降、WebP画像をWordPressに直接アップロードできるようになりました。これにより、この優れた画像形式がJPEG、PNG、GIF形式と同じように使いやすくなります。 このような一貫した改善が、WordPressコアを最新バージョンにアップグレードすることが理にかなっている理由の1つです。 もちろん、PressidiumのようなマネージドWordPressホストを使用している場合は、私たちがこれを処理し、常に最新かつ最高のバージョンのWordPressを実行できるようにします。

WordPress 5.8がリリースされる前は、WebP画像を使用する最も簡単な方法の1つは、サポートされている画像形式(PNGなど)をWebPファイルに変換してサイトに表示するプラグインをインストールすることでした。 WebP画像(上記にリスト)を使用する際の注意点がいくつかあります。Shortpixelなどの適切なプラグインを使用すると、これらの欠点を取り除くことができるため、検討する価値のあるソリューションになる可能性があります。 詳細については、以下をお読みください。

ショートピクセル

Shortpixelは素晴らしいプラグインであり、WebP画像を使用するかどうかを検討する価値があります。 Shortpixelは、定評のある画像最適化サービスです。 優れた画像圧縮サービスを介してアップロードしたすべての画像を実行し、多くの場合、画質を損なうことなく画像サイズを50%以上圧縮します。 これは自動的に行われるため、画像をWebサイトにアップロードする前に画像の圧縮について考える必要はありません。

Shortpixelを実際に最大限に活用するには、Shortpixelでプランの料金を支払う必要があります。 彼らは「最適化された画像/月」ベースで課金し、月額5,000枚の画像の費用はわずか3.99ドル/月です。 多くのWebサイトでは、この計画で十分であり、最適化されたWebサイトに関連するパフォーマンス上の利点を考えると、その価格で安価です。

Shortpixelは、JPEGやPNGを含む幅広い画像形式を最適化します。 それで、あなたは疑問に思うかもしれません、これは私が私のWordPressウェブサイトにWebP画像を追加するのにどのように役立ちますか?

覚えているかと思いますが、使用されているバージョン(執筆時点)によっては、すべてのWebブラウザーがSafariで部分的なWebPサポートのみを備えたWebP形式をサポートしているわけではなく、InternetExplorerによってサポートされていません。 古いブラウザやサポートされていないブラウザを使用している人が少数派であっても、これらの訪問者に対応しないWebサイトを作成することは実行可能なオプションではありません。

また、多くの画像編集ソフトウェアは、箱から出してすぐにWebPファイルをサポートしていないことを覚えているかもしれません。 したがって、2つの面で戦いがあります。最初にWebPファイルを作成または操作するためにフープを飛び越える必要があるだけでなく、a)WordPress Webサイトにそれらを追加する方法とb)を見つける方法も見つける必要があります。 WebPと互換性のないブラウザを使用して当サイトにアクセスするユーザーのためのフォールバック画像を作成します。

レスキューへのショートピクセル

Shortpixelには、WordPressWebサイトでWebP画像を使用するための優れたアプローチがあります。 プラグイン内から1つのチェックボックスをオンにすることで、アップロードする画像のWebPバージョンを作成するように指示できます。 次に、Shortpixelプラグインに、WebPをサポートするブラウザーでこれらのWebP画像を表示するように指示できます。

Webサイト訪問者のブラウザがWebP画像を表示できない場合は、別の画像形式が自動的に表示されます。 これにより、すべての世界で最高のものが得られます。画像を処理できるブラウザ用のWebPまたは処理できないブラウザ用の最適化された代替手段のおかげで、サイズの小さい画像を使用するWebサイトの速度が向上します。

WebPは現在広く採用されている画像形式です。 WordPressで現在利用可能なネイティブアップロード機能を使用する場合でも、ShortPixelなどのプラグインを介して生成する場合でも、Webサイトの画像をWebPバリアントに切り替えて、サイトが縮小されたファイルサイズを利用できるようにすることを検討するのは理にかなっています。次に、より高速な読み込みのWebサイトに変換します。