WebP 画像ガイド: WordPress で WebP 形式を使用する方法
公開: 2022-07-29私たちは皆、優れた GIF を愛していますが、1987 年に GIF が導入されて以来、画像形式は長い道のりを歩んできました。精通した Web デザイナーは、JPEG、PNG、そして今では WebP を採用するようになりました。
GIF が Slack チャンネルやテキスト メッセージの餌食として第二の人生を楽しんでいる一方で、新しい WebP 形式が Web を支配し始めています。
この投稿では、WebP の成長を検証し、Web サイトで WebP を使用する方法に関するヒントを提供します。 学習内容:
- フォーマットの仕組み
- WebP 画像の利点
- WebP の使用に関する制限事項
- WordPress で WebP 画像を有効にする方法
WebP 形式の仕組み
On2 Technologies から生まれた Google は、オープンソースの画像形式として WebP を開発しており、Web 画像の新しい標準として認められることを望んでいます。
WebP は強化された画像圧縮を提供します。 画質を損なうことなくファイルサイズを縮小できます。 WebP は、非可逆圧縮と可逆圧縮をサポートする方法が独特です。
可逆圧縮を使用すると、元の画質を維持しながらファイル サイズを縮小できます。 元のデータは失われないため、画像を元の品質とサイズに復元できます。
非可逆圧縮を利用すると、ファイル サイズがさらに小さくなります。 非可逆圧縮では、イメージを縮小サイズで表示するために必要なデータのみが保持されます。 サイズを元に戻して元の品質を維持することはできません。
WebP を最大限に活用するには、背景画像など、さまざまなサイズにスケーリングする必要がある画像に可逆圧縮を使用します。 固定サイズの画像には非可逆圧縮を使用します。 サイトの注目の画像または製品画像の最大幅がわかっている場合は、それらの正確なサイズに非可逆圧縮して保存できます。
WebP の利点
では、何が WebP の成長を促進しているのでしょうか? この形式には、使いやすさやパフォーマンスなど、多くの利点があります。 Web サイトで WebP を使用する最大の利点を探ってみましょう。
既存の画像を簡単に変換
サイトの既存の PNG、GIF、または JPEG を WebP ファイルに変換できます。 品質が犠牲になることはなく、通常はファイル サイズが小さくなります。
より良い圧縮
PNG または JPEG を WebP に変換すると、WebP ファイルのサイズは元のサイズより 30 ～ 50% 小さくなります。 画像が小さいほど、ページの読み込みが速くなります。そのため、WooCommerce サイトを高速化する最良の方法の 1 つとして画像圧縮をお勧めします。
サイトのパフォーマンスの向上
画像やページの読み込みが速くなると、ユーザー エクスペリエンスが向上します。 サイトの速度を最適化することで、検索エンジンのランキングを上げることもできます。 検索エンジンは、サイトの読み込み速度を重視します。 読み込みの速いサイトは、読み込みの遅いサイトよりも上位にランクされる傾向があります。
WebP のような次世代形式で画像を提供することは、Google PageSpeed Insights Score を改善するための 12 の実証済みの方法の 1 つです。
透明度とアニメーションのサポート
アニメーション GIF が嫌いな人はいません。 WebP があれば、あなたは幸運です。 WebP は、アニメーションと透明度をサポートしています。
広範なブラウザのサポート
最新のブラウザのほとんどは WebP をサポートしています。 Apple の Safari ブラウザーは唯一の抵抗者でしたが、昨年 Safari 14 でついに WebP サポートを導入しました。
WebP の制限事項
WebP の主な制限は、画像を使用するすべての方法で互換性を確保することです。 Web サイトのデータを使用してメール キャンペーンやモバイル アプリケーションにフィードすると、問題が発生する可能性があります。
画像が表示されるすべての場所をテストして、WebP 形式が機能することを確認してください。 イメージの 2 つのバージョンを提供することも検討できます。 許可されている場合は WebP を使用し、WebP がサポートされていない場合は代替の JPEG または PNG を使用します。
WordPress で WebP を有効にする方法
WordPress はバージョン 5.8 で WebP サポートの提供を開始しました。 サーバーが WebP をサポートしている場合は、サポートされている他の画像タイプと同様に、WebP 画像をアップロードして使用できるはずです。
WordPress で WebP 画像を使用するためのオプションは次のとおりです。
- 手動で画像を変換します。 CloudConvertなどのオンライン ツールを使用して、画像を WebP に変換します。 ファイルをコンバーターにアップロードしてから、新しいファイルを WordPress ライブラリにアップロードする必要があるため、時間のかかる手動タスクです。
- 画像最適化プラグイン。 多くの画像最適化プラグインには、画像を WebP ファイルとして変換および表示するためのオプションが既に含まれています。 サイトのオプションを有効にする方法については、プラグインのドキュメントを確認してください。
- WebP プラグイン。 最適化プラグインの代わりに、 WebP Converter for Media のような特別に設計されたプラグインを使用して、アップロードされた画像を自動的に WebP に変換することもできます。
WebP と Pressable によるサイトの高速化
WebP に関心がある場合は、サイトの読み込みをできるだけ速くしたいでしょう。 WebP の優れた圧縮機能を使用して画像ファイルのサイズを半分に縮小することから始めるのが最適です。 サイトができるだけ速く動作するようにするもう 1 つの方法は、適切なホストを選択することです。
Pressable のホスティング サービスは、WordPress サイトに可能な限り最高のパフォーマンスを提供します。 当社のクラウドベースのマネージド ホスティング サービスは、100% のアップタイムと超高速の速度を提供しながら、サイトの管理をシンプルにします。 ああ、そして WebP のサポートは？ 私たちはそれをカバーしました。 当社のグローバル CDN ネットワークは WebP もサポートしているため、この新しい画像形式を使用する速度向上のメリットをすべて享受できます。
Pressable が WordPress の動作を改善する方法について詳しく知りたい場合は、今すぐカスタム デモを予約してください。
