WordPress ページの読み込み時間を短縮する方法

この記事をまとめる前に、ブログのページの読み込み時間を再確認する必要がありました。まあ、私はある程度の速度が好きなので、ページのパフォーマンスが最適でない場合は、おそらく心配して寝ることになるでしょう。そして、私はピンダムで 73/100 点を獲得したばかりなので心配です。やるべきことがいくつかあるようですが、私のことはこれで十分です。Web サイトが遅い場合は、次の理由で心配する必要があります。

Google はウェブサイトをランク付けする際にページ速度を考慮します
ウェブサイトが遅いと収益源が失われる

遅い Web サイトを好む人はいませんし、それは事実です。遅い Web サイトがあなたのお気に入りの 1 つではないことは間違いありません。辛抱強く使い続けていれば、Web サイトが遅いと気が狂ってしまう可能性があります。とはいえ、Web 訪問者により高速で充実したエクスペリエンスを提供するには、WordPress Web サイトのページ読み込み時間を短縮するにはどうすればよいでしょうか?

今日の投稿では、WordPress サイトを高速化するために使用できる 10 個以上のトリックを公開します。これらのポイントをいくつか押さえて実行すれば、大丈夫です。

最適な WordPress ホスティングを選択してください

最適な WordPress ホスティングを選択する際には、考慮する必要がある要素がいくつかあります。誤って標準以下の Web ホスト (または負担の大きい共有ホスティングプラン) を選択した場合、意味することは 1 つだけです。その特定の Web ホストを使用している限り、遅いサイトを我慢しなければならないということです。

使い始めるとき (または試してみるとき) には、安価な共有ホスティングプランが適していますが、究極のパフォーマンスを得るには、WPEngine などのマネージド WordPress ホストが必要になります。

しかし、専用サーバーまたは VPS (仮想プライベートサーバー) ホスティングプランはどうなるでしょうか?

まあ、マネージド WordPress ホスティングに匹敵するホスティングプランはありません。 WPcurve.com は、WPEngine に移行した日から速度が 54% 向上したことに注目しました。私たちのウェブサイトの読み込み速度がどれほど速いかに気づきましたか?それは私たちも WPEngine を使用しているからです。

あなたのサーバーがページ速度の問題の中心にあるかどうかをどうやって判断できるのでしょうか? Google PageSpeed Insights を使用してドメインをチェックし、「サーバーの応答時間」が問題となる場合は、Web ホストの変更を検討する必要があります。

使用しないWordPressプラグインを削除する

ページ速度の向上に関して大きな成果を得るには、プラグインのインストール時に注意する必要があります。 WordPress プラグインに関しては、従うべき原則が 2 つあります。

不要なプラグインを有効にしないでください
いくつかのプラグインは面倒なのでインストールするものに注意してください

WordPress Web サイト上のすべてのプラグインを調べてみると、すべてが必要なわけではないことがわかります。たとえば、Yoast の WordPress SEO を使用している場合は、XML サイトマッププラグインは必要ありません。別の例: Akismet は優れたスパム対策プラグインですが、コメントプラグイン (Disqus など) が優れたスパムフィルタリングシステムを備えている場合は必要ありません。フォローしていますか？

さらに、WordPress Web サイトのリンク切れをチェックするのにプラグインは必要ありません。W3C Link Checker を使用すると、オンラインで簡単にチェックできます。 WordPress プラグインをクリーンアップし、めったに使用しない、またはまったく使用しないプラグインをアンインストールします。 WordPress インポーター や Ultimate Coming Soon などのプラグインは、ウェブサイトの速度を低下させる必要はありません。このようなプラグインは、その目的を終えたらアンインストールしてください。

あなた (または WordPress 開発者) が特定の機能を Web サイトに直接統合でき、Web サイトの速度を低下させる可能性のあるプラグインを削除できるのが最善です。ご存じなかった方もいるかもしれませんが、プラグインは、ページの上部にあらゆる種類の CSS コードや JavaScript コードを挿入することで有名です。これは、ページの読み込み速度に悪影響を与える可能性があります。

重要: サイト上で多数のプラグインをアクティブにすることは何も悪いことではありません。問題は、コーディングが不十分なプラグイン、同じタスクを実行する複数のプラグイン、または機能を追加するプラグインが多数あることです。サーバーにストレスがかかります。

サーバーへの HTTP リクエストを削減する

あなたの Web サイトでは、最初のインスタンスを表示するために 1,000 個のファイルが必要ですか?もしそうなら、ページの読み込み時間において貴重な数秒をロスすることになります。目的にとって不必要なものはすべて削除しますが、それが難しい場合は、テーマを新たにコーディングすることを検討してください。このときのみ、サイトを表示するために必要なファイル数に上限を設けてください。

