Webサイトの読み込みが遅い理由(および修正方法):GTmetrix PageSpeedのスコアと読み込み時間を100%にするために行った22の手順

ウェブサイトの読み込みが遅い


ウェブサイトの読み込みが遅い?

私のサイトが読み込まれると言ったら <GTmetrixスコアが100%の1?そして、私はすでに400を超えるコメントで最も人気のあるWordPress速度ガイドの1つをオンラインで書きました?

いくつかの最適化はWordPressに固有のものであり、他のものは普遍的です。ただし、Squarespace、Shopify、Wix、その他のウェブサイト構築プラットフォームを使用している場合でも、これらはすべてベストプラクティスです.

質問がある場合やサポートが必要な場合は、コメントにGTmetrixレポートをドロップしてください。いくつかのアドバイスを提供します。あなたもすることができます ウェブサイトのスピードオプティマイザーを雇う WordPressを使用している場合.

1. GTmetrixでWebサイトをテストする

GTmetrix あなたを示しています:

  • 読み込み時間 (主要メトリック)
  • どっち 画像 最適化する必要がある
  • どっち プラグイン 読み込みが遅い([ウォーターフォール]タブを確認してください)
  • 君の 最初のバイトまでの時間 (ホスティングの速度を示します)
  • あなたのかどうか キャッシュプラグイン 仕事をしている(私はWP Rocketをお勧めする)
  • 使用しているかどうか コンテンツ配信ネットワーク (私はCloudflareをお勧めします)
  • 読み込みが遅い 外部リソース (AdSense、マップ、YouTube / Facebook埋め込み)

クイックフィックス?
ホスティングは、 公式WordPress最適化ガイド (はるかに)。 GTmetrixスコアは改善されない可能性がありますが、特に低速ホスト(Bluehost、HostGator、GoDaddy)から高速ホスト(SiteGround, クラウドウェイズ)。これらの2つのホストは、Facebookグループから収集した40以上のFacebook投票で最高の評価を受けました.

キャッシュプラグインはスコアに最大の影響を与え、読み込み時間も改善します. WPロケット 他のキャッシュプラグインにはない機能(遅延読み込み、データベースのクリーンアップ、Google Font + Analyticsの最適化など)が多いため、W3 Total CacheまたはWP Fastest Cacheより優れています。.

WordPress Speedビデオチュートリアル
WordPressを使用している場合、WordPressサイトの高速化に関するこの42分のビデオの作成に何時間も費やしました。ビデオの説明でタイムスタンプを使用して、特定のセクションにジャンプできます.

証拠はプリンにあります:

2019-GTmetrix-Report

2.大きな画像のサイズを変更する

これは何 スケーリングされた画像を提供する GTmetrixでの意味.

これは、サイズが正しくない大きな画像をアップロードしていることを意味します。ウェブサイトの各セクションには特定の寸法(スライダー、サムネイル、カルーセル、全幅、サイドバーの画像)があります。.

たとえば、ブログのコンテンツの幅が680ピクセルであることを知っています。ブログに使用する全幅の画像は、常にこれらのサイズに変更する必要があります.

GTmetrixは、最適化されていないすべての画像(およびサイズを変更する必要がある正しい寸法)を表示しますが、テストする単一のページのみを表示します。あなたがしなければならないのは、それらの画像のサイズを変更し、古いバージョンを新しいものに置き換えることです.

スケーリングされた画像を提供する

おまけ:チートシートを作成する –ウェブサイトにさまざまな画像サイズをすべて書き留めます.

  • ロゴ:200 x 58ピクセル
  • ファビコン:16 x 16ピクセル
  • スライダー:1903 x 400px
  • カルーセル画像:115ピクセル
  • ウィジェット画像:420 x 250px
  • 注目の画像:250 x 250ピクセル
  • 全幅のブログ投稿画像:680px
  • Yoast Twitter OG画像:1024 x 512ピクセル
  • Yoast Facebook OG画像:1200 x 630ピクセル

