ShortPixelレビュー：画像圧縮を通じてウェブサイトのパフォーマンスを最適化する方法

公開: 2021-05-19
ショートピクセルイメージオプティマイザ
@Cloudwaysをフォローする

2014年以来、50万人以上のユーザーがすでにShortPixelの優れた画像最適化を試しています。 ルーマニアを拠点とする同社は、将来のWeb速度の最適化の重要性を予測して、GTmetrixまたはGoogle PageSpeedInsightsが数回クリックするだけで報告する画像に関連するすべての警告を解決する非常に使いやすいプラグインであるShortPixelAdaptiveImagesをリリースしました。 これにより、SEOとWebサイトの読み込み速度が向上します。

ショートピクセル画像オプティマイザープラグイン

しかし、プラグインはどのようにそれをすべて行うのでしょうか？ Shortpixel Adaptive Images（略してSPAI ）のこの詳細なレビューで調べてみましょう。

目次
  • ShortPixelアダプティブイメージは何をしますか？
  • ShortPixelアダプティブイメージはどのように機能しますか？
  • ShortPixelアダプティブイメージのインストールと設定
  • 価格とプラン
  • ShortPixel Image Optimizerを選択する必要がある理由

ShortPixelアダプティブイメージは何をしますか？

ShortPixelが行う4つの主要なことは次のとおりです。

  • CDNから画像を提供します。ShortPixelAdaptiveImagesは、Webサイトの訪問者が表示したすべての画像を取得し、ShortPixelのCDNから提供します。 CDNとは何ですか？ それはコンテンツ配信ネットワークです。 簡単に言うと、特定のWebサイトのコピーを含む、世界中に分散しているサーバーのグループです。 したがって、ユーザーがいる国や地域に関係なく、どのユーザーも適切な読み込み時間を得ることができます。ShortPixelのCDNから画像を読み込むことで、ページの読み込み速度が向上します（CDNの読み込み速度が平均的なホスティングプロバイダー（世界中にサーバーがあることに加えて）、サーバーからいくつかのリソースを節約します。これは、画像がそこからではなく、ShortPixelのCDNから要求されるためです。
  • 画像を圧縮します。ShortPixelCDNから提供される画像は、ShortPixelの強力な最適化アルゴリズムを使用して最適化されます。このアルゴリズムは、Lossy、Glossy、Losslessの3つのレベルの最適化を提供します。 これについては後で詳しく説明します。
  • それは適応画像を提供します：それはプラグインの名前が由来するところです。 画像をアップロードして、フルサイズバージョンのページに追加するとします。 スマートフォンからページにアクセスするユーザーは、ラップトップを使用するユーザーと同じサイズの画像を表示する必要はありません。 プラグインがそれを処理し、デバイスが要求している正確なサイズで画像を提供します。 GTmetrixを使用して、「適切なサイズの画像」エラーが発生したことがありますか？ これについて正確に不平を言っています。 ShortPixel Adaptive Imagesは、数回クリックするだけでそのメッセージを取り除きます。

ショートピクセル適応画像

  • それはあなたが必要とするかもしれないすべての画像関連の問題を解決します：画像を圧縮して正しいサイズで提供することに加えて、画像はまだ多くの方法でさらに改善することができます。 ShortPixel Adaptive Imagesはそれも処理し、数回クリックするだけで次のことができます。
    • EXIF情報を削除する
    • WebP形式で画像を提供する
    • 画像の遅延読み込み
    • 画像をスマートにトリミング
    • 遅延読み込みから画像を除外します（画像を事前読み込みするのに便利です）

ShortPixelアダプティブイメージはどのように機能しますか？

説明したように、Webサイトのページの1つにアクセスするたびに、ShortPixel Adaptive Images（SPAI）はそのコードを分析し、元の最適化されていない各画像を適切なサイズの最適化された画像に置き換えます。 置き換えられた各画像は、ShortPixelCDNから提供されます。

SPAIはサーバー上のどのファイルにも触れません。 SPAIはその場で画像を最適化します。つまり、元の画像に戻したい場合は、単に画像を非アクティブ化できます。 これは詳細なプロセスであり、すべてのユーザーに対して完全に透過的です。

1.ユーザーが画像を含むページにアクセスします。

2.ページの読み込み中に、SPAIはコード上の画像のURLを探します。次に例を示します。

ショートピクセル画像コード

3.画像のURLを検出すると、その画像をShortPixelのサーバーに送信します。サーバーは画像を最適化し、ShortPixelのCDNに保存します。 この手順は、特定の画像サイズが初めて要求されたときにのみ実行されます。

4.次に、SPAIはURLを新しいURLに置き換えます。これは、最適化され、適切なサイズの画像を含むCDNを指します。

ショートピクセルイメージオプティマイザイメージの名前を変更

5.ページの読み込みが完了し、ShortPixelの高速CDNから画像が提供されました。