Web サイトで使用するすべてのファイル (CSS、JavaScript、画像など) により、ページの読み込み時間が長くなります。ページ速度を上げるには、使用するファイルをできるだけ少なくする必要があることは言うまでもありません。 Web サイト全体でこれをハッキングできない場合は、最も人気のあるページでいくつかのファイルを使用してください。これには、ホームページや製品ページが含まれます。

画像を最適化する

ファイルとそれがページの読み込み時間に与える影響については、画像がページの速度に大きな影響を与える可能性があります。画像パフォーマンスを最適化するための WordPress プラグインで発見したように、「…最適化されていない画像を含む Web サイトは完全に足を引っ張り、貴重な帯域幅を消費し、ほぼすべての速度が低下し、ユーザーエクスペリエンス (UX) を台無しにします。」

アップロードする前に、画像を WordPress 用に最適化し、圧縮するか、Web 用にファイルを保存してください。 Web 用にファイルを保存する方法がわからない場合は、「Web 用に保存」オプションが Photoshop や Gimp などのほとんどの画像編集プログラムに共通の機能です。

もう一つ重要なこと。本当に必要なものよりはるかに大きい画像を使用するのはやめてください。 150 x 150 のサムネイルが必要な場合は、アップロードせずに 300 x 300 の画像を縮小してください。世の中には非常に多くの（そして無料の）画像ツールがあるので、画像を最適化しない言い訳はまったくありません。どこを見ればよいかわかりませんか?以下にいくつかの例を示します。

Pix Resizer (bluefive.pair.com でダウンロード)
画像オプティマイザー
WordPress 画像の最適化について詳しく学び、WordPress ウェブサイト用の 10 個の無料画像最適化プラグインを手に入れましょう。

広告も重要です

広告は多くの Web サイトにとって大きな収益源ですが、ページの読み込み時間に悪影響を与える可能性もあります。最適化された画像を使用して宣伝している製品またはサービスに直接リンクすることは、Web サイトでオファーを宣伝する最良の方法です。あるいは、テキストリンクを使用すると、ページの速度を大幅に向上させることができます。テキストリンクの唯一の問題は、画像がテキストよりも注目を集めるため、広告収入が 1 ～ 2 回打撃を受ける可能性があることです。

外部サーバーで実行されるサードパーティの広告ネットワークに大きく依存すると、ページの速度が低下します。同時に、ローカル広告トラッキングコードを Web サイトに追加すると、パフォーマンスが低下する可能性があります。何をするか？オファーを宣伝するには、最適化されローカルにホストされている (つまり、サーバー上でホストされている) 画像を使用します。 Pretty Link Pro などのプラグインを使用すると、いつでも広告を追跡できます。

重要なポイント: サーバーに負荷をかける広告の数を減らすか、サーバーリソースに負担をかけない広告のみを選択します。

Gzip圧縮をオンにする

紙を部屋中に思いっきり投げつけるように指示された場合、あなたは紙を軽くくしゃくしゃにしますか、それとも全力で握りますか?そう、ハルクスマッシュを発動するのです。

前の引用は Willie Jackson によるもので、これと同じ原則が Gzip 圧縮にも当てはまります。この機能は、Web サイト訪問者に Web サイト (すべてのファイル) を送信する前に、Web サイト (すべてのファイル) を圧縮するようにサーバーに指示します。その後、Web サイトはブラウザレベルで解凍されます。

Gzip 圧縮は、WordPress サイトを高速化する優れた簡単な方法です。 http://yourdomain.com/wp-admin/options.php の WordPress オプション画面に移動し、gzipcompression の値を変更するだけです。 >フィールドは 0 から 1 までです。http://yourdomain.com を独自のドメインに置き換えます。明らかに、これを機能させるには、まずサイトにログインする必要があります 🙂

キャッシュとコンテンツ配信ネットワーク (CDN) を活用する

WordPress のキャッシュには、静的ファイルの一部 (画像、スクリプトなど) が指定された期間、ユーザーのデバイスに保存されます。後日ユーザーが Web サイトにアクセスしたとき (キャッシュされたファイルの有効期限が切れていない場合)、ユーザーはサーバーからファイルをダウンロードする必要がないため、Web サイトの読み込みが速くなります。

WordPress ウェブサイトでキャッシュを有効にするのは非常に簡単です。内部的に知りたい場合は、以下のコードを .htaccess ファイルに配置して、ブラウザのキャッシュを有効にすることができます。

## EXPIRES CACHING ##

<IfModule mod_expires.c>

ExpiresActive On

ExpiresByType image/jpg "access 1 year"

ExpiresByType image/jpeg "access 1 year"

ExpiresByType image/gif "access 1 year"

ExpiresByType image/png "access 1 year"

ExpiresByType text/css "access 1 month"

ExpiresByType text/html "access 1 month"

ExpiresByType application/pdf "access 1 month"