Squarespace, Wix, ワードプレスのテーマには、画像のサイズを変更する手順が含まれている必要があります.

3.画像を圧縮する

これは何 画像を最適化する GTmetrixでの意味.

これを行うツールはたくさんあります(私はShortPixel WordPressプラグインを使用しています)。必ず 削除する EXIFデータ 画像の読み込みをさらに高速化します。これは、以下の一部のツールでも実行できます.

画像最適化

画像圧縮ツール

品質が落ちますか?
可逆圧縮を選択した場合でも、品質が少し低下することがあります。そのため、事前にいくつかの画像をテストし、すべての画像を一括で最適化する場合はバックアップを取るのが最善です。.

4.キャッシュを追加する

もしあなたが〜なら WordPressを使用しない, あなたのプラットフォームは世話をする必要があります キャッシング, 通常プラグインを必要とするGTmetrixの縮小、ファイルの結合、およびその他の最適化.

使用している場合 ワードプレス, 自問してみてください:

  • キャッシュプラグインを使用していますか?
  • 使用しているキャッシュプラグイン?
  • 最適な設定に構成しましたか?

これらの3つの要素は、GTmetrix、Google PageSpeed Insights、およびほとんどすべての速度テストツールのスコアに最も大きな影響を与えます。キャッシングとホスティングは非常に重要です!

最適なキャッシュプラグイン?
私はお勧め WPロケット これはプレミアムキャッシュプラグインです。他のキャッシュプラグインにはない多くの機能が付属しています(データベースのクリーンアップ、ハートビート制御、遅延読み込み、Google Fonts + Analyticsの最適化、CDN統合)。これらの機能を他のキャッシュプラグインで使用する場合、WP Rocketにはすべてが組み込まれているのに対し、これらの最適化を行うには約6つの追加プラグインをインストールする必要があります。これらを行う最も近い無料のキャッシュプラグインはSwiftです.

WP Rocketは、複数のFacebook投票でも1位にランクされました。

2016年ベストキャッシュプラグインポーリング

2019キャッシュプラグインポーリング

スウィフトvs WPロケット

2016キャッシュプラグインポーリング

2018年ベストキャッシュプラグイン調査

wpロケットvs w3 totlaキャッシュ

5. PHP 7.3へのアップグレード

これは、ホスティング(SiteGround、Bluehost、GoDaddyなど)を購入した場合にのみ適用されます。.

PHP 7へのアップグレード+ 非常にシンプルで、ロード時間に大きな影響を与えるはずです.

WordPress PHPベンチマーク

ステップ1:ホスティングアカウントにログインして、PHPバージョンマネージャー(または同様のもの)を見つけます。.

ステップ2:ホスティングアカウントで使用できる最高のPHPバージョンにアップグレードします(例:PHP 7.3).

ステップ3:ウェブサイトにエラーがないかテストします。何かが表示された場合、それはおそらく互換性のないWordPressプラグインが原因です。この場合、 PHP互換チェッカー. このツールは互換性のないプラグインを表示します。それらを削除するか、以前のPHPバージョンに戻す必要があります.

ステップ4:PHPのバージョンを最新に保ちます。ホストが新しい安定したPHPバージョンをリリースする場合は、それを使用します.

6.サーバーの応答時間を確認する

Google PageSpeed Insights あなたが遅いかどうかを伝えます サーバーの応答時間 (Googleでは200ミリ秒未満にすることを推奨しています)。サーバーは明らかにホスティングによって制御されています.

サーバーの応答時間を短縮

サーバーの応答時間を改善する方法

  • より良いホスティングを取得(例:CloudwaysまたはSiteGround)
  • 近づかない EIGホスト 悪名高い遅い人
  • ウェブサイトでキャッシュが有効になっていることを確認してください
  • CloudflareのCDNなどのコンテンツ配信ネットワークを使用する
  • あなたのウェブサイト上のすべての重い未使用のプラグインを排除します
  • プレミアムDNSプロバイダーを使用します(ホスト経由でこれを取得します)

