WordPressの最適化は困難な作業のように思えるかもしれません。プラグインを配置すると、すべてが壊れます。それはすぐに混乱する可能性があります。一部の画質プラグインは、画像を醜く、小さく、使用できなくします。あなたはパフォーマンスのためにウェブサイトの品質を失うことになります。心配する必要はありません。ワードプレスを最適化する方法と注意すべき点について段階的に説明します。
必要条件
- 自動最適化。プラグインを入手する ここに
- サーバーにインストールされたLiteSpeedキャッシュ(オプション)
- PerfMatters。プラグインを入手 ここに
- ShortPixel(Litespeedを使用してこのプラグインを置き換えることができます)
このプラグインを使用してWordPressサイトを最適化することを強くお勧めします。彼らは非常に便利であり、安価なコストであなたのウェブサイトのページを最適化することができます。
警告:これにより、WordPressサイトが破損する可能性があります。実行中のWebサイトに適用する前に、この設定を試すサンドボックスを作成してください。
自動最適化
Autooptimizeは重要なCSSを生成するのに最適なプラグインです。つまり、CSSコードのほとんどの不要な部分を削除します。また、JSコードを最適化し、縮小します。
JavaScriptオプション
いくつかのオプションはあなたのウェブサイトを壊すかもしれません。私はあなたがあなたのウェブサイトに適用する可能性が高い設定を色で配置しました。緑はウェブサイトを壊す可能性が低く、赤はウェブサイトを壊す可能性が高くなります。 Webサイトが壊れていることがわかっている場合は、壊れている.jsを確認して、「autoptimizeから除外する」ように追加してみてください。これでほとんどの問題が修正されます。
インラインJSも集計しますか? | |
---|---|
JSファイルを集約しますか? | すべてのリンクされたJSファイルを集約して、レンダリングされないブロッキングをロードしますか?このオプションがオフの場合、個々のJSファイルはそのまま残りますが、縮小されます。 |
インラインJSも集計しますか? | AutoptimizeもHTMLからJSを抽出します。 警告:これにより、Autoptimizeのキャッシュサイズが急速に増大する可能性があります。したがって、これを有効にしているのは、自分が何をしているのかを知っている場合のみです。 |
JavaScriptを強制 ? | JavaScriptを早期にロードします。これにより、一部のJSエラーが修正される可能性がありますが、JSレンダリングがブロックされます。 |
Autoptimizeからスクリプトを除外します。 | 最適化から除外するスクリプトのコンマ区切りリスト。たとえば、 'whatever.js、another.js'(引用符なし)は、Autoptimizeによる集約からそれらのスクリプトを除外します。重要:除外された非縮小ファイルは、「その他」のオプションが無効にされていない限り、Autoptimizeによって縮小されます。 |
try-catchラッピングを追加しますか? | JSエラーが原因でスクリプトが壊れた場合は、これを試してみてください。 |
CSSオプション
CSSオプション
CSSをインライン化して延期しますか? | |
---|---|
CSSファイルを集約しますか? | リンクされたすべてのCSSファイルを集約しますか?このオプションがオフの場合、個々のCSSファイルはそのまま残りますが、縮小されます。 |
インラインCSSも集約しますか? | Autoptimizeのこのオプションをチェックして、HTML内のCSSも集約します。 |
データの生成:画像のURI? | これを有効にして、個別のダウンロードとしてではなく、CSS自体に小さな背景画像を含めます。 |
CSSをインライン化して延期しますか? | メインの自動最適化CSSをページの読み込み後にのみ読み込みながら、「折りたたみCSSの上」をインライン化します。 よくある質問を確認 詳細については。これは、さまざまなタイプのページに対して完全に自動化できます。 クリティカルCSS タブ。 |
すべてのCSSをインライン化しますか? | すべてのCSSのインライン化は、CSSがレンダリングをブロックしないようにする簡単な方法ですが、HTMLのサイズが大幅に増加するため、一般的にはお勧めできません。さらに、FacebookやWhatsappなどがメタタグを見つけられなくなる位置までメタタグを押し下げ、共有時にサムネイルを壊す可能性があります。 |
---|
「インラインall css」は、読み込み時間が長くなるためお勧めしません。 「非同期」でロードすることもできますが、ページにロードされ、最初のペイントに時間がかかる場合があります。
HTML最適化
HTMLコードを最適化しますか? | |
---|---|
HTMLコメントを保持しますか? | HTMLコメントをページに残す場合は、これを有効にします。 |
htmlコメントは機能を持たない傾向があるため、保存しないことをお勧めします。
画像の最適化
いくつかのチェックボックスをオンにして画像を最適化して遅延読み込みするだけで、サイトを大幅に高速化できます。WebPサポートが含まれています。
画像を最適化する | オンザフライで画像を最適化し、ShortpixelのグローバルCDNから提供します。一般に公開されている画像をオンザフライで(「次世代」のWebP画像形式でも)最適化することで、Googleの愛情を高め、ウェブサイトの読み込み速度を向上させます。 ShortPixel 次に、キャッシュされ、ShortpixelのグローバルCDNから高速で配信されます。 今すぐサインアップ 使用されるトラフィックに関係なく、1 000ボーナス+ 50%以上の画像最適化クレジットを受け取ります。 $4.99以降、より多くの画像最適化を購入できます。ご質問?見てください ShortPixelのFAQ!公開されているサイト/画像でのみ機能します。この機能の使用はShortpixelの対象となります 利用規約 そして 個人情報保護方針. |
---|---|
画像の遅延読み込み? | 画像の遅延読み込みは、非表示の画像の読み込みを遅らせ、ブラウザが最初に「スクロールせずに見える範囲」ページのすべてのリソースを最適に読み込むことができるようにします。 |
これで、ウェブサイトの設定が完了するはずです。簡単で、それほど問題はありません。このプラグインも無料です。
言ったように、徹底的にテストしてください。これにより、一部の機能が壊れる場合があります。
追加の最適化
Googleフォント | そのままにする Googleフォントを削除 結合して先頭にリンク(フォントの読み込みは高速ですが、レンダリングをブロックします)、インクルード 表示:スワップ .結合してヘッドにプリロードします(フォントのロードは遅くなりますが、レンダリングをブロックしません)。 表示:スワップ .非同期でフォントを組み合わせて読み込む webfont.js |
---|---|
絵文字を削除 | WordPressのコアとなる絵文字のインラインCSS、インラインJavaScript、およびそれ以外は自動最適化されていないJavaScriptファイルを削除します。 |
静的リソースからクエリ文字列を削除する | クエリ文字列(より具体的には、 ver パラメータ)はロード時間を改善しませんが、パフォーマンススコアを改善する可能性があります。 |
今、トリッキーな部分が来ます。この部分は、自分が何をしているかについて確信がある場合にのみ実行してください。
tools.pingdom.comにアクセスして、Webサイトをテストします。