ExpiresByType text/x-javascript "access 1 month"

ExpiresByType application/x-shockwave-flash "access 1 month"

ExpiresByType image/x-icon "access 1 year"

ExpiresDefault "access 1 month"

</IfModule>

## EXPIRES CACHING ##

コードは Kevin Muldoon の提供によるものです。上記のコードは、各ファイルタイプがキャッシュされる期間を指定します。あるいは、次のような WordPress キャッシュプラグインを使用して、数分でキャッシュを有効にすることもできます。

W3 合計キャッシュ
WPスーパーキャッシュ
WP最速キャッシュ

ちなみに、キャッシュプラグインはファイルの静的 HTML バージョンを公開するため、サーバー呼び出しの必要がなくなります。キャッシュするとすぐに速度が向上するため、WordPress キャッシュプラグインをすでに入手してください。多くの Web サイト所有者や WordPress 開発者が WP Total Cache を選択しています。キャッシュはさておき、コンテンツ配信ネットワーク (CDN) について簡単に見てみましょう。

コンテンツ配信ネットワーク

WordPress Web サイトは、Web ホストの場所に応じて、世界中のどこにでもデータセンター (サーバー) でホストされる可能性があります。サーバーがどれほど強力であっても、ユーザーがサーバー (つまり Web サイト) から離れるほど、ページの読み込み時間は長くなります。たとえば、サーバーがサンフランシスコにある場合、ロンドンの顧客はワシントンなどの顧客に比べて読み込み時間が長くなります。

CloudFlare や BootstrapCDN などのコンテンツ配信ネットワークは、この問題を軽減します。コンテンツ配信ネットワークは、世界中にある相互リンクされた一連のデータセンターです。 CDN アカウントにサインアップすると、Web サイトのバージョンが複数のデータセンターに保存されます。ユーザーが Web サイトにアクセスすると、CDN はユーザーに最も近いデータセンターから Web サイトに自動的にサービスを提供します。

マネージド WordPress ホスティングの専門家である WPEngine は、WordPress Web サイトの強化に役立つトップレベルの CDN およびキャッシュ機能を提供します。

上部にスタイルシート、下部にスクリプト

サイトのアーキテクチャは、思っている以上にサイトのパフォーマンスに影響を与えます。つまり、WordPress サイト (またはその他のサイト) でさまざまな要素を順序付ける方法が、コンテンツの読み込み速度に大きく影響します。

しかし、スタイルシートを上部に配置し、スクリプトを下部に配置すると、Web サイトのページの読み込み時間がどのように短縮されるのでしょうか?まず、訪問者にはスタイルのないコンテンツを決して見せたくありませんよね。スタイルシートを先頭 (<head> 要素内) に配置すると、スタイルシートが最初に読み込まれるようになります。そのため、スタイルは HTML の読み込み時にページに適用されます。

スクリプトを一番下に配置すると、インタラクションのオブジェクトが開始される前にコンテンツが読み込まれるようになります。ウィジェット、スクリプト化された広告、外部 API 呼び出し、スクリプト化されたフォームなどは、コンテンツの後に読み込まれる必要があります。結局のところ、ユーザーはコンテンツを見た後にのみこれらのオブジェクトを操作することになります。スタイルの設定されていないコンテンツを訪問者に見せたくないでしょう。また、コンテンツのずっと前に特に関連投稿ウィジェットを訪問者に見せたくないでしょう。

知っていましたか？ スクリプトを先頭 (または <head> 要素) に配置すると、スクリプトの 1 つが読み込めない場合にコンテンツが読み込めなくなる可能性があります。

外部スクリプトを制限する

依然としてこのスクリプトビジネスでは、Web サイトが外部スクリプトに依存しすぎると速度が低下します。広告によってウェブサイトの速度が低下する可能性について触れたときに、これについて何か触れたと思います。外部スクリプトの一般的な例は次のとおりです。

ソーシャルメディア共有ボタン例:有名な Facebook の「いいね！」ボタンと Twitter のフォローボタン。
YouTube およびその他のビデオ埋め込みスクリプト (ちなみに、WordPress サイトに YouTube ビデオを追加するのは非常に簡単です)
IntenseDebate、Google+ Comments、Disqus などの外部コメントプラグイン
ライブチャット
外部オプトインフォームとポップアップ
外部フォントスクリプト
などなど

外部スクリプトの数を減らすと、ページの読み込み時間を大幅に短縮できます。唯一の欠点は、特定の機能なしでウェブサイトを運営するリスクに直面することです。ほとんどの機能は、テーマに直接コーディングすることで補うことができます。

