ブログページの読み込み時間を短縮するための17の効果的なヒント

公開: 2020-11-10

すべてのページの読み込みに数秒かかったサイトにアクセスすることを想像してみてください。

イライラしませんか？

真実は、多くのブロガーは、画像カルーセルからインタラクティブなウィジェットまで、派手な視覚要素をロードするときに、Webサイトのロード速度を無視しています。

それはあなたの聴衆を感動させる方法ではありません。

彼らが必要としているのは、高速に読み込まれ、読みやすさを最大化し、必要な情報を提供するブログです。

彼らが望むものを彼らに与える方法について話し合いましょう。

ブログの読み込み速度の最適化への究極のガイド

1.ページの読み込み速度が重要な理由
- 1.1より多くのトラフィックを保持する
- 1.2コンバージョンを増やす
- 1.3より高い検索エンジンランキング
2.ウェブサイトの読み込み速度をテストする方法
3.ブログの読み込み時間を短縮する方法
- 3.1不要なプラグインを削除する
- 3.2より多くのことを行うプラグインを探す
- 3.3ホスティングプランをアップグレードする
- 3.4より良いテーマを選ぶ
- 3.5画像を最適化する
- 3.6ホットリンクを無効にする
- 3.7CDNへの投資
- 3.8コードを縮小する
- 3.9レンダリングをブロックするリソースを回避する
- 3.10ホームページへの投稿数を減らす
- 3.11読者を広告で溢れさせないでください
- 3.12サーバーをクリーンアップする
- 3.13Webサイトのキャッシュを有効にする
- 3.14GZIP圧縮を使用する
- 3.15ウェブサイトデータベースの最適化
- 3.16ユーザーコメントの最適化
- 3.17トップページに焦点を絞る最適化
4.結論

ページの読み込み速度が重要な理由

ユーザーエクスペリエンスの向上に加えて、読み込み速度が速いことには、マーケティングの観点からも多くの利点があります。

より多くのトラフィックを保持する

統計によると、ユーザーの約40％が、3秒以内に読み込まれないサイトを離れます。 モバイルユーザーについて話している場合、この数字は53％に跳ね上がります。

そして、あなたはなぜあなたのブログがそのようなひどい直帰率を持っているのか疑問に思います。

ブログの読み込み速度を無視し続けると、基本的にトラフィックの可能性が約半分になります。

コンバージョンを増やす

ロード時間が1秒遅れると、コンバージョンが7％減少することをご存知ですか？

見通しを立てると、100ドル相当のコンバージョンを確保するたびに7ドルの損失になります。

それほど大きくはないように思われるかもしれませんが、競合他社のWebサイトは数回クリックするだけであることに注意してください。

読者がユーザーエクスペリエンスの向上した別のブログに移動すると、決して振り返ることはありません。

より高い検索エンジンランキング

あなたが知らなかった場合、グーグルのような検索エンジンはユーザーエクスペリエンスに関して非常に特別です。

そのため、彼らは読み込み速度をデスクトップだけでなくモバイルWebサイトにとっても重要なランキング要素と見なしています。

SEOまたは検索エンジン最適化という用語に慣れていない場合は、この投稿を使用して学習を開始することをお勧めします。

とりあえず、一流のブログパフォーマンスを達成するための次のステップ、つまりブログの実際の読み込み速度を測定する方法を紹介します。

ウェブサイトの読み込み速度をテストする方法

あなたはあなたのウェブサイトがすでに十分に速く動いていると思うかもしれません、しかしグーグルのPageSpeedInsightsのようなツールだけがそれを証明することができます。

簡単に言えば、これはWebサイトの速度を分析し、速度に影響する問題を検出し、役立つリソースとともに提案のリストを提供するパフォーマンス最適化ツールです。

PageSpeed Insightsを使用するには、先に進んでブログのURLを入力し、[分析]をクリックします。

PageSpeed Insightsを数秒待って、その魔法を働かせてください。

完了すると、最初に見つかるのは、速度スコア、読み込み速度に影響を与える要因、ユーザー入力を登録するまでの推定待ち時間または遅延など、Webサイトのパフォーマンスの詳細な評価です。

[モバイル]タブに切り替えることで、モバイルパフォーマンスにPageSpeedInsightsを使用することもできます。このツールは、スマートフォンやタブレットでのブログのパフォーマンスを反映した別のレポートをすぐに表示するはずです。

あなたのスピードスコアはもう見つかりましたか？