そのようなものが表示されます。これで、再接続またはDNSプリフェッチする必要があるリンクがあるかどうかがわかります。これは良い例です、なぜなら私たちのウェブサイトはグーグルフォントにのみ再接続するからです。これは、他のWebサイトへのDNSルックアップの作成に使用される時間が短縮されることを意味します。この場合はあまり関係ありませんが、この例では次のように記述できます。
fonts.gstatic.com、fonts.googleapis.com
また、リクエストをプリロードする必要があるかどうかがわかるので、Googleの速度に関する洞察を必ず聞いてください。 .jsまたは.cssをプリロードするよう提案されたら、「特定のリクエストをプリロード」に入力して入力します。私の場合、最初にレンダリングされるまでの時間を短縮するために、フォントが最初にロードされることを示唆しているので、フォントを配置します。
自動最適化を使用することの追加の利点の1つは、キャッシュファイルを生成する機会を与えることです。これは多くのファイルを作成する可能性があるため、Webサイトに役立つことを確認してください。追加、キャッシュを削除するたびに、ウェブサイトの読み込みに時間がかかります。 Webサイトへの訪問が多い場合、これによりWebサイトがクラッシュし、異常な量のCPUが使用される可能性があります。
Perfmatters
このプラグインには費用がかかります。しかし、それだけの価値があります。
オプション
有効にするパフォーマンスオプションを選択します。
絵文字を無効にする | 有効にする |
---|---|
埋め込みを無効にする | 有効にする |
クエリ文字列を削除する | 有効にする |
XML-RPCを無効にする | 有効にする |
jQuery Migrateを削除する | 有効にする |
WPバージョンを非表示 | 有効にする |
wlwmanifestリンクを削除 | 有効にする |
RSDリンクを削除 | 有効にする |
ショートリンクを削除 | 有効にする |
RSSフィードを無効にする | 有効にする |
RSSフィードリンクを削除する | 有効にする |
セルフピンバックを無効にする | 有効にする |
REST APIを無効にする | 有効にする |
REST APIリンクを削除する | 有効にする |
ダシコンを無効にする | 有効にする |
Googleマップを無効にする | 有効にする |
Googleフォントを無効にする | 有効にする |
パスワード強度メーターを無効にする | 有効にする |
コメントを無効にする | 有効にする |
コメントURLを削除 | 有効にする |
遅延読み込みベータ版 | 有効にする |
ネイティブを使用 | 有効にする |
ハートビートを無効にする | DefaultDisable EverywhereOnly投稿/ページ編集時のみ許可 |
ハートビート頻度 | 15秒(デフォルト)30秒45秒60秒 |
投稿の改訂を制限 | DefaultDisable Post Revisions123451015202530 |
自動保存間隔 | 1分(デフォルト)2分3分4分5分 |
ログインURLを変更 | セキュリティの目的で役立ちます。 |
これはあなたのウェブサイトに大きく依存します。あなたがグーグルマップを持っているか、グーグルフォントを必要としないならば、あなたのウェブサイトにとってそれがどのように最善であるかしてください。同様に徹底的にテストし、機能に影響がないことを確認します。
[その他]タブで[スクリプトマネージャ]を有効にします。
Googleでは「使用されていないcssファイルを削除する」または「使用されていないjsファイルを削除する」という警告が頻繁に表示されるため、この部分は非常に便利です。

