汗をかくことなくElementorサイトをスピードアップする23の方法

公開: 2022-02-04

Elementorは、コードを記述せずに視覚的に魅力的でレスポンシブなWebサイトを作成できるWordPressプラグインです。また、これを使用して、Webサイトのカスタム投稿タイプ、分類法、およびフィールドを作成することもできます。

しかし、大きな力には多くの責任が伴います。この投稿では、Elementorページビルダープラグインを使用してビルドする場合にサイトを高速化する方法を学習します。

開発者であり、セキュリティのベストプラクティスに従っている場合、この記事は適していません。ただし、Elementor Webサイトを高速化する方法を学ぶことに興味がある場合は、このまま読み進めてください。

Elementorサイトを高速化する方法はいくつかありますが、最初に、サイトまたはElementorの速度が低下する原因を知る必要があります。

あなたは読める

Elementor Vs Divi：どちらが最高ですか？
Elementor対Brizy：どちらを使用するのが良いですか？

読み込みが遅いWordPress/Elementorサイトの一般的な原因

あなたのサイト/Elementorを遅くすることができる多くの理由があります。それらのいくつかを以下に示します。

（i）サーバー：

サーバーが十分に強力でない場合、Webサイトの速度が低下する可能性があります。開始する前に、サーバーの処理能力を確認する必要があります。サーバーの品質が低いため、WebサイトでElementorページビルダープラグインを使用できなくなります。この場合、サーバーを変更する必要があります。

（ii）メディア：

Elementorサイトのパフォーマンスは、画像、写真、ビデオなど、使用しているメディアの種類によって影響を受けます。たとえば、メディアの読み込みに時間がかかる場合は、ウェブサイトの読み込み速度にも影響します。さらに、他のサーバーでホストされている画像や他のメディアは、Webサイトの速度を低下させる可能性があります。

（iii）外部スクリプト：

遅いサイトは外部スクリプトによって引き起こされるのが一般的です。これには多くの理由があります。 Webサイトに多くの外部スクリプトが含まれていると、速度が低下します。さらに、スクリプトが低帯域幅または速度の別のサーバーでホストされている場合、Webサイトの速度にも影響します。

（iv）プラグインとテーマ：

これらは、サイトの速度低下の主な原因です。多くのプラグインをインストールしたり、無料のテーマを使用したりすると、Webサイトの実行速度が低下します。コーディングが不十分な場合、サイトの実行が遅くなることがあります。また、テーマまたはプラグインがElementorページビルダープラグインでうまく機能しない場合は、間違いなくサイトの速度が低下します。

Elementorサイトをスピードアップするためのトップ23の方法（初心者向けガイド）

あなたがあなたのウェブサイトをより速くしたいならば、ここにあなたのためのいくつかの秘訣があります。

1）軽量テーマをインストールします。

強力なサーバーを使用している場合は、これを行うのに問題はありません。任意のテーマをインストールできますが、GeneratePressやAstraなどの軽量テーマを使用することをお勧めします。これにより、サイトの読み込みが他のテーマやプラグインよりもはるかに速くなります。

可能な限り、無料のテーマは避けてください。彼らは通常、ウェブサイトのパフォーマンスに影響を与える多くの膨張コードを持っているからです。ただし、Elementorの公式の無料テーマは間違いではありません。

GeneratePressとAstra：どちらが最適ですか？を読むことができます。

2）パフォーマンスが最適化されたホスティングサーバーを選択します。

サイトの速度を上げたい場合は、パフォーマンスが最適化されたホスティングサーバーを選択する必要があります。可能であれば、ホストにキャッシュプラグインをインストールすることもできます。ただし、ElementorWebサイトを実行するための共有ホスティングは避けてください。

サーバーが過負荷になり、ユーザー数が多いため、サーバーの実行速度は常に遅くなります。したがって、Elementor Webサイトのセキュリティと速度を確保するには、マネージドWordPressホスティングまたは専用サーバーを使用することをお勧めします。

最も人気のあるマネージドホスティングは次のとおりです。

WPエンジン
過剰
キンスタ

3）フォントをローカルでホストし、プリロードします。

Google Fontsを使用する場合は、ローカルでホストすることをお勧めします。 Google Fontsは、帯域幅と速度が制限された別のサーバーでホストされているためです。その結果、Webサイトへの訪問者のフォントの読み込みが遅くなり、ElementorWebサイトのパフォーマンスに悪影響を与える可能性があります。

プラグインを使用してローカルで、または手動でホストできます。次のプラグインのいずれかをインストールできます。

Perfmatters
WPロケット
WP-最適化

4）フォントの追加-表示の入れ替え：