これからは、Webサイトのパフォーマンスを測定する主要な手段としてそれらを使用することをお勧めします。

目標は単純です。速度スコアスケールの「速い」終わりに到達するために必要な数の最適化を実行することです。

私が話していることをお見せしましょう。

Facebookのような大きなサイトでさえ90未満のスコアを持っていることを考えると、少なくとも85の速度スコアで十分であるとどこかで読むことができます。

しかし、あなたのニッチにへこみを作ろうとしている新進のブランドとして、「十分に良い」に落ち着くことは決して選択肢ではありません。

常に競争に勝つための機会を受け入れる必要があります。

読み込み速度を上げることでウェブサイトのユーザーエクスペリエンスを向上させることは、これらの機会の1つです。

次のステップに進む準備はできましたか？それでは、それに取り掛かりましょう。

ブログの読み込み時間を短縮する方法

ページの読み込み速度の最適化の「理由」について説明したので、次は「方法」について説明します。 」

Web開発について1つか2つ知っている場合は、PageSpeed Insightsに示されている推奨事項を実行することで、パフォーマンス最適化キャンペーンを開始できます。「ラボデータ」セクションのすぐ下にあります。

当然、PageSpeed Insightsで得られる提案は、Webサイトの全体的な状態によって異なります。ただし、一般的な最適化の推奨事項のほとんどは、以下にまとめた戦略のリストに含まれています。

これ以上苦労することなく、はるかに高速で収益性の高いブログへの実証済みの手順は次のとおりです。

1.不要なプラグインを削除します

ブログ公開プラットフォームとWordPressのようなコンテンツ管理システムは通常、トラックロードのすぐに使用できるプラグインをサポートしているため、あらゆる種類の機能を簡単に実装できます。

オンライン予約ウィジェットを使用したり、カスタムオプトインフォームを作成したり、印象的なランディングページを作成したりできます。コードを常に1行も記述しなくてもかまいません。統合された検索バーを使用するだけで、ニーズに合ったプラグインをすばやく見つけることができます。

利便性について話します。

ただし、プラグインの利用は両刃の剣になる可能性があります。

好きなだけプラグインをウェブサイトにロードすることはできません。

1ページにプラグインが多すぎると、サーバーリソースが消費され、サイトのクロール速度が低下する可能性があります。

プラグインライブラリにあまり注意を払っていない場合は、同様のコア機能を持つ冗長プラグインをインストールしている可能性があります。

同じタイプの複数のプラグインをインストールしようとすると、WordPressが警告を発すると思うでしょう。

残念ながら、そうではありません。

WordPressダッシュボードに詰め込める多くのフォームビルダーを見てください。

幸いなことに、同様のプラグイン間の競合は、不要になったプラグインを非アクティブ化することで簡単に修正できます。

これを行うには、ダッシュボードから[プラグイン]メニューを展開し、 [インストールされたプラグイン]に移動します。そこから、不要なプラグインをすべて選択し、[一括操作]ドロップダウンメニューから[非アクティブ化]または[削除]コマンドを適用します。

類似のプラグイン間の競合は別として、特定のプラグイン、特に現在のバージョンのWordPressでテストされていないプラグインは、ダッシュボードを混乱させる可能性があります。

「テストされていない」プラグインを避けながら、一度に1つのプラグインをインストールすることで、これを回避できます。

WordPressダッシュボードで読み込み時間が長くなったり、クラッシュしたり、その他の問題が発生した場合は、最後にインストールしたプラグインを無効にしてください。問題が解決しない場合は、別のプラグインが原因である可能性があります。

そのとき、すべてのプラグインを非アクティブ化し、原因が見つかるまで1つずつプラグインをオンに切り替えることができます。完了したら、代替プラグインを探すか、最新バージョンに更新することを検討してください。

2.より多くのことを行うプラグインを探す

プラグインについて説明している間、プラグインの選択について簡単に説明しましょう。

WordPressでは、プラグインが少ないほど良いです。

可能な限り、実装する機能ごとに新しいプラグインをインストールするのではなく、多くの帽子をかぶることができるプラグインを探してください。

たとえば、連絡先フォーム、星評価、レビュー、ランディングページのデザインに個別のプラグインを使用するのではなく、これらすべての機能を1つにまとめるElementor PageBuilderのようなプラグインを使用するだけです。

CMSから余分なプラグインを削除した後、Webサイトの実行が遅くなる可能性のある別の要因を見てみましょう。