この例では、ほとんどまったく使用されていないファイルがいくつかあります。彼らはそれが10.6 KBから10.3の可能な節約を持っていると言います、これはそれがおそらく安全に削除することを意味します。その際は十分にテストしてください。 Perfmattersは、直接無効にできるため、ここで役立ちます。
http://yourwpdomain.com/yourwpdirectory/fileyouwanttoeditにアクセスします?perfmatters
または単に追加 ?perfmatters 最適化したいページに。
ここに、ロードされているスクリプトが表示されます。

一部には次の情報があります。

そこで、未使用の.cssのgoogle提案と一致させることができます。あなたがあなたのウェブサイトに影響を及ぼさないと考えているすべての未使用のCSSを無効にします。また、.jsファイルでそれを行います。しかし、前に述べたように、設定ごと、ページごとに、どちらが機能し、どれが機能しないかを確認する必要があります。このプラグインは、使用されていない.jsおよび.cssファイルをすべて削除し、パフォーマンスを劇的に向上させます。
Shortpixel –画像の最適化
Shortpixelは、市場で最高の画像オプティマイザの1つです。これは私の設定です:

私の場合、画質を重視しています。そのため、画像のサイズを1025×1024に変更することにしました。ここに表示される設定のほとんどは、Webサイトに非常に役立ちます。
詳細ページ設定で、このオプションを有効にすることをお勧めします。
CMYKからRGBへの変換 | コンピューターおよびモバイル画面の表示用に画像の色を調整します。Web用の画像はRGB形式のみを必要とし、CMYKからRGBに変換すると画像が小さくなります。 |
---|---|
WebP画像: | フロントエンドで画像のWebPバージョンを配信します。 また作成 WebPバージョン 画像の、 無料で. を使用して グローバル(HTMLをブラウザーに送信する前に出力バッファー全体を処理します) |
Retina画像を最適化する | Retinaイメージ(@ 2x)が存在する場合は、それらも最適化します。Retina固有のイメージ(@ 2x)を生成するRetinaプラグインがある場合、ShortPixelは、通常のメディアライブラリイメージやサムネイルとともに、それらも最適化できます。 より詳しい情報 |
他のつまみを最適化する | 一部のプラグインは、メタデータに登録されていないサムネイルを作成し、代わりに他のサムネイルと一緒にのみ作成します。 ShortPixelもそれらを最適化します。 |
PDFを最適化する | PDFドキュメントを自動的に最適化します。 |
「PNG画像をJPEGに変換」を有効にする場合は、背景が透明な画像を改ざんすることがあるので、十分に注意してください。
これらも有効にする必要があります。
アップロード時にメディアを最適化する | アップロード後にメディアライブラリアイテムを自動的に最適化します(推奨)。デフォルトでは、ShortPixelは新しくアップロードされたすべての画像とPDFファイルを自動的に最適化します。これをオフにした場合は、Bulk ShortPixelを実行するか、(リストビューで)メディアライブラリに移動して、右側の[今すぐ最適化]ボタンをクリックする必要があります。 |
---|---|
フロントエンドでのプロセス | フロントエンドのユーザーによって追加された画像を自動的に最適化します。フロントエンドのカスタムフォームから画像またはPDFドキュメントを追加するユーザーがいる場合は、これをチェックします。多数のユーザーが同時に接続している場合、サーバーの負荷が増加する可能性があります。 |
LiteSpeedキャッシュ
このプラグインは、Litespeedサーバーがある場合にのみ使用してください。応答時間を劇的に短縮します。
キャッシュに移動し、「キャッシュ制御設定」のすべての設定を有効にします。同様に、キャッシュ制御設定を有効にします。詳細については、 Litespeedウェブサイト。