7.適切なホスティングを選択する

ホスティングは、ウェブサイトの速度の最大の要素です。

多くのチュートリアルでは、Bluehost、HostGator、GoDaddy、および EIGブランド.

これらはすべて低品質のホストであり、サーバーの応答時間が遅い、ダウンタイム、古いPHPバージョン、セキュリティの脆弱性、不適切なサポートなど、多くの問題が発生する可能性があります。.

Facebookグループで調査を行い、行われたいくつかの投票を見てください。特定のホスティング会社との間で移行し、結果を投稿した人を確認することもできます.

SiteGround そして クラウドウェイズ 通常、40以上のFacebook投票で1位と2位です。 SiteGroundは共有ホスティングに、Cloudwaysはクラウドホスティングに適しています。どちらのホストも無料のウェブサイト移行を提供しています.

2019年7月のホスティングに関する推奨事項

Elementorホスティングの推奨事項

2017-WordPress-Hosting-FB-Poll

ホスティング推奨投票

WordPress-Host-Poll-Aug-2018

共有ホスティング投票2017

2019-ホスティング投票

Go-To-Hosting-Company

WordPress-Hosting-Poll-2017

2018年のホスティングに関する推奨事項

Elementorのお気に入りのホスティング

2016-WordPress-Hosting-FB-Poll

WordPressホスティング投票

WordPress Hosting Poll Sept 2018.png

Managed-WordPress-Hosting-Poll-2017

2019-Hosts-Poll-1

Hosting-Poll-For-Speed

WordPress-Hosting-Poll-June-1

より高速なホスティングに移行すると、大きな違いが生じます。

SiteGroundに切り替える

SiteGroundの読み込み時間の移行

SiteGround GTmetrixへのBluehost

HostGatorからSiteGround

SiteGround Google PageSpeed Insights

SiteGround GoGeekロード時間

SiteGroundでロード時間を短縮

新しいSiteGround応答時間

Cloudwaysの応答時間

HostGatorからSiteGroundへの移行

JoomlaでのSiteGroundの応答時間

SiteGroundホスティングに切り替え

SiteGround Rocket Imagify Combo

SiteGround PageSpeed Insights

SiteGroundブログの移行

新しいSiteGround応答時間

SiteGroundの応答時間の改善

無題

8. CloudflareのCDNを追加する

CDN (コンテンツ配信ネットワーク)は、あなたのウェブサイトが世界中の複数のデータセンターでホストされていることを意味します。これにより、 地理的距離 サーバーとビジターの間で、リソースをそれらのデータセンターにオフロードします(独自のサーバーの負荷を軽減します)。次のような複数のCDNを使用することもできます StackPath または KeyCDN さらに多くのデータセンターを追加します.

CDN-WordPress-Recommendation

クラウドフレア 無料で持っています 200以上のデータセンター ほとんどのプレミアムCDNをはるかに上回っています.

ステップ1:ホストでアカウントでCloudflareを有効にできるかどうかを確認してください。サポートされている場合は、Cloudflareをアクティブにすれば完了です。そうでない場合は、ステップ2からネームサーバーを変更する必要があります。.

ステップ2:Cloudflareにサインアップし、無料プランを選択してWebサイトを追加し、Cloudflareにスキャンを実行させます。 Cloudflareは、2つのネームサーバーを割り当てるまで、一連のページを案内します.

ステップ3:ドメインレジストラーにログインし、カスタムネームサーバー(Googleの「XYZホスティング会社のカスタムネームサーバー」)を設定するオプションを見つけます。それらのネームサーバーをCloudflareの.

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