3.ホスティングプランをアップグレードします

新しいブロガーにとって、あなたのウェブサイトのための1ドルのホスティング計画は本当に抵抗するのが難しいです。

しかし、月に数千とは言わないまでも数百の訪問者を生み出し始めると、ホスティング会社がこの価格帯でプランを提供する理由を理解できます。

頻繁な速度低下、ダウンタイム、不十分なカスタマーサポート—これらは安価なウェブホスティングソリューションを選択することの欠点のいくつかです。これは主に、1ドルのホスティングサービスが通常、電力不足のベースラインサーバーハードウェアを使用しているためです。

「あなたがブログを真剣に考えているなら、あなたのウェブサイトは最も安いホスティングプランよりも良いものに値する。」 – Ankit Singla

あなたの研究をして、次のようなたくさんの肯定的なレビューに裏打ちされたウェブホスティング会社を探してください：

BlueHost
HostGator
SiteGround
WPXHosting

疑わしい場合は、Pickuphostなどのツールを使用して、検討しているホストの速度をテストできます。ドロップダウンメニューからホスティングプロバイダーを選択し、サーバーの場所を選択して、[テストの開始]をクリックするだけです。

理想的には、ターゲットオーディエンスに近いサーバーの場所を選択する必要があります。

また、ほとんどのホスティング会社が、共有、仮想プライベートサーバーまたはVPS、専用など、複数のプランを提供していることに気付くかもしれません。

ほとんどのブログでは、VPSホスティングプランは、Webサイトの帯域幅のニーズを処理するのに十分すぎるはずです。一方、共有ホスティングプランは、トラフィックの大群をまだ取得していない場合にも実行可能です。

最初に共有ホスティングから始めて、ブログのトラフィックが増えたら、VPSを利用したプランにアップグレードすることをお勧めします。

おそらく、専用ホスティングを選択する唯一の理由は、あなたのサイトが何百もの製品を扱うオンラインストアも備えているかどうかです。その場合、VPSホストでさえ、デジタルショップの稼働を維持するために必要な帯域幅容量がない可能性があります。

4.より良いテーマを選ぶ

帯域幅について言えば、よりシンプルでミニマリストなテーマを選択することで、Webサイトの帯域幅要件を減らすことができます。

WordPressユーザーは、私が話していることをすぐに理解する必要があります。

結局のところ、WordPressテーマライブラリにはすでにいくつかの無料のミニマルなテーマがあります。サードパーティのテーマデザイナーでさえ、Webサイトのパフォーマンスを向上させることができる軽量のテーマを数多く備えています。

ここで重要なのは、画像スライダー、アニメーション、CSS効果など、不要な視覚的詳細がちりばめられていないテーマを探すことです。

テーマをプレビューすることで、これらの要素を自分で確認できます。これは、WordPressテーマディレクトリを含むほとんどのテーママーケットプレイスの主要な機能です。

StudiopressのGenesis子テーマは、WordPressのお気に入りのテーマの1つです。これらは、WordPressバージョン5.0以降のデフォルトのコンテンツエディターであるグーテンベルクエディターとも互換性のある、数十のミニマルでモバイルフレンドリーなテーマを提供します。

さらに重要なことに、これらのテーマは、サイトの読み込み速度を上げるのに役立ちます。

創世記のテーマとその利点の詳細については、このレビューを必ずチェックしてください。

5.画像を最適化する

Webサイトのパフォーマンスに影響を与えるすべての視覚要素がテーマに組み込まれているわけではありません。

ウェブサイトのロゴ、注目の画像、ボタン、インフォグラフィックなど、ウェブサイトにアップロードするすべての画像は、ブログの帯域幅要件を膨らませるため、パフォーマンスに影響を与えます。

しかし、ビジュアルコンテンツはすべてのブログになくてはならないものであるため、画像で投稿を盛り上げるのをやめることもできません。代わりに、Kraken.ioなどの画像圧縮ツールを使用して、品質に目立った変化を与えることなく画像のサイズを縮小できます。

Kraken.ioには、画像を一括で最適化できる無料のクラウドベースのロスレス圧縮ツールが付属しています。画像をツールにドラッグアンドドロップするか、zipフォルダーをアップロードするだけで、圧縮プロセスを開始できます。

最終的な画像がぼやけて見えないように、圧縮モードを「ロスレス」に設定することを忘れないでください。