フォント表示スワップを使用します。ローカルでGoogleFontsを使用している場合は、Elementorページで。それはあなたのサイトへの訪問者のためにフォントをプリロードするのを助けます。サイトで多数のフォントを使用すると、Elementorページのパフォーマンスに悪影響を与える可能性があることに注意してください。

フォント表示スワップを追加するには、任意のキャッシュプラグインを使用できます。しかし、パフォーマンスを向上させるには、WPロケットが最適です。

Elementor Font Swapを有効にして、パフォーマンスを向上させることもできます。

5）Elementor CSS + JavaScriptを削除します：

Elementorを使用すると、複数のCSSファイルとJavaScriptファイルが作成される場合があります。サーバーの速度が遅い、または帯域幅が狭い場合、Webサイトのパフォーマンスに悪影響を与える可能性があります。

キャッシングプラグインをインストールすると、テーマまたはプラグインからElementorCSSとJavaScriptを削除できます。私は常にWPRocketまたはその他の無料のキャッシュプラグインをお勧めします。ただし、最も望ましいオプションには、プレミアムプラグインが常に推奨されます。

6）CSSおよびJSファイルを縮小します。

手動でカスタマイズする場合は、サイトのCSSファイルとJavaScriptファイルを縮小できます。これは、サイトのパフォーマンスを向上させるのに役立ちます。サイトのCSSファイルとJSファイルを縮小するには、次のプラグインのいずれかを使用できます。

WPロケット
LightSpeedキャッシュなど。

7）画像を最適化する：

画像は、サイトの読み込みが遅い場合の最も重要な要素の1つです。ウェブサイトにアップロードする前に、画像を最適化する必要があります。 TinyJPGなどの無料のオンラインツールを使用して画像をWebサイトにアップロードする前に画像を圧縮するか、画像を圧縮することをお勧めします。

また、次のプラグインのいずれかを使用してこれを行うことができます。

WPスマッシュ
EWWWイメージオプティマイザー
ショートピクセル

8）CDNを使用します。

Elementorや、多くのリソースを消費する他の多くのプラグインを使用する場合、この場合、CDNが適しています。ただし、その結果、サイトが訪問者から離れた場所にあるサーバーでホストされている場合、サイトの応答時間と速度に影響を与える可能性があります。

Elementorサイトの場合、次のCDNのいずれかを使用できます。

MaxCDN
Cloudflare
KeyCDN

9）ページキャッシング：

それでも遅いと思われる場合は、ページキャッシュを使用すると、Elementorサイトの実行速度を上げることができます。 Elementor Webサイトを最適化するための最も効果的な方法は、ページキャッシュを使用することです。ページキャッシュプラグインを使用してサイトのページをキャッシュし、ロードを高速化できます。

ページキャッシュには、次のものを使用できます。

WPロケット
WP最速キャッシュ（無料）

10）ヘッダー、フッター、サイドバーをハードコーディングします。

Elementorは、多数の動的CSSおよびJavaScriptファイルを作成します。したがって、Elementorページをできるだけ高速に保つために、ヘッダー、フッター、およびサイドバーをハードコーディングすることをお勧めします。

ヘッダーとフッターをハードコーディングする方法はたくさんあります。たとえば、Static Headers＆Footersと呼ばれる無料のプラグインを使用して、Webサイトのヘッダー、フッター、およびサイドバーをハードコーディングできます。

11）高性能DNSを使用する：

高性能のDNSを使用することは、常に賢明なアイデアです。たとえば、Elementorを使用する場合、かなりの量の動的CSSおよびJavaScriptファイルを作成している可能性があります。 Elementorサイトの読み込みを高速化するには、高速DNSホスティングサービスを使用できます。

高品質のDNSは、Webサイトがどのデバイスでも可能な限り迅速に読み込まれるようにするのに役立ちます。しかし、最終的には、Googleの検索結果でどのようにランク付けするかが重要です。

あなたのウェブサイトのDNSホスティングには、Cloudflareを使用することをお勧めします。無料で、他のDNSサービスと比較して比較的高速です。

12）データベースを最適化する：

ElementorベースのWebサイトでは、WordPressデータベースに未使用のデータが多数作成される場合があります。データベースを最適化することで、このデータを簡単に削除できます。

WP-Optimizeを使用してサイトのデータベースを最適化することをお勧めします。このプログラムは、WordPressデータベースから不要なデータを削除します。結局、それはあなたのサイトからがらくたを排除し、そのパフォーマンスを向上させるのに役立ちます。

23 Ways To Speed Up Elementor Site Without Breaking Sweat 1 — *Perfmattersプラグインのデータベースオプション*

さらに、次のものを使用できます。これにより、プロセス全体がスケジュールに基づいて自動的に完了します。

Perfmatters

13）プリロード、プリフェッチ、プリコネクトを追加します。