あなたのウェブサイトに高品質の画像がある場合、人々は自分のサイトで使用するためにそれらを「借りている」かもしれません。しかし、画像を保存してアップロードする代わりに、人々はあなたのサイトから彼らにそれらをコピー/ペーストします。これは、それらのイメージをサーバーでホストしていることを意味します(良くない).

ホットリンク保護を有効にすることができます クラウドフレア または多くの場合、あなたの ホスティングアカウント. これにより、画像をコピー/貼り付けすることで、貴重なサーバーリソースを使い果たしてしまうのを防ぎます。.

Cloudflareホットリンク保護

10.ファイルを最小化する

GTmetrixはHTML、CSS、およびJavaScriptファイルを縮小するように指示します.

キャッシュプラグインがこれを処理する必要があります(そうでない場合は、設定が有効になっていることを確認してください).

11.ファイルを結合する

複数のCSSまたはJavaScriptファイルがある場合は、それらを1つのファイルにまとめてみてください.

CSSファイルとJavaScriptファイルが少ないほど、Webサイトにロードされるリクエストが少なくなります.

ステップ1:CSS(またはJavaScriptファイル)を見つける.

ステップ2:内容をすべてコピーして貼り付け、1つのファイルにまとめます.

または、ほとんどのキャッシュプラグインには、CSS + JavaScriptを組み合わせるオプションがあります。

JavaScriptファイルを結合する

12.重いプラグインを避ける

WordPressプラグイン、Joomla拡張機能、またはWebサイトに機能を追加する「アドオン」を使用している場合は、それらが読み込み時間に追加されないようにしてください(ベンチマークにはGTmetrixを使用してください).

最も一般的な遅いプラグインは、ポートフォリオ、スライダー、ソーシャル共有、ページビルダー、ライブチャット、カレンダー、統計(分析)、お問い合わせフォーム、または関連する投稿プラグインに関連しています.

あなたのウェブサイトで遅いプラグインを見つける方法
GTmetrixレポートに同じプラグインが複数回表示され、Waterfallタブで読み込み時間が長い場合は、プラグインを削除して、より軽量なプラグインに置き換えることを検討してください。 WordPressの場合は、 クエリモニター 読み込みが最も遅いプラグインを確認するには.

おまけ:プラグインを選択的に無効にする
次のようなプラグインを使用します 資産マネージャー 特定のページでプラグインの実行を選択的に無効にする。たとえば、連絡先ページで連絡先フォームのみを使用する場合は、他のすべての場所で無効にしてください.

13.データベースをクリーンアップする

投稿を更新したり、プラグインをインストールおよび削除したり、Webサイトで他のタスクを実行したりすると、データベースに肥大化が始まります。 2週間ほどに1回程度は掃除することをお勧めします.

無料でデータベースをクリーンアップできます WP-Optimizeプラグイン, またはWP Rocketを使用します。

WP-最適化クリーンデータベース

14.外部リソースを最適化する

外部リソース 埋め込まれたYouTube動画からGoogleフォント、Googleアナリティクス、Gravatarなど、外部のWebサイトから情報を取得する必要のあるものまであります。これらはすべてのページで実行されるため、GTmetrixレポート、特にGoogle AdSenseを破壊する可能性があります.

外部リソースを最適化するためのヒント

15. Googleフォントを組み合わせる

Google Fonts、Font Awesome、またはその他の外部フォントを使用していますか?

これらは外部リソースであるため、おそらくGTmetrixで余分なリクエストが発生します。.

Google-Fonts-GTmetrix

Googleフォントを最適化するためのヒント

  • ローカルでGoogleフォントをホストする
  • 必要なフォント/太さのみを選択してください
  • 複数のフォントファイルを1つのファイルに結合する(手動で、またはWP RocketまたはAutoptimizeを介して)

16.画像と動画の遅延読み込み

遅延読み込みとは、画像、動画、iframeが読み込まれるのは、ユーザーがページを下にスクロールして実際に表示した場合のみです。これにより、ページの初期読み込み時間が大幅に改善されます.