セルフホストのブロガーの場合、WP Smushなどのプラグインを使用してWordPressの速度を上げ、メディアライブラリ内のすべての画像を一度に圧縮できます。ただ、始めるためにあなたのダッシュボードや「バルクがどんな今」から「がどんな」をクリックしてください。

WP Smushには、アップロードされるとすぐに画像を自動的に圧縮するオプションもあります。この機能を有効にするには、プラグインインターフェイスの[設定]セクションで[自動スマッシュ]をオンにします。

私と同じように、画像圧縮は、ビジュアルコンテンツのファンである場合に実行する必要があることの1つにすぎないことを忘れないでください。そのため、画像の最適化とSEOに関する詳細なガイドをお読みになることをお勧めします。

6.ホットリンクを無効にする

可逆圧縮を使用している場合でも、ホットリンクが原因で、画像がサーバーリソースを占有し、サイトの速度を低下させる可能性があります。

これは、別のサイトが画像またはファイルに直接リンクし、これらのリソースを自分のページに表示できるようにする一般的な方法です。

確かに、あなたのコンテンツを他のウェブサイトで共有することは、正しい方法で行われたときに素晴らしいことです。しかし、ホットリンクを使用すると、これらのサイトは最終的に、サイトからコンテンツをプルすることによって支払った帯域幅を使用します。

そのため、ホットリンクは一般に帯域幅の盗用とも呼ばれます。

「.htaccessファイル」に次のコードを追加することで、ホットリンクを完全に停止できます。

gzipオン;
gzip_disable“ msie6”;
gzip_vary on;
gzip_proxied any;
gzip_comp_level 6;
gzip_buffers 16 8k;
gzip_http_version 1.1;
gzip_types application / javascript application / rss + xml application / vnd.ms-fontobject application / x-font application / x-font-opentype application / x-font-otf application / x-font-truetype application / x-font-ttf application / x-javascript application / xhtml + xml application / xml font / opentype font / otf font / ttf image / svg + xml image / x-icon text / css text / javascript text / plain text / xml;

ウェブサイトの.htaccessファイルがどこにあるかわからない場合は、ホスティングアカウントのコントロールパネルにあります。

あなたがする必要があるのはあなたのホスティングサービスの「ファイルマネージャー」を探してあなたのウェブサイトのルートフォルダーにナビゲートすることです。 .htaccessファイルは、メモ帳に似たアイコンですぐそこにあるはずです。

7.CDNに投資する

画像圧縮とホットリンク防止で完了しましたか？

良い。

画像の読み込みをさらに速くする方法があると言ったらどうしますか？

コンテンツ配信ネットワークまたはCDNを使用すると、プロキシサーバーのネットワーク全体を活用して、Webサイトのデータをユーザーに転送する速度を上げることができます。

最良の部分は、CDNサービスプロバイダーは、サーバーが世界中の主要な場所に分散していることを認識していることです。これにより、離れた場所からの訪問者が通常経験する遅延の問題が大幅に軽減されます。

Webホストと同様に、ブログのCDNを選択するときは注意が必要です。

心配しないでください—私はあなたが使用できるWordPressブログのための最高のCDNサービスのリストを作成しました。

私は個人的にMaxCDNを保証することができます。これは、コストと機能の点で群を抜いて最高のCDNの1つです。

8.コードを縮小する

Webサイトの帯域幅要件を増やすことができるのは、画像だけではありません。

HTML、CSS、JavaScriptなどのコードも、Webページのサイズに影響を与える可能性があります。

修正？空白、余分な行、コメントなど、コード内の不要な文字を削除して、それらを縮小します。

これらの文字は、コードの機能にはまったく影響しませんが、ファイルサイズは大きくなります。同様に、ブラウザはページをロードするときにコードをダウンロードして実行するのに時間がかかります。

ちょっと待ってください—それはあなたがあなたのサイトの各コードを調べて不要な文字を一つずつ削除しなければならないことを意味しますか？

落ち着く。

画像圧縮の場合と同様に、このプロセスを自動化するために使用できるツールがあります。

たとえば、Minify Codeは、コードを数秒でトリミングできる無料のツールです。これは、WebサイトにあるJavaScript、CSS、およびHTMLファイルに対して機能します。

WordPressを使用する場合は、W3 Total Cacheのようなプラグインを使用することもできます。これにより、コードアセットを一挙に縮小できます。

インストールしたら、メインダッシュボードから[パフォーマンス]をクリックし、[縮小]をクリックしてオプションを表示します。