ShortPixelアダプティブイメージのインストールと設定

インストール

これは最も簡単な手順であり、他のプラグインと同じようにインストールされます。 これはあなたが探す必要があるページです：ShortPixel Adaptive Images – WordPress.org

設定する

オンボーディングウィザード

ShortPixel Adaptive Imagesを初めて使用する場合は、オンボーディングウィザードにリダイレクトされます。

shortPixelのインストール

この4ステップのウィザードは、SPAIを適切に構成して、すべての画像がCDNから最適化されて提供されるようにするのに役立ちます。

たとえば、すでにSPAIを使用していて新しいバージョンに更新した場合は、[設定]> [ShortPixel AI]に移動し、右上の[ヘルプ]メニューにある[セットアップウィザード]ボタンをクリックして、ウィザードを再起動できます。

ショートピクセルウィザード

ShortPixel Adaptive Imagesは、 （ShortPixel Image Optimizerとは対照的に）動作を開始するためにAPIキーを必要としないことに注意してください。 ShortPixelクレジットが使用されるようにするには、Webサイト/ドメインをアカウントに関連付けるだけで済み、それはオンボーディングウィザードによって自動的に行われます。

オンボーディングウィザードを完了したら、サイトのキャッシュをクリアして、最適化された画像が表示されるようにしてください。

設定

ShortPixel Adaptive Imagesは、オンボーディングウィザードでアクティブ化して設定した直後に魔法を実行し始めるため、非常に使いやすいです。 ONボタンなどをクリックする必要はありません。 ただし、SPAIには、画像の最適化を調整するための設定もいくつか用意されています。 アクセスするには、WordPress管理エリアにログインし、[設定]> [ShortPixelAI]に移動します。 最も重要な設定について説明するので、[圧縮]タブから始めます。

ショートピクセルアダプティブ画像圧縮タブ

  • 圧縮レベル：ここでは、画像に必要な圧縮レベルを選択できます。
    • Lossyは、ほとんどのユーザーにとって最良のオプションです。 非可逆アルゴリズムで処理された画像は、取得できる最適化された最小の画像です。 したがって、サイトの速度が最重要であり、最適化と画質の最適なバランスが必要な場合は、非可逆最適化を使用することをお勧めします。
    • GTmetrixまたはGooglePageSpeed Insightsを引き続き気にする場合は、光沢のあるものが最適ですが、ページ速度のわずかな低下は、一流の画質の妥協点として許容できると考えています。
    • ロスレスを使用すると、画像は元の画像とピクセルごとに同一になりますが、非可逆または光沢のある処理済みファイルと比較して、サイズの縮小が小さくなります。 画像をそのままにしておきたい場合は、このオプションを選択してください。
  • WebPサポート：WebP形式は、Googleが作成した画像形式であり、画質をほとんど損なうことなく優れた圧縮結果を得ることができます。 WebPの動作の簡単な例：インターネットから写真を撮り、ランダムなオンラインJPGからWebPへのコンバーターを使用して、1.05MiBから344KiBに変更し、67.93％削減しました。画質は、ほぼ同じです。 したがって、「WebPサポート」オプションをチェックすることにより、ブラウザに互換性がある限り、ShortPixelのCDNから提供される画像は.webp形式である必要があることをSPAIに通知します。

shortpixeljpgからwebpへのコンバーター

  • EXIFの削除：プラグインを使用すると、場所、作成者、カメラモデルなど、画像自体に埋め込まれている「余分な」情報を削除できます。この情報は通常は必要ありません。削除すると、画像の重量を減らすことができます。若干。 有効にすることをお勧めします。

次に、[動作]タブに移動します。 他の多くの調整の中で、次のことがわかります。

ショートピクセル適応画像

  • スマートクロップ：プラグインは、すべての画像が表示されていない場合を識別し、それに応じてクロップします。
  • ログインしたユーザー：デフォルトでは、ShortPixel AIはログインしている場合でも画像を提供して最適化します。ただし、CDNトラフィックとクレジットを保存したい場合は、このオプションを無効にするだけで、SPAIはログインした場合にのみ機能します-アウトユーザー（訪問者）。
  • LQ画像プレースホルダー：LQIPは低品質画像プレースホルダーの略です。 これらは非常に低品質の（したがって非常に軽い）画像であり、最初のページの読み込み時に読み込まれます。ページが完全に読み込まれると、完全な品質の画像に置き換えられます。 これは、知覚されるロード時間を増やすのに役立ちます。

次に、[エリア]タブに、解析および最適化する必要のある画像をSPAIに指示するためのあらゆる種類の設定があります。

  • SVG画像（これらは最適化されず、CDNにのみ保存されます）。
  • CSSの画像この場合、CSSファイル自体もCDNに保存されます。
  • JSブロックの画像
  • JSONデータの画像