埋め込み動画は、ページで最も重い要素の1つになる可能性があります。2つの動画の遅延読み込み(およびiframeをプレビュー画像に置き換える)により、私の投稿の1つがなんと4秒も削られました.

WordPressの場合、WP Rocket、WP YouTube Lyte、またはLazy Loadプラグインを使用できます.

Squarespaceの場合、これを試してください 遅延読み込み機能.

WP-Rocket-Lazy-Load

17.広告を避ける

Google AdSenseは、ウェブサイトの読み込みを遅くすることで悪名高く、それほど利益を上げていません。あなたが試すことができます アドバランサー そして ロケットローダー, しかし、GTmetrixレポートには多くのエラーがあり、アフィリエイトマーケティングで収益化する方がよいでしょう。 AdSenseを忘れる– 5万ドル以上を稼いでいるほとんどの人は、サイトの速度を落とさないアフィリエイトリンクを使用しています.

GTmetrix-Advertisements

18. AMPを検討する

AMP (高速モバイルページ)モバイル検索結果にAMPスタンプを表示しながら、モバイルページの読み込みを高速化します。問題は、これによりモバイルページのデザインが変更されることです。あなたは使うことができます AMP for WPプラグイン それらをカスタマイズしますが、同じではありません. Kinstaのコンバージョンは58%減少しました AMPを追加するときに、自分のサイトでAMPを無効にすることにしました。しかし、検討する価値があります。これは SquarespaceのAMPチュートリアル それを使っているなら.

19. Google Analyticsで遅いページを見つける

読み込みが最も遅いページを見つけることができます グーグルアナリティクス行動→サイトの速度→速度の提案.

多くの場合、これらのページは画像、動画、または外部リソースが大量にあるため、読み込みに時間がかかります。これは、ほとんどの速度要素が1ページだけでなく、Webサイト全体に適用されるためです。.

スピード提案-Google-アナリティクス

20. WordPress固有の最適化

WordPress固有の最適化についてはすでにいくつか説明しましたが、ここではさらにいくつか説明します.

  • WP Rocketのような一流のキャッシュプラグインを使用する
  • ShortPixelなどの優れた画像最適化プラグインを使用する
  • ハートビートコントロールプラグインを使用してハートビートAPIを無効にする
  • 使用していないすべてのプラグインを削除し、軽量プラグインを使用する
  • WP-OptimizeまたはWP Rocketを使用してデータベースを頻繁にクリーンアップします
  • Harrys Gravatar Cache、FV、Optimumなどのプラグインを使用してGravatarをキャッシュする
  • アセットマネージャーを使用して、特定のページでプラグインの読み込みを選択的に無効にする
  • WP RocketやCAOS Analyticsなどのプラグインを使用してローカルでGoogle Analyticsをホストする
  • OMGFまたは自己ホスト型Googleフォントなどのプラグインを使用してローカルでGoogleフォントをホストします

21. WooCommerceの最適化

デフォルトでは、WooCommerceはWebサイトに追加のスクリプト、スタイル、およびカートフラグメントを追加します。また、通常はより多くのプラグインが必要です。そのため、ホスティングプランを選択するときは、VPS、クラウド、またはセミ専用ホスティングを使用して、追加のリソース消費を確実に処理できるようにする必要があります。そうしないと、共有ホスティングで、ホストのCPU制限を超える可能性があります.

WooCommerceカートのフラグメント

カートのフラグメントを無効にする –カートフラグメントは、カート内のアイテムと合計を更新しますが、ロードに1秒から10秒もの時間がかかる場合があります。あなたの最善の策は ホームページ+投稿でカートのフラグメントを無効にする, それはそれらが使用されていない場所だからです。そのチュートリアルに従ってください.

WooCommerceスクリプトを無効にする – WooCommerceは、Webサイトに約8つの異なるスクリプトをロードすることもできます。これらを無効にするには、これを取得します Githubからのコード そして、それをfunctions.phpファイルに追加します.