パフォーマンスを向上させるためにWebサイトのコードを最適化するには、次の設定をオンにすることをお勧めします。

HTML縮小設定
JSは設定を縮小します
CSSは設定を縮小します

すべての最適な設定については、このW3トータルキャッシュチュートリアルをお読みください。

9.レンダリングをブロックするリソースを回避する

私たちはコードのトピックに取り組んでいるので、もっと高度なものを掘り下げてみましょう。

PageSpeed Insightsを実行し、「レンダリングをブロックするリソースを排除する」ように言われた場合、ブログのパフォーマンスを最大化するために、コーディングで手を汚す必要があるかもしれません。

一言で言えば、レンダリングブロックリソースは、WebサイトのコアHTMLコンテンツの読み込みを妨げるコードです。つまり、問題のあるリソースが読み込まれない限り、ロゴ、メニュー、投稿、およびページの他の重要な要素は読み込まれません。

レンダリングブロックリソースには、スタイルシート、HTMLインポート、およびさまざまなスクリプトがあります。 PageSpeed Insightsは、これらのコードの完全なリストを提供する必要があります。

レンダリングブロックリソースを処理するための最も簡単な手順は、JavaScriptをWebサイトのHTMLの下部、つまり終了「</ body>」タグの直前に移動することです。

「defer」属性を使用して、HTMLが完全にロードされた後にのみスクリプトをロードすることもできます。これは、「<script>」タグ内にdefer =” defer”を挿入することで実行できます。

レンダリングブロックリソースの詳細と、それらを最適化するためにできることについては、この投稿を確認してください。

もちろん、コードの操作に不安がある場合は、いつでもWeb開発者から支援を受けることができます。または、Autoptimizeなどのプラグインを使用して、スクリプトをWebサイトのフッターに自動的に延期することもできます。これは、作業を100倍簡単にするさらに別のWordPress速度最適化プラグインです。

10.ホームページへの投稿数を減らす

次に、ホームページに表示される投稿の数について話しましょう。

WordPressやブログ公開プラットフォームなどのCMSには、多くの場合、最初からブログ投稿を紹介する多数のテーマがあります。

投稿ごとに高品質の注目画像を使用すると、ユーザーは必然的にホームページの読み込みに時間がかかります。

私は個人的にホームページに4つの投稿だけを表示しています。

確かに、ブラウザは、画像の読み込み中にブログ投稿のタイトル（説明やコンテンツの最初の数行を含む場合があります）を表示する場合があります。しかし、それでもWebサイトでのユーザーエクスペリエンスの全体的な流動性は低下します。

プラス面として、ほとんどのWebサイトプラットフォームとCMSでは、ホームページに表示される投稿の数を減らすことができます。

このために微調整する必要のある設定はプラットフォームごとに異なるため、WordPressでどのように行われるかを見てみましょう。

メインダッシュボードから[設定]をクリックし、[読み取り]セクションに移動します。

「ブログページは最大で表示されます」設定がすぐに表示されます。デフォルト値を自由に微調整して、Webサイトの読み込み速度が向上するかどうかを確認してください。

11.読者を広告で溢れさせないでください

ホームページへの投稿プレビューは読み込み速度に悪影響を与える可能性がありますが、少なくとも読者のエクスペリエンスにはプラスのメリットがあります。

ただし、広告はそうではないことがよくあります。

広告がブログの収益化に間違いなく役立つことは事実ですが、1つのページに複数の広告を表示するエクスペリエンスを中断すると、読者はおそらくそれを高く評価しないでしょう。さらに重要なことに、Webサイトの隅々に広告を設定すると、パフォーマンスが低下します。

とは言うものの、視聴者にブログの重要な要素に焦点を合わせさせ、広告を最小限に抑えるのが最善です。

私は、1つには、余分な収入のために読者の経験を妥協するつもりはありません—広告がまったくない私のウェブサイトで見ることができるように、。

私があなたなら、私の主要な収益化戦略としてアフィリエイトリンクを優先します。これらは、ユーザーに役立つ可能性のある製品またはサービスを指すコンテキストリンクです。

アフィリエイトマーケティングでどのようにお金を稼ぎますか？

良い質問。

興味があれば、私のアフィリエイトマーケティングガイドを参照してください。

12.サーバーをクリーンアップします

この時点で、読み込み速度とWebサイトの乱雑さの量との相関関係をすでに把握しているはずです。