Elementorなどの多くのプラグインは、多数のHTTPリクエストを作成します。したがって、プリロード、プリフェッチ、およびプリコネクトをサイトのヘッダーに追加することは賢明なアイデアです。さらに、この方法を使用すると、ほとんどのJavaScriptファイルとCSSファイルがブラウザーのキャッシュに残るため、Webサイトの速度が向上します。

以下は、ウェブサイトを高速化するためのHTTPリクエスト用の主要なWordPressプラグインのリストです。この構成にはWPロケットをお勧めします。

14）Gzip圧縮を有効にします。

HTML、JavaScript、およびCSSファイルを圧縮するには、Gzip圧縮を有効にする必要があります。これらの設定を支援するには、次のコードをWebサイトの.htaccessファイルに追加する必要があります。

 RewriteCond %{HTTP:Accept-encoding} gzip RewriteCond %{REQUEST_FILENAME}.gz -f RewriteRule ^(.+)\.(.+) $1 [QSA,B]

または、キャッシュプラグインを使用してサイトを圧縮および最適化し、パフォーマンスを向上させることもできます。

または、次を使用することもできます。

wp速度でページを飛ばすことが重要

15）ブラウザキャッシュを有効にする：

ブラウザのキャッシュは、Webサイトを高速化するもう1つの方法です。たとえば、サイトで多くのソーシャルウィジェットまたはブロック/要素を使用する場合、多くのHTTPリクエストを生成する可能性があります。したがって、より多くのHTTPリクエストを減らすために、ブラウザのキャッシュを有効にすることでサイトのパフォーマンスを向上させることができます。

WP Rocketプラグインまたはその他のキャッシュプラグインを使用して、WordPressサイトのブラウザーキャッシュを有効にすることができます。これが正しい解決策です。

16）レンダリングブロックリソースを排除します。

WordPressユーザーは、レンダリングブロックリソースに精通している必要があります。このコードは、WebサイトがDOMでその上にコンテンツをロードするのを防ぎます。

特にモバイルユーザーにとって、レンダリングブロッキングはWeb上で最大のパフォーマンスキラーの1つです。それらのほとんどは、レンダリングをブロックするリソースの許容度の低いネットワーク上にあります。

WordPressWebサイトのレンダリングブロックリソースを減らすことは常に賢明なアイデアです。無料のFastVelocityMinifyプラグインを使用すると、レンダリングをブロックするリソースを削除して、Webサイトのパフォーマンスを向上させることができます。

流れるようなものを使用することをお勧めします：

Asset Cleanup Pro
Perfmatters

17）使用するElementorウィジェットまたは列を減らす：

単一ページでElementorウィジェットを使いすぎると、Webサイトのパフォーマンスが低下します。したがって、WordPressWebサイトでのウィジェットまたは列の使用を制限することは常に良い考えです。

単一の列から始めて、さまざまなウィジェットを試してみることを検討してください。そうすることによって、あなたはあなたのウェブサイトの速度を上げることができるでしょう。もちろん、リソースを節約し、数が少ない軽量ウィジェットを使用する必要があります。

18）他の遅いプラグインを避けてください：

他のいくつかの遅いプラグインは避けるべきです。これらのプラグインは、Webサイトを高速化するようには設計されていません。代わりに、それらはあなたのウェブサイトの読み込み時間を増やします。したがって、大量のリソースを使用するため、Webサイトで遅いプラグインを使用しないでください。

19）不要なプラグインモジュールを無効にします。

Elementorから不要なプラグインモジュールを無効にする必要がある場合があります。それらはあなたのサイトでメモリリークやバグを引き起こす可能性があります。したがって、次のような不要なプラグインモジュールの使用は避けてください。

共有ボタン
ライブトラフィック
スクローラー共有

これらすべてを無効にして、パフォーマンスの違いを観察できます。モジュールにはWebサイトは必要ありません。

本当にソーシャル共有ボタンを使用したい場合は、軽量のNovashareプラグインをインストールできます。さらに、このプラグインはあなたのウェブサイトを遅くしません。

20）PHPバージョンをアップグレードします。

PHPバージョンをアップグレードすることをお勧めする場合があります。 PHP 7.4をまだお持ちでない場合は、できるだけ早くインストールする必要があります。

PHPのバージョンを常に最新の状態に保つ必要があります。 WordPressが特定のアップデートと互換性がない場合は、互換性のリリースを待つ必要があります。 PHPのバージョンを更新する方法がわからない場合は、ホスティングプロバイダーにお問い合わせください。

21）メモリ制限を256MBに増やします。

メモリ制限を256MBに増やすことを常にお勧めします。 WordPressはデフォルトで32MBのメモリで動作するように構成されており、メモリ不足のためにサイトの実行が遅くなることがあります。