すべての外部スクリプトを無効にする必要はありません。Pingdom Site Speed ツールまたは GTmetrix を使用して、ツアーリソースに負担をかけるスクリプトを監視できます。驚くべきページ速度や、より多くの機能 (サイトの読み込みに数十年かかるため、ユーザーは決して使用できない可能性があります) が必要ですか?すべては、より大きな利益のために、つまりページ速度の向上のために妥協することです。

縮小する

何を縮小しているのでしょうか？ HTML、CSS、JavaScript コード。 HTML、CSS、または JavaScript をどのように縮小しますか?コードからすべての空白を削除します。

そうなるとコードが読めなくなりませんか？コードは目を痛めませんか?はい、コードが読みにくくなる可能性がありますが、ページの速度を向上させたい場合は、そのようなことを心配する必要はありません。結局のところ、役立つ場合は、いつでもコードをコメントアウトできます。コードでは、人間の読者が読みやすいように、秩序ある構造と空白が使用されます。ブラウザとサーバーは、コードが有効である限り、見た目の美しさなどまったく気にしません。

フロントエンドを強化するには十分な空白を使用しますが、コードからはすべてのスペースとタブを削除してください。あれこれいじりたくない場合は、Autoptimize などのプラグインを使用してプロセス全体を自動化できます。

適切にコーディングされ管理された WordPress テーマを使用する

開発者からまったく愛されていない WordPress テーマには通常、サーバーリソースを使い果たす不適切なコードが含まれており、その結果 Web サイトが遅くなります。さらに、WordPress テーマの開発が不十分な場合、画像が過剰に使用される可能性があり、サイトの重量が増加します。

信頼できるソースから専門的に開発された WordPress テーマを選択してください。何よりも、選択したテーマは応答性が高く、最高のパフォーマンスが得られるように最適化されている必要があります。どこから始めればよいかわかりませんか?常に印象的な Total Drag & Drop WordPress テーマや無料の WordPress テーマをチェックしてください。

ただし、テーマ開発者を信頼しているからといって、テーマが完璧にコーディングされているわけではないことに注意してください。誰もが間違いを犯し、どのテーマにもどこかに何らかのバグや欠陥が存在します。そのため、定期的に管理および更新されるテーマを使用することも重要です。見た目が気に入ったからといって、そのテーマに妥協しないでください。どのテーマも子テーマを介して再デザインできます。

ごみを出す

WordPress 2.9 以降、サイトからコンテンツを削除するたびに、コンテンツはデスクトップのゴミ箱のようなゴミ箱に送られます。したがって、ファイルを自由に復元または完全に削除できます。唯一の問題は、このジャンクがデータベースの多くのスペースを占める可能性があることです。ゴミが蓄積すると、DB が窒息し、Web サイトの速度が低下する可能性があります。

WordPress は 30 日ごとにゴミ箱を空にしますが、wp-config.php ファイルを編集することでこれを変更できます。

define( 'EMPTY_TRASH_DAYS', 7 );

上記のコードは WordPress に 7 日ごとにゴミ箱を削除するように指示しますが、次のコードはゴミ箱機能を永久に無効にします。

define( 'EMPTY_TRASH_DAYS',  0 );

使用しない Jetpack 機能を無効にする

使用しない Jetpack 機能の一部を無効にすると、Web サイトの速度が大幅に向上します。コメント、共有、WP.me ショートリンク、ウィジェットの表示を除くすべての機能を無効にし、ページの読み込み時間を 3 秒短縮しました。

Jetpack 機能はスクリプトを利用するため、サーバーに追加のリクエストを送信する以外に読み込みに時間がかかります。 Jetpack 機能をすべてオンにすると、ページの読み込みに時間がかかります。使用したい機能をアクティブにすれば、残りのことは忘れてください。

簡単な概要

優れたユーザーエクスペリエンスを提供し、検索エンジンで上位にランクされることは、現在、ページの速度とサイトのパフォーマンス全般に関係しています。このため、最高のパフォーマンスを得るために Web サイトを最適化することの重要性を決して過小評価することはできません。リスト内:

最適な WordPress ホスティングを選択してください (私たちは WPEngine を愛用しています)
使用しない古いプラグインを削除する
サーバーへの HTTP リクエストを削減する
画像を最適化する
広告を賢く選択する
Gzip圧縮をオンにする
キャッシュとコンテンツ配信ネットワーク (CDN) を活用する
上部にスタイルシート、下部にスクリプト
外部スクリプトを制限する
縮小、縮小、さらに縮小
プレミアム WordPress テーマを使用します (Total Drag & Drop の多目的 WordPress テーマをお勧めします)
ごみを出す
使用しない Jetpack 機能を無効にする

ボールは今あなたのコートにあります…

Web サイトを開発するときの一般的な経験則は、プロジェクトのほぼすべての側面にミニマリストのアプローチを採用することです。不要なものを取り除き、最適化し、Web ホスティングを含む適切なツールを使用して始めます。また会いましょう 🙂