非常に簡単です。ブログを最小限に抑えて軽量にすれば、ブラウザはすべてを読み込んでユーザーに表示するのにそれほど時間はかかりません。

ビジュアルコンテンツ、スクリプト、広告など、Webサイトに要素を追加するときは、常に慎重に行ってください。同時に、ウェブサイトをスムーズに実行できるように、ホスティングアカウントに十分なディスク容量があることを確認してください。

ホスティングアカウントには、全体的なディスク使用量を追跡できる組み込みツールが必要です。あなたにアイデアを与えるために、これはSiteGroundのディスクスペース使用量ツールのスクリーンショットです：

ホスティングアカウントの容量が不足している場合は、次のことができます。

バックアップをローカルドライブに移動する
古いWebサイトでは、ホスティングサーバーにギガバイトのバックアップが保存される傾向があります。それらをローカルドライブにダウンロードしてサーバーから削除することは、スペースを解放するための優れた方法です。
非アクティブなアカウントを削除する
ホスティングプランに非アクティブなアカウントが存在する場合は、それらを削除して、ディスク容量を大幅に節約します。これは元に戻せないプロセスであるため、削除する前に、まずアカウントのローカルバックアップを作成することを検討してください。
.TMPファイルを削除する
WebサイトプラットフォームまたはCMSは、プラグインの更新やセッションデータの追跡などのタスクから一時ファイルを生成する場合があります。それらを削除しても安全ですが、安全のために「tmp」フォルダのオフラインバックアップを作成しても問題はありません。

不明な点がある場合は、ディスク容量を節約する方法について、ホスティングサービスプロバイダーのカスタマーサポートにお問い合わせください。

13.Webサイトのキャッシュを有効にする

画像の圧縮、コードの縮小、広告の縮小、ホスティングアカウントのクリア—これらの戦略により、ウェブサイトの読み込み速度はこれまでになく速くなるはずです。

しかし、まだリラックスしないでください。ウェブサイトの読み込み速度をさらに上げるために、まだいくつかの戦略について話し合う必要があります。

ウェブサイトのキャッシュを使用すると、リピーター向けにブログをほぼ瞬時に読み込むことができます。

Webサイトのキャッシュは、スクリプト、画像、メディアファイル、その他の形式のダウンロード可能なコンテンツなどのデータの一時的な保存を可能にすることで機能します。これにより、ブラウザが行う必要のあるHTTPリクエストの数を減らすことができます。

ウェブサイトのキャッシュを実装するための長い方法は、ウェブサイトの.htaccessファイルの先頭に次のコードを挿入することです。

##キャッシュの有効期限が切れます##
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image / jpg「アクセス1年」
ExpiresByType image / jpeg「アクセス1年」
ExpiresByType image / gif「アクセス1年」
ExpiresByType image / png「アクセス1年」
ExpiresByType text / css「アクセス1か月」
ExpiresByType text / html「アクセス1か月」
ExpiresByType application / pdf「アクセス1か月」
ExpiresByType text / x-javascript「アクセス1か月」
ExpiresByType application / x-shockwave-flash「アクセス1か月」
ExpiresByType image / x-icon「アクセス1年」
ExpiresDefault「アクセス1か月」
</ IfModule>
##キャッシュの有効期限が切れます##

必要に応じて、特定のキャッシュが期限切れになる前に異なる時間制限を設定できます。たとえば、PNG画像キャッシュの有効期限を1か月に短縮する場合は、「ExpiresByTypeimage / png」行を次のように変更するだけです。

ExpiresByType image / png「アクセス1か月」

繰り返しになりますが、WordPressユーザーはツールを使用して、この最適化戦略を簡単にすることができます。実際、必要なプラグインであるW3 TotalCacheについてはすでに説明しました。

WordPressダッシュボードから[パフォーマンス]サブメニューに戻り、 [ページキャッシュ]に移動して[投稿ページをキャッシュする]チェックボックスをオンにします。

14.GZIP圧縮を使用する

W3 Total Cacheを閉じて、このガイドの最後の残りの戦略に進む前に、もう1つすべきことがあります。

[パフォーマンス]サブメニューから[ブラウザキャッシュ]に移動し、 [HTTP（gzip）圧縮を有効にする]オプションをオンにします。

GZIP圧縮は、サイズを小さくすることでテキストベースのファイルのダウンロード速度を向上させます。ローカルファイルをzip形式のフォルダーに圧縮するプロセスとそれほど変わりません。 GZIP圧縮がWebサイトの速度最適化に広く採用されている主な理由は、バージョン1.1以降のHTTPでネイティブにサポートされているためです。

