WordPress を使用して独立した Web サイトを構築します。速度を向上させたい場合は、次の 3 つのレベルから始めることができます。
1. サーバー側
独立したウェブサイトを構築する前に、よりパフォーマンスの高いサーバーを購入しようとします。
2. 独立局番組
プログラムレベルではWordPressやテーマ、プラグインなどを使用します。
3. 独立したウェブサイトの資料
これは主に、後からページや商品を構築したときにアップロードした写真、ビデオ、その他の資料を指します。
上記の 3 つのレベルは、当社の独立した Web サイトの速度に影響します。この記事では、主に Converter for Media 画像圧縮プラグインを使用して、画像素材のサイズ圧縮の問題を解決します。
メディア用コンバータプラグインのインストール:
バックグラウンドでプラグインを直接見つけて、「新規追加」をクリックします。このプラグインの商用バージョンを使用する必要はありません。無料バージョンを使用できます。
このプラグインの名前はConverter for Mediaです。その後、直接検索したところ、このプラグインは400,000件以上インストールされており、レビューも非常に良いことがわかりました。次に、このプラグインは2つの役割を果たします。1つ目は、写真の品質を圧縮することです。2つ目は、写真をWebpやAVIFなどの最新の画像形式に変換することです。ここでできること:このプラグインを直接インストールして、インストールが成功した後にアクティブ化できるようにします。アクティブ化後、いくつかのプロンプトが表示され、オフにすることができます。
メディア用コンバータプラグインの設定:
次に、設定には追加のメディアコンバーターがあります。これはその構成インターフェイスですが、現在の問題についてのいくつかのリマインダーがあります。もちろん、これらについて心配する必要はありません。このプラグインをインストールすると、2つの期間にわたって独立ステーションの画像を圧縮するのに役立ちます。1つ目は、以前の独立サイトにアップロードされた画像を圧縮することです。2つ目は、後でアップロードする画像を設定することができ、デフォルトで圧縮するのにも役立つため、ここでは設定するだけで済みます。
1 つ目は、写真を圧縮する形式です。最初のタイプは圧縮がわずかで、真ん中のタイプは一般的な圧縮用です。写真の解像度が保存されるだけでなく、圧縮がきつすぎるということはありません。通常、デフォルトで中程度のものを使用します。もちろん、よりハイエンドのものもあります。品質のみを重視し、写真を小さく圧縮しますが、解像度が一定の影響を与える可能性があります。そのため、ここではデフォルトで 2 番目のものを選択します。
Webp および AVIF 画像形式:
では、あなたの画像はどのような形式で圧縮されているのでしょうか? 圧縮形式には2種類あります。1つはwebp、もう1つはAVIFです。ただし、AVIFの場合はPRO版を購入する必要がありますが、PRO版にはGPL版がないため、一時的にPRO版を使用できません。予算に余裕があればPRO版を購入することもできますが、一般的な独立局では無料版で十分です。
AVIF 形式は webp よりもパフォーマンスが高いですが、当社のほとんどの独立サイトでは、webp 形式はすでに Google のパフォーマンス最適化の基準を満たしているため、デフォルトで直接 webp を選択しています。次に、圧縮するファイル、圧縮されるファイル、ディレクトリ内の画像、通常の独立サイト上の画像、テーマ上の画像でも、後で更新する製品の画像でも、すべてフォルダー内のアップロードに配置されます。
サイトでは画像ファイルを圧縮する必要があります:
もちろん、テーマやプラグインには画像が付属しているものもありますので、この2つもチェックしてみてください。上記は、弊社のキャッシュプラグインです。圧縮もできます。通常は、お客様のニーズに合わせてアップロードを圧縮できます。
次は、写真のサイズを制限できる PRO 機能です。
圧縮可能な画像の数:
もう 1 つは新しい画像です。これは、後でアップロードする新しい画像を指します。直接圧縮するのにも役立ちます。通常はデフォルトでチェックする必要があります。その後、説明が下に表示されます。次に、アップロード フォルダーについて説明します。このフォルダーには、圧縮する必要がある 2132 枚の写真があります。
通常、このプラグインをインストールすると、このボタンをクリックでき、アップロード時にファイルを直接最適化できます。もちろん、ここにあるファイルは主に圧縮された非Webpファイルです。2,000を超えるファイルの中には、WebPに圧縮された写真がいくつかあり、現在1474が残っているので、直接圧縮できますが、なぜこのボタンが灰色に変わるのですか?
画像圧縮モード:
これは、私たちが直面しなければならない問題のためです。サーバーが Apache システムではなく Nginx を使用するように指示されるため、その指示に従う必要があります。詳細設定では、実際には 2 番目の設定です。詳細設定では、Nginx をバイパスする必要があるため、2 番目のオプションを選択し、選択後に保存します。
圧縮する画像形式:
これでリマインダーは表示されなくなり、下に戻ります。このボタンをクリックして画像を直接圧縮できます。ここにも説明があります。ここで、すでに圧縮されている画像を再度圧縮することもできます。デフォルトではチェックされていないため、[圧縮] をクリックします。ここでは圧縮しないようにしましょう。まずは他の設定を見てみましょう。詳細設定に入りましょう。たとえば、最初の項目は、圧縮する画像の種類です。通常の .jpg または .jpeg、この種の画像は圧縮できますが、.png にすることもできます。
もちろん、GIF 画像は当社のアニメーション画像であり、圧縮することもできます。その後、Webp をチェックすることもできますが、Webp は最終的に再度圧縮します。AVIF 形式に圧縮する必要がありますが、AVIF 形式は PRO バージョンである必要があります。PRO バージョンのみを使用でき、その PRO バージョンは比較的高価です。主に会社の予算に依存します。会社に予算がある場合は、PRO バージョンを購入できます。ここでは、無料バージョンを直接使用します。
次のステップは圧縮方法です。通常、PHP コンポーネントにはデフォルトの GD ファイルがあります。この GD ファイルは圧縮できますが、上記の Imagick 圧縮よりも柔軟性が高くないため、デフォルトでは Imagick が選択されています。コンポーネントがない場合は有効にして、サービス プロバイダーを入力できます。存在しない場合は、GD 圧縮を使用できます。
どのようなシステムを使用していますか?Nginxを使用している場合は、Nginxをバイパスできます。通常、このプラグインはApacheでのみ圧縮できるため、ここではデフォルトで2番目を選択します。次に、次の他の設定があります。ここでは、デフォルトで最初のものを選択します。サイズを超えた場合は、直接削除します。次は統計情報なので、心配する必要はありません。次に、[保存]をクリックします。3つ目は、プラグインが正式にCDNを提供するため、写真をサーバーに置いてから呼び出すことができることです。もちろん、Cloudflareを使用することもできます。もちろん、次のコースで無料のCDNについて説明します。
もう一つはヘルプセンターです。
メディア画像圧縮デモ用コンバータ:
設定が完了したら、写真を圧縮して、クリックして圧縮を開始しましょう。圧縮が成功すると、1470 枚の写真が圧縮されたが、いくつかの個別の写真が失敗したことが通知されます。心配する必要はありません。助けてください。これにより 19 MB のスペースが節約されるため、写真の読み込みが 19 MB 少なくなり、独立ステーションの速度が向上します。
さて、これがメディアプラグインのコンバーターの使用方法です。
そのため、実際、当社の独立した Web サイトを運営する通常のプロセスでは、写真の品質を維持し、独立した Web サイトの速度に影響を与えないようにするために、通常、次の 3 つのプロセスを実行します。
最初のプロセスは、あなたの独立ステーションが運営されているときに、あなたの写真については、特定のサイズの写真のみをアップロードできると規定しているため、この写真が正常であれば、Photoshopを使用して直接処理します。たとえば、現在表示されている写真の場合、この写真を独立サイトにアップロードする場合は、まず写真のサイズを確認しましょう。写真は現在132kです。それほど大きくはありませんが、まだ変更できます。圧縮して設定します。
WordPress 画像の最適化プロセス:
まず、最初のステップは、エディターまたはアーティストにとってのものです。次に、画像が特定のサイズ内に収まるように要求します。たとえば、この画像を少し小さくして、Photoshop を使用して直接調整することができます。
800から449まで調整できます。調整が完了したらエクスポートすると、画像が正常になり、メディアを使用できます。.jpgを使用している場合は、現在の品質サイズを確認できます。わずか47kで、フォルダーに保存、インポート、エクスポートします。次に、フォルダーに入り、ファイルサイズを確認します。この画像はわずか48kです。これが画像処理の最初のステップです。当社の独立サイトの画像のサイズは固定されており、アーティスト、オペレーションスタッフ、または編集者にサイズに応じてアップロードするように依頼し、大きすぎないようにすることができます。
2 番目のステップは、画像を圧縮することです。ここでは、圧縮ソフトウェアの無料 Web 版であるツールを共有しています (アドレス:pixelied.com/convert/)。たとえば、ここでは、JPG などのファイルを選択し、それらを webp または PNG に圧縮してファイルを選択できます。今変更した画像を見つけて、もう一度圧縮します。圧縮が完了したら、ダウンロードして保存します。
ここで、もう一度フォルダーに入ると、追加の webp 画像があります。これら 2 つの画像の解像度はあまり変わっていませんが、品質が低下していることがわかります。もちろん、品質は変わっていません。画質により圧縮可能なスペースが比較的小さい JPG を使用しているため、変化は非常に小さいです。.png の場合、圧縮は非常に明白です。これが 2 番目のステップです。
3 番目のステップは、先ほど説明したプラグインを使用して再度圧縮し、アップロードする最終画像が解像度に影響を与えずに最小サイズに保たれるようにすることです。これにより、独立したサイトのパフォーマンスや読み込み速度に影響が及ぶことはありません。