WooCommerceスタイルを無効にする – WooCommerceには、すべてのページに読み込まれるスタイルもあります。がここにあります それらを無効にするためのガイド.

Perfmatters – Kinstaによるこの気の利いたプラグインにより、カートのフラグメント、スクリプト、およびスタイルを簡単に無効にすることができます。コードを編集せずに簡単に無効にする方法が必要な場合は、このプレミアムプラグインをお試しください.

明確な顧客セッション – WooCommerceサイトが遅い場合は、顧客セッションをクリアしてみてください.

メモリ制限を256MBに増やす – WooCommerceでは、メモリ制限を256MBに増やす必要がありますが、ほとんどのWebサイトでは、これを実際に行う必要があります。これが チュートリアル それをするために.

22.自分のしていることを知っている人を雇う

読み込みが遅いウェブサイトの修正にサポートが必要?

WordPressの速度最適化を専門とする数人の開発者と協力しています。あなたはそのページで彼らのポートフォリオをチェックすることができます、そして私は彼らに私のGTmetrixスコアを100%にしてくれたと信じています。 Coleはすべての速度最適化プロジェクトを管理しており、cole @ onlinemediamasters.comで彼に連絡できます.

23.よくある質問

&#x1f680;ロード時間に最も影響を与える要因は何ですか?

適切なホスティング、プラグイン、およびキャッシュプラグインを選択すると、ロード時間に最も大きな影響を与える可能性があります。画像を最適化し、Google AdSenseなどの外部リソースを回避することも非常に重要です。 Cloudflareのような無料のコンテンツ配信ネットワークを使用することも役立ちます.

&#x1f680;速度のテストに最適なツールはどれですか?

GTmetrixは、すべての速度テストツールの中で最も堅牢な推奨事項を備えています。 Google PageSpeed Insightsは主に次の1つの目的に適しています-サーバーの応答時間の測定.

&#x1f680;どうすればウェブサイトの速度が低下しているのかわかりますか?

GTmetrixは、CDNを使用しているか、レポートまたはGTmetrixウォーターフォールに複数回表示される可能性があるプラグインを使用しているかにかかわらず、最適化が必要な画像を通知します。また、ホスティングが遅いかどうかを示す最初のバイトまでの時間も測定します.

&#x1f680;あまり知られていない速度のヒントは何ですか?

多くの人は、PHPバージョンをアップグレードしたり、GoogleフォントやYouTubeビデオなどの外部リソースを最適化したりしていません。画像と動画を遅延読み込みし、GoogleフォントとGoogleアナリティクスをローカルでホストすると、GTmetrixの多くのアイテムを修正できます。また、アフィリエイトの罠を避けるために、最高のホスティングプロバイダーについて公平な意見を得るためにFacebookグループに参加する必要があります.

&#x1f680;最高のホスティング?

SiteGroundとCloudwaysは、Facebookの投票で高い評価を受けた2つの強力なホスティングプロバイダーです。 SiteGroundは最も人気のある共有ホストの1つであり、クラウドホスティングにはCloudwaysが使用されます。これらは通常、クラスのトップ2です.

&#x1f680;最適なキャッシュプラグイン?

WP Rocketは、ほとんどのキャッシュプラグインにはない多くの速度最適化機能(遅延読み込み、データベースのクリーンアップ、GoogleフォントとGoogleアナリティクスのローカルホスト)を備えているため、複数のFacebook投票で#1キャッシュプラグインと評価されました。 WP Rocketで最適な結果を得る必要があります。そうでない場合、Swift Performanceは無料の優れたプラグインの代替品です.

このチュートリアルがお役に立てば幸いです。助けが必要な場合は、コメントにGTmetrixレポートを残してください。いくつかの提案があります。または、スピードオプティマイザの採用を検討してください.

乾杯,
トム

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map