WordPressやGZIP関連のアドオンを備えた他のプラットフォームを使用しない場合は、従来の方法であるWebサイトの.htaccessファイルを変更して有効にする必要があります。

.htaccessファイルの場所はすでにわかっているので、残っているのはWebサイトでGZIP圧縮をアクティブにするコードだけです。

Go —コピーして貼り付けます。

Apacheサーバー

<IfModule mod_deflate.c>
＃HTML、CSS、JavaScript、テキスト、XML、フォントを圧縮する
AddOutputFilterByType DEFLATE application / javascript
AddOutputFilterByType DEFLATE application / rss + xml
AddOutputFilterByType DEFLATE application /vnd.ms-fontobject
AddOutputFilterByType DEFLATE application / x-font
AddOutputFilterByType DEFLATE application / x-font-opentype
AddOutputFilterByType DEFLATE application / x-font-otf
AddOutputFilterByType DEFLATE application / x-font-truetype
AddOutputFilterByType DEFLATE application / x-font-ttf
AddOutputFilterByType DEFLATE application / x-javascript
AddOutputFilterByType DEFLATE application / xhtml + xml
AddOutputFilterByType DEFLATE application / xml
AddOutputFilterByType DEFLATE font / opentype
AddOutputFilterByType DEFLATE font / otf
AddOutputFilterByType DEFLATE font / ttf
AddOutputFilterByType DEFLATE image / svg + xml
AddOutputFilterByType DEFLATE image / x-icon
AddOutputFilterByType DEFLATE text / css
AddOutputFilterByType DEFLATE text / html
AddOutputFilterByType DEFLATE text / javascript
AddOutputFilterByType DEFLATE text / plain
AddOutputFilterByType DEFLATE text / xml
＃ブラウザのバグを削除します（本当に古いブラウザにのみ必要です）
BrowserMatch ^ Mozilla / 4 gzip-only-text / html
BrowserMatch ^ Mozilla / 4 \ .0 [678] no-gzip
BrowserMatch \ bMSIE！no-gzip！gzip-only-text / html
ヘッダー追加VaryUser-Agent
</ IfModule>

NGINXサーバー

gzipオン;
gzip_disable“ msie6”;
gzip_vary on;
gzip_proxied any;
gzip_comp_level 6;
gzip_buffers 16 8k;
gzip_http_version 1.1;
gzip_types application / javascript application / rss + xml application / vnd.ms-fontobject application / x-font application / x-font-opentype application / x-font-otf application / x-font-truetype application / x-font-ttf application / x-javascript application / xhtml + xml application / xml font / opentype font / otf font / ttf image / svg + xml image / x-icon text / css text / javascript text / plain text / xml;

NGINXユーザーの場合、GZIPを実装するには、コードを「.conf」ファイルに貼り付ける必要があることに注意してください。

GZIP圧縮のテスト

GZIP圧縮を手動で有効にした場合は、GiftOfSpeedによるGZIP圧縮テストなどのツールを使用して、実装が成功したことを確認します。

PageSpeed Insightsと同様に、GZIP圧縮テストを使用する唯一のステップは、WebサイトのURLを入力し、[チェック]ボタンをクリックすることです。

数秒以内に、ツールはGZIP圧縮がWebサイトでアクティブ化されているかどうかを確認する必要があります。また、圧縮率と、圧縮前後のサイズも表示されます。

15.ウェブサイトデータベースを最適化する

レンダリングブロックリソースの修正とGZIP圧縮の有効化は、この投稿で最も高度な戦略の1つですが、まだ完了していません。

次のステップは、 MySQLデータベーステーブルを最適化して、サーバーがユーザーが必要とするデータをより速くフェッチできるようにすることです。

MySQLデータベーステーブルとは何ですか？

簡単に言うと、MySQLデータベースには、投稿、コメント、日付、その他のコンテンツなど、Webサイトで見つけることができるほぼすべてのものが含まれています。ブログ公開プラットフォームとWordPressなどのCMSは、サイトに情報を追加すると、データベースにテーブルを自動的に作成します。

MySQLデータベースは次のようになります。

ただし、データベースには、ピングバック、スパムコメント、投稿の改訂など、時間の経過とともにあらゆる種類のジャンクが蓄積されます。サイズは着実に大きくなり、Webサイトのパフォーマンスに影響を与えます。

