Quicqレビュー：リアルタイムのWordPress画像の最適化
公開: 2022-02-14平均して、画像が平均的なWebページのファイルサイズの約半分を占めることをご存知ですか？
つまり、最適化されていない画像を使用している場合、それらの画像はWebサイトの読み込み時間に大きな悪影響を与える可能性があります。
Quicqは、サイトの画像をリアルタイムで完全に最適化し、Google Cloudを利用したコンテンツ配信ネットワーク（CDN）から提供できるAfostoのサービスです。 パフォーマンスだけでなく、画像のトリミング、透かしの追加など、画像を簡単に操作するためにも使用できます。
専用の統合プラグインや、MagentoやPrestaShopなどの他のプラットフォームを介してWordPressと連携します。
Quicqの実践的なレビューでは、Quicqがどのように機能し、WordPressサイトの画像を最適化するためにどのように使用できるかを示します。
掘り下げましょう…
Quicqレビュー：プラグインの機能
大まかに言えば、QuicqはWordPress画像最適化のための完全なソリューションを提供することに焦点を当てています。 これは基本的にプラグアンドプレイツールであり、重要な画像最適化戦術のすべてから利益を得ることができます。以下で詳しく説明します。
画像の最適化に関して、ほとんどの人が考える2つの「主な」戦術があります。
- サイズ変更–サイトでの使用方法に合わせて、画像の実際のサイズを変更します。 寸法が小さいほどデータが少なくなり、画像サイズが小さくなります。
- 圧縮–圧縮アルゴリズムを使用して、可逆アルゴリズム（品質の変更なし）または非可逆アルゴリズム（品質のわずかな低下）のいずれかにより、サイズを変更せずに画像のファイルサイズを縮小します。
Quicqは確かにこれらの戦術を実装できますが、画像の静的なサイズ変更と圧縮を超えた新しい種類の画像最適化プラグインの1つでもあります。
代わりに、Google Cloudを利用したCDNから画像を自動的に提供し、訪問者向けにリアルタイムで最適化します。
サイトでQuicqをアクティブ化するとすぐに、次の最適化ですべての画像が自動的に最適化されます。
- GoogleCloudを利用したQuicqCDNを介してサービスを提供します。 これにより、訪問者は自分に最も近いCDNの場所から画像をダウンロードできます。
- 各訪問者のデバイスに基づいて、それらのサイズを最適なサイズに変更します。
- それらを圧縮してファイルサイズを小さくします。
- それらをJPEGやPNGよりも小さいサイズを提供する最適化された画像形式に変換します。 Quicqは、WebPとAVIFの両方をサポートしています。これは、WebPよりもさらに小さいファイルサイズを提供できる新しい画像形式です。 すべてのサービスがこの新しい画像形式をまだサポートしているわけではないため、AVIFのサポートは注目に値します。
これらすべての変更により、画像の読み込み時間が大幅に短縮されます（その結果、Webサイトの読み込み時間が大幅に短縮されます）。
動的リアルタイム画像最適化を使用する理由
上で述べたように、Quicqはリアルタイムで画像を最適化する動的最適化アプローチを使用しています。
つまり、従来の最適化プラグインのようにWordPressサイトのサーバーで画像の元のバージョンを最適化するのではなく、Quicqは元の画像に触れず、代わりに「クラウド」で操作を実行します。
この動的最適化アプローチにはいくつかの利点があります。
大きな問題は、すべての訪問者が実際のデバイスの寸法に基づいて最適化された画像を確実に表示できることです。
たとえば、訪問者が低解像度のスマートフォン画面で閲覧している場合、エクスペリエンスに影響を与えることなく、小さなサイズの画像を提供できます。
ただし、訪問者が4Kの巨大な画面を閲覧している場合、サイトは画像のより大きなバージョンをシームレスに提供して、ユーザーエクスペリエンスも優れていることを確認できます。
Quicqは動的なオンザフライ最適化アプローチを使用しているため、個々のユーザーに最適な画像サイズとフォーマットを提供できます。
この動的なアプローチは、元の画像ファイルを編集したり、新しいバージョンの画像をアップロードしたりすることなく画像に変更を加えることができるため、画像を操作する場合にも非常に役立ちます。
たとえば、画像のURLを操作するだけで、次の操作を実行できます。
- さまざまな方法で画像を切り抜きます。
- 透かしを追加します。
- 画像をぼかします。
- 画像のサイズを変更します。
- 画質を調整します。 たとえば、一部の場所で高解像度の非圧縮画像を使用したい場合があります。 あなたはそれを簡単に行うことができます。
- 別の画像形式を使用してください。 たとえば、WebPやAVIFです。
Quicqを使用すると、元の画像を1回アップロードするだけです。 次に、URLにいくつかのクエリパラメータを追加することで、これらすべての操作を実行できます。
たとえば、元の画像へのリンクは次のとおりです。
https://cdn.quicq.io/wpmayor/2022/01/pexels-andrea-piacquadio-837358.jpg
そして、画像を1,000×1,000の正方形にトリミングするリンクは次のとおりです。
https://cdn.quicq.io/wpmayor/2022/01/pexels-andrea-piacquadio-837358.jpg?w=1000&h=1000&c=1
次のセクションでは、実際の例をいくつか紹介します。
Quicqの実践：WordPress画像を最適化する方法
Quicqの機能がわかったところで、実際に見てみましょう。WordPressでどのように機能するかを説明します。
繰り返しになりますが、WordPressに限定されるものではありませんが、WordPressサイトで非常に簡単に使用できる専用のWordPressプラグインを提供します。
1.無料のQuicqアカウントに登録する
開始するには、無料のQuicq/Afostoアカウントに登録する必要があります。 次に価格についてお話しますが、寛大な永久無料プランがあり、14日間の無制限の無料トライアルも受けられます（クレジットカードは必要ありません）。
アカウントに登録したら、AfostoダッシュボードのQuicqの横にある[無料試用を開始]ボタンをクリックします。
2.QuicqCDNを作成します
次に、Quicq CDNを作成する必要があります。これは、基本的に、サイトの画像を提供および最適化するものです。
Quicqトライアルを開始すると、これを行うためのタスクがメインのAfostoダッシュボードのタスクリストに自動的に表示されます。 表示されていない場合は、Quicqの横にある歯車のアイコンをクリックしてこのインターフェースにアクセスすることもできます。
まず、QuicqCDNに使用するURLを入力する必要があります。 画像はこのURLから読み込まれるため、ウェブサイトに関連するようにする必要があります。
たとえば、WP Mayor用に作成する場合、URLをwpmayorにします。
次に、サイトの既存の画像への直接URLを入力し、[ Webサイトの検証]をクリックします。
Quicqは、WordPressを使用していることを自動的に検出し、画像へのパスを生成します。これは、 wp-contentフォルダー内のuploadsフォルダーである必要があります。
詳細設定を展開するオプションもあります。これにより、画像のキャッシュ動作を制御できます。 デフォルトは365日ですが、これで問題ありません。 ただし、必要に応じてこれを変更できます。
完了するには、[追加]ボタンをクリックします。
3. Quicqプラグインをインストールし、URLキーを追加します
アカウントを作成してCDNを設定したら、WordPress.orgから無料のQuicqプラグインをサイトにインストールできます。 これにより、WordPressサイトを作成したばかりのイメージCDNと統合できます。
プラグインをアクティブにしたら、WordPressダッシュボードの新しいQuicq領域に移動し、セットアッププロセスで入力したURLキーを追加します。 つまり、カスタマイズできたCDNURLの部分です。
私の例では、それはwpmayorです。
次に、[アクティブなQuicq]トグルを選択し、[変更を保存]を選択してライブにします。
以上です！ これで、WordPressサイトは、リアルタイムの画像最適化を含むQuicqCDNを介して画像の読み込みを開始するはずです。
ここで私が注意するマイナーなことの1つは、Quicqプラグイン領域がWordPressダッシュボードのトップレベルのメニュー領域であるべきではないと思うことです。 これは1回限りのセットアッププロセスなので、ユーザーがよりクリーンな管理領域を使用できるように、 [設定]→[Quicq ]などのサブメニューに移動する方がよいと思います。
4. URLパラメータを使用して画像を操作する（必要な場合）
ほとんどのWordPressサイトでは、画像を最適化するために他に何もする必要はありません。 この時点で、Quicqはすでに次の最適化を自動的に実行しています。
- 各ユーザーのデバイスに基づいて最適な方法で画像を圧縮/サイズ変更します。
- 最適な方法に応じて、画像をWebPまたはAVIF形式に変換します。
- QuicqのGoogleCloudCDNを介して画像を提供します。
ただし、前述したように、Quicqのリアルタイムアプローチの優れた点の1つは、URLにクエリパラメータを追加するだけで画像を操作できることです。
詳細については、こちらのドキュメントページをご覧ください。ただし、これがどのように機能するかの簡単な例をいくつか見ていきましょう。
サイトの一部で使用する幅の広い画像があるとします。 ここで、同じ画像を使用しますが、正方形の画像に切り抜きます。
Quicqがない場合は、お気に入りの画像編集ツールを開いて画像を切り抜いてから、切り抜いた画像の新しいコピーをアップロードして使用する必要があります。
Quicqのリアルタイム画像処理を使用すると、URLパラメータを追加するだけで（元の画像に影響を与えることなく）トリミングを実行できます。
元の画像とURLは次のとおりです。
そして、このURLパラメータを追加して1000×1000ピクセルの正方形にトリミングしたときの画像は次のようになります– ?w=1000&h=1000&c=1 ：
別の例を示します…
正方形にトリミングするだけでなく、さらに一歩進んで画像をぼかしたいとします。
ぼかしパラメータを追加し、使用するぼかしの量（0から3）を設定するだけで、画像がぼやけます。
Quicqの価格
Quicqには、かなり寛大な永久無料プランと、より多くの機能を必要とするユーザー向けの有料プランがあります。
無料プランでは、 1か月あたり最大100,000枚の画像*を最適化し、1か月あたり25 GBのCDN帯域幅を永久に提供できます。これは、小規模なサイトには十分すぎるはずです。 たとえば、基本的なパンフレット/ポートフォリオサイトや小さなブログをお持ちの場合、それを超えることはないと思います。
*画像の最適化は、従来のプラグインのように1回ではなく動的に行われるため、画像が読み込まれるたびに1回の最適化としてカウントされることに注意してください。
有料プランが必要な場合は、次の2つの指標に基づいて請求されます。
- 最適化–1か月あたりの画像の最適化の数。
- データ転送–CDNを介して提供されるときに画像が消費する帯域幅の量。
この課金戦略は、他のリアルタイム画像最適化プラグインよりも少し複雑です。このプラグインは通常、サイトの1か月あたりの訪問数に基づいて課金します。
ただし、実際には、この課金モデルの方が気に入っています。これは、使用量の見積もりが少し難しくなる場合でも、より公平な課金方法だと思うからです。
このアプローチでは、実際の使用量に基づいて請求されるだけで、おそらくお金を節約するのに役立ちます。
支払う金額を確認するには、料金ページの計算機を使用できます。
サイトの使用状況がわからない場合は、無料利用枠を使用して開始するか、使用率の高いプランの14日間の無料トライアルを利用して、サイトの使用状況を十分に理解することができます。
プレミアムプランが必要な場合は、専用クーポンコードを使用して、すべてのパッケージで最初の2か月を20％オフにすることができます。
Quicqに関する最終的な考え
全体として、多くのサイトがこのリアルタイムの画像最適化アプローチに移行していることを私は知っています。
このアプローチは、画像を操作し、各訪問者がそれぞれの状況に合わせて最適化された画像を確実に表示できるようにするという点で柔軟性があるため、多くのメリットがあると思います。
QuicqはこれをWordPressに導入した最初のプラグインではありませんが、いくつかのことがあります。
- 非常に寛大な無料利用枠があります。 それは私が見た中で最高の無料利用枠を持っています。
- 実際の使用量に基づいて支払うだけなので、プレミアムオプションの価格設定モデルが気に入っています。 価格設定は少し複雑になりますが、請求には「より公平な」方法だと思います。 さらに、支払う金額がわからない場合は、いつでも14日間の無制限トライアルを使用してサイトの実際の使用状況を把握できます。
- それでも、トリミング、ぼかしなどの他の画像操作を実行できます。 私が知っている他のWordPressプラグインのほとんどは、パフォーマンスのみに焦点を当てているか、透かしへのアクセスのみを提供しているため、Quicqがそれを超えているのは素晴らしいことです。 ほとんどのカジュアルユーザーはおそらくこれらを使用しませんが、上級ユーザーや開発者にとっては便利です。
試してみたい場合は、Quicqに寛大な永久無料プランと、使用状況を把握するのに役立つ14日間の無制限の無料トライアルがあります。 下のボタンをクリックして開始できます。