現在低メモリホスティングを使用している場合は、WPメモリ制限をアップグレードすることをお勧めします。パフォーマンスを向上させるためにスワップファイルを作成することもできます。

wp-config.phpファイルに次のコードを追加することで、WordPressのメモリ制限を増やすことができます。

 define ( 'WP_MEMORY_LIMIT', '256M' );

ホスティングプロバイダーに連絡して、メモリ制限を増やすこともできます。

22）PHPタイムアウトを減らす：

PHPのタイムアウトを60秒から10秒に減らすと、サイトの速度を大幅に向上させることができます。

このコードを.htaccessファイルに追加できます。

 php_value max_execution_time 10

アクセスできる場合は、サーバーのphp.iniファイルで減らすこともできます。これについてもっと知りたい場合は、この記事を読むことをお勧めします

23）WooCommerceスクリプト、スタイル、カートフラグメントを無効にします。

すべてのWooCommerceスクリプトとスタイルを無効にすることができます。 Elementorからカートの断片を削除できます。さらに、Disable AllWooCommerceTrackingという無料のプラグインをインストールできます。これは、すべてのFacebookトラッキングコードが本番環境に組み込まれるのを防ぐのに役立ちます。

ただし、これらのスクリプトとスタイルをより適切かつスムーズに無効にするために、PerfmattersまたはAssetCleanupプラグインを常にお勧めします。

よくある質問

Elementorはあなたのウェブサイトを遅くしますか？

Elementorの最新バージョンでは、デフォルトでサイトの速度が低下することはありません。 Webサイトでこのプラグインを使用した後に問題が発生した場合は、互換性の問題である可能性があります。この状況では、上記のガイドに従う必要があります。

Elementor Editorがとても遅いのはなぜですか？

Elementorエディターのパフォーマンスが遅い場合は、インターネット接続のパフォーマンスを確認してください。問題が接続に関連していない場合は、高速ホスティングパッケージにアップグレードする必要がある場合があります。

場合によっては、これはサーバーの問題であるか、WebサイトがElementorプラグインと互換性がない可能性があります。プラグインを更新して、問題が解決するかどうかを確認する必要があります。このガイドに従って、WordPressの管理を高速化できます。

Elementorがモバイルデバイスで非常に遅いのはなぜですか？

Webサイトに含まれるアセットの数が原因で、Elementorが携帯電話で遅くなることがあります。この問題を軽減するには、アセットの数を減らしてみてください。

Elementorのパフォーマンスの低下は、常にパフォーマンスの問題が原因です。プラグインの競合が原因でエラーが発生した場合は、WordPressトラブルシューティングモードを使用してすべてのプラグインを無効にする必要があります。次に、プラグインを1つずつ無効にして、プラグインの競合を確認します。

次のトラブルシューティングプラグインを使用できます。

ヘルスチェックとトラブルシューティング

キャッシュを有効にしてから、キャッシュをクリアして、それが役立つかどうかを確認することもできます。それでも問題が解決しない場合は、キャッシュを無効にすることもできます。

なぜElementorはFirefoxでとても遅いのですか？

問題は、ブラウザの非互換性のために、FirefoxでElementorがかなり遅くなる可能性があることです。さらに、プラグインには、すべてのブラウザでサポートされていないWebベースの機能がいくつかあります。 ChromeまたはElementorまたはテーマ互換機能をサポートするその他のブラウザを使用してみてください。

ElementorでWooCommerceが遅いのはなぜですか？

プラグインの互換性は、Elementorの速度低下の主な原因の1つです。 ElementorをWooCommerceと一緒に使用すると、両方のプラグインがjQueryを広範囲に使用するため、互換性の問題が発生する可能性があります。

サイト上のすべてのWooCommerceTrackingを無効にして、それが役立つかどうかを判断することを検討してください。そうでない場合は、より高速なサーバー構成についてホスティングプロバイダーに問い合わせてください。

Elementorページの速度を上げるための結論

Elementorは素晴らしいWordPressページビルダープラグインです。ただし、他のプラグインと同様に、正しく使用しないとWebサイトの速度が低下する可能性があります。

Elementorサイトと他のページビルダーを使用して構築された他のWordPressサイトを高速化するための最も包括的なガイドを共有しようとしました。さらに、Elementorサイトの1つですべてのメソッドをテストしました。

この投稿が、私と同じようにElementorページの速度を上げるのに役立つことを願っています。 Elementorサイトでは、速度が90％（デスクトップ）以上向上しました。これは、ユーザーエクスペリエンスに役立ちます。

ガイドはできるだけシンプルにするように心がけていますので、ご提案やご質問がございましたら、下のコメント欄にご記入ください。