MySQLデータベースを整理するためのオプションのひとつは、ホスティングアカウントのコントロールパネルにある統合テーブル最適化ツールを使用することです。

たとえば、SiteGroundには、 [選択済み：]ドロップダウンメニューから[テーブルの最適化]コマンドがあります。

これらのオプションは、コントロールパネルの[データベース]セクションにある[phpMyAdmin]ツールにあります。

経験則として、最適化を実行する前に、必ずデータベースのバックアップを作成してください。それらをローカルドライブにダウンロードして、ホスティングアカウントのディスク容量を節約します。

サーバーで何かを台無しにするのではないかと心配ですか？

WP-SweepのようなWordPressプラグインを使用すると、CMSインターフェース内からデータベーステーブルを最適化できます。プラグインをインストールしてアクティブ化した後、[ツール]に移動し、[スイープ]をクリックして、サイトにあるデータベーステーブルを表示します。

そこから、個々のデータベースアイテムの[スイープ]をクリックして削除するか、プラグインページの一番下までスクロールして[すべてスイープ]をクリックします。

データベーステーブルを完全にスイープするとそれらも削除されるため、投稿の下書きがないことを確認してください。そこにいる間、未承認のコメントを確認して、読者からの質問、貴重なフィードバック、その他の懸念事項を誤って削除しないようにしてください。

16.ユーザーコメントの最適化

コメントについて言えば、WordPressブログには、GravatarまたはGlobally RecognizedAvatarサービスを介してコメント投稿者のプロフィール写真を即座に取り込むことができる便利な機能もあります。

Gravatarはブログのコメントセクションに素敵なタッチを追加しますが、Webサイトの読み込み速度に影響を与えます。これにより、一部のWordPressブロガーはそれらを完全に表示できないようになります。

同じことを行うには、 [設定]に移動し、[ディスカッション]をクリックします。「アバター表示」セクションの下にある「アバターを表示」オプションを探し、選択を解除します。

Gravatarを保持したいが、読み込み速度への影響が気に入らない場合は、BJ Lazy Loadなどのプラグインを使用して、重要なWebサイトリソースの後にアバターを読み込むことができます。これは、遅延読み込みと呼ばれるプロセスです。

アバターとは別に、投稿のサムネイル、画像、iframe、その他の種類のコンテンツの遅延読み込みを有効にすることもできます。 [設定]に移動し、 [ BJ Lazy Load]を選択して、使用するオプションで[はい]を選択するだけです。

WordPressのコメントに関する限り、ページの読み込み速度を上げる方法に関するもう1つのヒントは、ページ付けを使用することです。これにより、投稿のコメントが複数のページに分割され、ブラウザがコメントを読み込んでレンダリングするのにかかる時間が短縮されます。

ページネーションを使用するには、 [ディスカッション]設定ページに戻り、[コメントをページごとにX個のトップレベルコメントがあるページに分割する]オプションを有効にします。

ページごとに表示されるコメントの数をデフォルト値の50から約10に減らしてみてください。これにより、コメントの読み込み時間が大幅に改善され、ブログコンテンツも大幅に改善されます。

17.トップページに最適化を集中させる

この投稿を終了する前に、最後のアドバイスを1つ示します。

最も人気のあるページのパフォーマンスの最適化を開始します。

トラフィックがほとんどない投稿に優先順位を付けるのは意味がありません。反対に、トップページを優先するということは、あなたの努力がほとんどのユーザーに利益をもたらすことを意味します。

Google Analyticsは、トップページを特定するのに役立つもう1つの無料ツールです。 「動作」サブメニューを展開し、「概要」をクリックするだけです。

上位10ページが「ページ」セクションの下に表示されます。

簡単ですよね？

また、Google Analyticsを使用して、詳細なキーワード調査を実行することもできます。これは、GoogleAnalyticsで最も成果の高いキーワードを見つける方法についての投稿で説明したトピックです。

結論

ブロガーとして、ユーザーエクスペリエンスのために何でもする準備をしておく必要があります。

ウェブサイトの読み込み速度は表面的な要因のように見えるかもしれませんが、UXの観点からだけでなく、SEOの観点からも、ブログの成功を単独で成し遂げたり、壊したりする可能性があります。

さて、1日で上記のすべての戦略を適用することはできないでしょう。そうは言っても、このページをブックマークして、もっとキラーなブログガイドのために私たちの公開Facebookグループに参加することを忘れないでください！