最後に、[除外]タブに、最適化から画像を除外できるいくつかのフィールドがあります。

  • 除外されたセレクター：ここでは、SPAIが最適化から除外するCSSセレクターを記述できます。
    • 「遅延ロードしない」で記述した場合、そのようなセレクターは遅延ロードされませんが、最適化およびサイズ変更されます。
    • 「サイズ変更しない」で記述した場合、SPAIはそのような画像を最適化しますが、サイズ変更はしません。
    • 「完全に除外」で記述した場合、SPAIはそれらを完全に無視し、最適化やサイズ変更は行いません。
  • 除外されたURL ：SPAIで一部の画像をURLで無視する場合は、正規表現（たとえば、すべてのGIFまたはすべてのPNGを除外する）またはパス（たとえば、単一の画像を除外する）を使用して、画像を除外します。 。 プラグインには、このフィールドの使用方法に関する適切な説明が含まれています。必ずチェックしてください。

ショートピクセル画像チェッカー

すべての設定が完了したら、サイトの任意のページで最適化された画像のステータスを確認するための簡単なツールである新しい画像チェッカーツールを必ず確認してください。 ログイン中にページにアクセスするだけです。 ツールバーには、有名なShortPixelロボットがあります。

そのアイコンをクリックすると、画像チェッカーがオンになります。 画像ごとに「CDN」または「ORIGIN」のタグが表示されます。 「CDN」は、画像がShortPixelのCDNから最適化されて提供されることを意味し、「ORIGIN」は、サーバーから提供されること、つまり、ShortPixel AdaptiveImagesが画像を処理していないことを意味します。

shortpixel cdn

また、カーソルが十字（⌖）に変わり、画像をクリックすると、追加の情報とアクションが表示されます。

ショートピクセル最適化画像

価格とプラン

価格について話す前に、SPAIがその場で機能することを覚えておく必要があります。 フロントエンドから少なくとも1回表示された場合にのみ、画像を処理します。 それが発生するまで、画像は未処理のままであるため、クレジットは使用されません。

画像の処理とは、画像のスマートなトリミング（選択した場合）、サイズ変更、および最適化を意味します。 画像が処理されると、ShortPixel CDNサーバーに保存され、購入したCDNトラフィッククォータを使用してすべての人に提供できます。 利用可能なCDNトラフィッククォータが十分にある限り、最適化された画像はShortPixelのCDNから提供されます。

ShortPixelは、CDNクォータに変換されるクレジットを提供します。 ルールは単純です。5MBのCDNトラフィック= 1クレジット。 1回限りのクレジットと毎月のクレジットの両方を使用して画像を処理できます。

月額プラン

  • 無料プラン= 100クレジット= 500 MBのCDNトラフィック= 〜500訪問/月
  • $ 4.99 /月プラン= 5,000クレジット/月= 25 GBのCDNトラフィック= 〜25,000訪問/月
  • $ 9.99 /月プラン= 16,000クレジット/月= 80 GBのCDNトラフィック= 〜80,000訪問/月
  • $ 29.99 /月プラン= 55,000クレジット/月= 275 GBのCDNトラフィック= 〜275,000訪問/月
  • $ 99.99 /月プラン= 220,000クレジット/月= 1TBのCDNトラフィック= 〜1,100,000訪問/月

ワンタイムプラン

  • $ 9.99 –10,000クレジット= 50 GB = 〜50,000回の訪問
  • 19.99ドル–30,000クレジット= 150 GB =約150,000回の訪問
  • $ 29.99 –50,000クレジット= 250 GB = 〜250,000回の訪問
  • 99ドル–170,000クレジット= 850 GB =約850,000回の訪問
  • 249ドル–500,000クレジット= 5 TB =約2,500,000回の訪問

例：月に10,000回の訪問がある5000以上の画像を含む中規模のWebサイトを所有しているとします。

月額$ 4.99のプランでは、25 GBのCDNトラフィックが許可されます。これは、テストによると、月間約25,000回の訪問に相当します。

プランと料金について詳しくは、こちらをご覧ください。

その価値はありますか？

ウェブサイトの最も重い部分は常に画像であり、ウェブサイトの読み込みに1秒余分にかかると、ユーザーとコンバージョンが失われることを考慮すると、間違いなく価値があります。 これはインストールして忘れるプラグインであり、元のイメージに戻したい場合は、アンインストールするだけでうまくいきます。

さらに、彼らのサポートチームは素晴らしく、何十人ものユーザーがwordpress.orgでそれを保証することができます。

これは、Webサイトの速度を向上させ、Googleでの位置を高め、訪問者数を増やすのに役立つ、強く推奨されるプラグインです。 また、Cloudwaysなどの高品質のホスティングと組み合わせると、さらにエキサイティングな結果が得られます。

ShortPixel Adaptive Imagesのこのレビューが、サイトを超高速にするのに役立つことを願っています。