WPMU DEV メンバーがクライアント サイトを最適化して最大速度を実現する方法
公開: 2022-11-09WordPress サイトに関しては、誰もがスピードを必要としています。 しかし、私たちの Web 開発者メンバーは、実際にこれを最もよく達成するための実証済みの真の方法を持っています。
私たちは、Web 開発者メンバーが持っている集合的な豊富な経験に浸り、非常に速いサイト速度を得るためのトップピックの結果をまとめました.
この記事では、これらの取り組みが実際の (オンライン) 使用で非常に効果的である理由の詳細とともに、彼らの推奨事項を共有します。
これが私たちが見ているものです：
- スピードを上げるメリット
- エンゲージメントの作成と成長
- より多くのトラフィックを取得して処理する
- SEO ランクを上げる
- 作業を効率化するための推奨ツールとサービス
- キャッシングと CDN
- 画像とファイルのオプティマイザー
- プラグインとテーマ
- 高品質のホスティング
- グラブバッグ (その他) ツールとヒント
- テストのすべての重要な側面
- WordPress ウェブサイトのパフォーマンスを改善する
これはスピードがすべてなので、実行に移しましょう。
スピードを上げるメリット
私たちのほとんどは、「より速く、より良い」というモットーに同意しますが、それがなぜなのか、またはそこに到達する方法を完全には理解していないかもしれません.
WordPress のパフォーマンス最適化の利点は数多くあり、それぞれを注意深く調べていきます。
エンゲージメントの作成と成長
数え切れないほどの調査によると、サイトが遅いことが、ユーザーがやり取りせずに離れてしまう最大の理由です。
人々は、カーソルが回転している間は待ちたがりません。 私たちはほんの数秒しか話していません – 2 秒以内です。 Google によると、これがウェブサイトの読み込み速度です。
オンライン アクティビティには無限の選択肢があることは誰もが知っているので、迷わずバウンスすることを躊躇しません。
より多くのトラフィックを取得して処理する
速度の向上は、トラフィックの増加に直接関係しています。つまり、インタラクションとコンバージョンが指数関数的に増加する可能性が高くなります。
幸運にもサイトへの訪問者を獲得できた場合 (確立された訪問者が戻ってきたり、新しい訪問者が初めて見たりする場合)、リソースの必然的な増加が誰かのエクスペリエンスに悪影響を与えないように、物事を設定する必要があります.
SEO ランクを上げる
SEO には多くの要素がありますが、サイトの速度は間違いなく大きな要因です。
Google の検索ランキング アルゴリズムは、サイトの速度をシグナルと見なし、ページのパフォーマンスも検索エンジンのランキング要因と見なします。
したがって、サイトの速度が速ければ速いほど、SERP で上昇する可能性が高くなります。これは理想的な目標です。
作業を効率化するための推奨ツールとサービス
上記のように、私たちはメンバー集団の Web 開発の専門家と話をして、サイトの速度についての考えを聞きました。
彼らは、このテーマに関する総合的な知識と、サイトを最高のパフォーマンスで運用する (そして維持する!) ために使用する特定のツールとサービスを共有しました。
彼らが言わなければならなかったことを見てみましょう。
キャッシングと CDN
キャッシングが提出物を上回りましたが、それには正当な理由があります。
キャッシュにより、サーバーに送信されるクエリの数が最小限に抑えられます。つまり、ページのパフォーマンス、読み込み時間、およびユーザー エクスペリエンスがすべて向上します。
さらに、サイトのデータがユーザーの場所の近くにキャッシュされると、消費するリソースが少なくなるため、サーバーの負荷が軽減されます。
コンテンツ配信ネットワーク (CDN) は、ユーザーに最も近いネットワーク ロケーションからキャッシュされたコンテンツを提供し、その配信を高速化します。アーキテクチャは、トラフィックを長距離および複数のネットワーク間で伝送することによって生じるネットワーク レイテンシを削減するように設計されています。
これはすべて、サイトの速度とパフォーマンスを向上させることに相当します。
「私は Smush と、[wpmudev] ホスティングにあらかじめパッケージ化されているすべての CDN を使用しています!」 – JD
「CDN によるホスティングは、WordPress サイトの速度に大きな違いをもたらします。」 – マシュー・フォース
「CDN で最適化された画像とそうでない画像の違いは計り知れません」 – JD
一番のおすすめ:
CDN
クラウドフレア
何百万人もの人々に信頼されている Cloudflare は、インターネットに接続するすべてのものを安全、プライベート、高速、かつ信頼できるものにするために設計されたグローバル ネットワークです。
QUIC.cloud
QUIC.cloud CDN は、静的および動的な WordPress コンテンツの両方をキャッシュできる数少ない CDN の 1 つです。 オンライン サービス、画像の最適化、重要な CSS、独自の CSS、および低品質の画像プレースホルダーを使用して、ページ速度スコアを最大化します。
キャッシュプラグイン
ハチドリ
Hummingbird は、専門的なキャッシングと圧縮を使用して、サイトにフライトを提供します。 完全なキャッシング スイート (ページ、ブラウザー、オブジェクト、Gravatar、および RSS) であることに加えて、Hummingbird はあらゆるレベルでアセットの最適化も提供します。
「私はすべてのサイトでハミングバードを使用しています。それが私が WPMU DEV メンバーになった理由です。」 – kahnfusion
「[Hummingbird] の Speedy 機能を使用していますが、大規模なプロジェクトでは手動でファイルを最適化しています。 「重い」サイトでも、非常に良い結果が得られました。 – イシドロス・リガス
ライトスピードキャッシュ
LiteSpeed Cache for WordPress は、専用のサーバー レベルのキャッシュと一連の最適化機能を備えたオールインワンのサイト アクセラレーション プラグインです。
WP Rocket は、JavaScript の実行の遅延、未使用の CSS の削除、縮小、LazyLoad など、パフォーマンスを向上させる一連の高度なオプションを提供します。
ニトロパック
NitroPack は、キャッシング、画像の最適化、すぐに使用できる CDN を備えています。 サードパーティのプラグインや複雑なセットアップは必要ありません。
画像とファイルのオプティマイザー
サイトの速度に大きな影響を与えるもう 1 つの要素は、アセットの最適化です。
これらのアセットに関しては、ファイルと画像の 2 つのカテゴリがありますが、それらを最適化する方法は多少重複します。
それぞれの最高のパフォーマンスを得る方法をいくつか見ていきます。
ファイルの最適化:
- Gzip (テキスト圧縮) を有効にする
- 遅延読み込みコメントと小さな投稿
- サイト要素をキャッシュする (例: ページ、ブラウザ、グラバター、RSS)
- ファイルの縮小 (不要な CSS と JS コードを取り除く)
- 小さいファイルを結合する (ファイルが少ない = リクエストが少ない)
- CSS の延期 (スクロールせずに見えるコンテンツの読み込みを延期)
- Javascript のプリロードと遅延 (JS の実行時間を修正し、より小さなペイロードを配信)
画像の最適化:
- 圧縮して画像サイズを縮小する (非可逆または可逆)
- 最適なファイル形式 (PNG、JPEG など) を選択します
- JPEG にプログレッシブ ロードを使用する
- 次世代ファイル タイプ (Webp) を使用する
- オフスクリーン画像の遅延ロード
- 画像配信を最適化する (CDN を介して提供する)
小さな微調整のように見えるものは、顕著な速度の向上につながります。
一番のおすすめ:
ハチドリ
全体的なキャッシング ウィザードであることに加えて、Hummingbird は、アセットの整理、ファイル サイズの縮小表示、Gzip 圧縮、Web ページとスタイルシートの圧縮、ファイル転送時間の短縮など、さまざまな最適化機能を処理します。
自動化とシングルクリック設定により、セットアップは簡単です。
ああ、ハミングバードは無料です。
スマッシュ
スマッシュは私たちを地図に載せました。 100 万以上のアクティブなインストールと 5 つ星中 5 つを誇るこの強力なパフォーマーは、印象的な服装をしています。
無制限の画像の最適化 (Bulk Smush、Super Smush = 2x 圧縮)、遅延ロード、自動サイズ変更、圧縮、バックアップまたは元の画像の一括復元、Google PageSpeed の推奨事項の解決 - すべて 1 つのシンプルで直感的なダッシュボードから。
スマッシュも無料です。
「完璧に近いパフォーマンスが必要な場合は、テンプレートをコーディングし、ほとんどのプラグインを wpmudev プラグインに置き換えます。結果は素晴らしいです (ほとんどの場合、GTmetrix で A、Google ページの速度で 100% 近く)。」 – アントワーヌ
「スマッシュとハミングバードはあらゆる場所に出入りします。 Smush には何のリクエストもありません。チャンピオンです。」 – トニー・G
「私はすべてのサイトで両方 (Hbird と Smush) を使用していますが、何も変更する必要はありません。プラグイン設定テンプレートが出てきて以来、設定するだけで忘れてしまいます!」 – フィル
「スマッシュはいつも素晴らしいと思ってきました。 私は本当に、本当にそれが好きです。 数回クリックするだけでできることは非常に印象的です。」 – マット
「Smush はすでに完璧に見えます…どうすれば改善できるのかわかりません。」 – イシドロス・リガス
EWWW
独自のサーバーでツールを使用して画像を最適化し、CPU を集中的に使用する最適化プロセスを専用のサーバーにオフロードして、さらに圧縮します。
画像は自動的に圧縮され、ページとデバイスのサイズに合わせてスケーリングされ、遅延読み込みされ、次世代の WebP 形式に変換されます。
ショートピクセル
最小限のリソースを使用し、共有、クラウド、VPS、または専用の Web ホスティングとうまく連携します。 メディア ライブラリにリストされていない画像であっても、Web サイト上のあらゆる画像を最適化します。
最も一般的な画像タイプと PDF ファイルでは、非可逆圧縮と可逆圧縮の両方を使用できます。
プラグインとテーマ
ほとんどの Web 開発者は、使用するプラグインの数が速度に影響することは間違いありませんが、最も重要なのはそれらのプラグインの品質であることに同意しています。
トップのヒント：
- プラグインを最も重要なものに限定し、使用していないプラグインを削除します。
- できるだけ軽量のテーマを使用してください。
- WP データベースをクリーンアップして、未使用のプラグインによって残された不要なファイルを取り除きます。
「何度も何度もプラグインを最小限に抑えることに尽きます。 1 年前は平均 20 を使用していました。現在は (WPMUDEV 標準を除いて) 5 をほとんど使用していません。私のサイトは同じように機能していますが、10 倍の速度です! – JD
「使用するプラグインの数を常に最小限に抑えるようにしてください。」 – ジェームズ
一番のおすすめ:
エレメンター + こんにちはエレメンター
Elementorは、WordPress 向けのナンバー 1 のウェブサイト プラットフォームです。 ランディング ページや e コマース ストアから本格的な Web サイトまで、Elementor のライブ ドラッグ アンド ドロップ エディターですべてを構築できます。
無制限の WP サイトを無料で管理
Hello Elementorは、Elementor ページ ビルダーと組み合わせるために特別に設計された最小限のバニラ テーマです。 リリース後すぐにチャートのトップに立ち、100 万以上のアクティブなインストールがあり、4.5/5 つ星を獲得しています。
ディビ
Divi は、信じられないほど高度なビジュアル ビルダー テクノロジーにより、WordPress をまったく新しいレベルに引き上げます。
標準の WordPress 投稿エディターを非常に優れたビジュアル エディターに置き換える Web サイト構築プラットフォームであり、驚くほど簡単かつ効率的に素晴らしいデザインを作成することができます。
レンガ
ヘッダーからフッターまでサイト全体を視覚的にデザインするための、より高速でカスタマイズ可能でパフォーマンスの高いツールです。 動的データを挿入し、複数のブレークポイントを編集およびプレビューして、モバイル向けに最適化された完全にレスポンシブな Web サイトを作成します。
ブレイクダンス
120 の組み込み要素、最新の UI とワークフロー、WooCommerce との深い統合を備えた Breakdance は、WordPress 用の究極の Web サイト ビルダー プラグインです。
10ウェブ
史上初の AI 搭載の WordPress ビルダー。 Web サイトの初期構造とデザインを AI で取得し、Elementor ベースの 10Web ビルダーで編集して、ワンクリックで公開します。
「無料版で興味深いことをしているこのサイトを見つけました。これは、モバイルのページ速度スコアのゲーム チェンジのようなものです。 より良いサイトを短時間で構築するのに役立つスマートな機能がたくさんあります。」 – エドアルド
空気
Web サイト全体の強力なビジュアル編集。 基本的な HTML 要素で構築します。 PHP、CSS、および JS をライブで記述します。
機能は次のとおりです。要素の端をドラッグして間隔を設定するか、ドラッグ アンド ドロップして並べ替えます。 WooCommerce ストアのすべての部分を視覚的に制御します。 スティッキー ヘッダーやオーバーレイ ヘッダーなど、カスタム Web サイト ヘッダーを視覚的に作成する。 一箇所で色を編集します。
「Oxygen のような高速 Web ビルダーは、Web サイトの速度を一変させます。」 – グレッグ
インプレッサ
最高評価の WordPress Web サイトと WooCommerce Builder テーマ。
「高性能だからインプレッサを使っています。」 – フィル
アンダースコア
次の最も素晴らしい WordPress テーマに変わるためのスターター テーマです。 CSS が最小限に抑えられているということは、デザインの邪魔になるものが少なくなることを意味します。
高度な DB クリーナー
時間が経つ (またはプラグインを頻繁に使用する) と、WordPress データベースは古いリビジョン、孤立した投稿メタ、スパム コメントなどを蓄積し、サイトの動作が遅くなり肥大化します。
このプラグインは不要なデータを簡単に削除して、データベースのサイズを縮小し、Web サイトの速度とパフォーマンスを向上させ、データベースのバックアップを高速化します (ファイルが小さくなるため)。
高品質のホスティング
もちろん、ホスティングは私たちの Web 開発者リストのトップに上り詰めました。彼らの声は、質の高いホスティングがいかに重要であるかを熱望しています。
このリストにあるすべての速度節約要素を配置してから、共有サーバー、最小限のリソース、または標準以下のサポートを備えたホスティング プラットフォームを使用すると、すべての努力が無駄になります.
Web ホストは、オンライン コンテンツを保存する場所以上のものを提供します。 それらはサイトの基盤です。 安全で信頼できる評判の良いホストを選択して、オンライン レジデンスを構築してください。 それに伴う心の平和と成功は、すべてのペニーの価値があります。
一番のおすすめ:
WPMU DEV ホスティング
高速で、WordPress 専用で完全に最適化されており、共有も中断もありません。
機能の一部を次に示します。10 のデータ センター + 45 ポイントの CDN。 FastCGI; クラス最高のセキュリティおよびサイト管理ツール。 99.9% のアップタイム保証; WooCommerce に最適化。 プレミアム サポート (24 時間 365 日)。
私たちの言葉を鵜呑みにしないでください。 志を同じくする他の人々が私たちについて何を言わなければならないかを見てください.
「良いホスティングを選択することが重要です。 WPMU DEV ホスティングは素晴らしいです。」 – グレッグ
「私の最速のサイトは WPMU Dev ホスティングにあります」 – Brad
「ホスティング: WPMU DEV 100%」 – フィル
A2ホスティング
強化された保護機能で安全。 テーマとプラグインを管理するための管理対象サーバーの利点とツール。 99.9% の稼働率と 24 時間年中無休の社内サポートによる安定性。
「A2 は私の非 WPMU DEV ホスティングです。 Turbo (LiteSpeed サーバー上) は非常に高速です。」 – グレッグ
グラブバッグ (その他) ツールとヒント
他のカテゴリに当てはまらないツールやヒントもいくつかありましたが、それらは間違いなく会話に価値をもたらすため、それらを含めたいと考えました.
カスタム スニペットを使用して微調整を行う
「不要なページのスクリプトをデキューしたり、Jetpack、WooCommerce、Core などの機能を無効にしたりして、読み込みに時間を浪費する必要がないことを行うために、カスタム スニペットを常に作成しています。」 – 超愛らしい
「functions.php ファイルに数行追加することでできることであれば、プラグインを追加しないようにしています。」 – マット
コード スニペット
サイトでコード スニペットを実行するための簡単でクリーンでシンプルな方法です。スニペットを追加し、テーマの functions.php ファイルにあるかのように実際にサイトで実行するための GUI インターフェースを提供します。
スニペットは (プラグインと同様に) アクティブ化および非アクティブ化でき、別のサイトに転送するためにエクスポートできます。後でコード スニペット プラグインによってインポートするために JSON で、または独自のプラグインまたはテーマを作成するために PHP でエクスポートします。
統計: アクティブなインストール数: 700,000+、~400 件のレビュー、星 5/5
LMS プラットフォームの操作
「私は LMS プラットフォームを扱っていますが、これ以上のことはできませんし、達成することもできませんでした。 コースを構築するために Web サイトを操作することは、過去のものになりました。」 – マヌエル
LearnPress
レッスンとクイズを含むカリキュラムを使用して、コースをオンラインで簡単に作成して販売し、すべてユーザーフレンドリーなインターフェースで管理します。
コーディングの知識がなくても、教育用またはオンライン コースの Web サイトを簡単かつ迅速に作成できます。 機能を拡張する無料およびプレミアム アドオンのライブラリもあります。
統計: アクティブなインストール: 100,000+、500+ レビュー、4.5/5 つ星
クラウド サーバー管理プラットフォームを使用する
ランクラウド
最新のサーバー管理パネル; クラウド サーバー管理用のエンタープライズ グレードのプラットフォーム。 サーバー構成とセキュリティ更新を自動化します。
RunCloud を使用すると、Linux の専門家でなくても、DigitalOcean、AWS、Google Cloud、または Vultr を利用した Web サイトを構築できます。 このグラフィカル インターフェイスを使用して、手頃な価格でクラウド上にビジネスを構築します。
「非常に多くの異なるホスティング戦略をテストした結果、これが最も効率的なものであることがわかりました。Runcloud は優れた API を提供するため、作成が非常に速く、多くの自動化が可能です。」 – リカルド
テストのすべての重要な側面
サイトの実行を高速化するために使用できる変数は非常に多いため、何が最も効果的かを本当に知る最善の方法は、配置したものをテストすることです.
また、WordPress Web サイトの動的な性質のため、すべてのコンポーネントがどの程度うまく実行されているかを監視し続けることが不可欠です。
推奨速度テスト ツール:
Google PageSpeed – PageSpeed Insights (PSI) は、モバイル デバイスとデスクトップ デバイスの両方でのページのパフォーマンスについてレポートし、そのページを改善する方法について提案します。
GTMetrix – サイトのパフォーマンスを確認し、遅い理由を明らかにし、最適化の機会を発見します。
Checkbot.io – ページの速度と SEO に影響を与えるさまざまな事柄について、非常に詳細なレポートを作成します。 壊れたリンク、重複したタイトル、無効な HTML、安全でないページ、および 50 以上のその他のチェックについて、一度に数百のページをテストします。
WebPageTest – 世界中の実際のブラウザー、デバイス、および場所で、サイトの速度、使いやすさ、回復力を即座にテストします。
Lighthouse – Web アプリのパフォーマンス、品質、および正確性を向上させるための Chrome ブラウザー拡張機能および自動化ツール。 ページに対して一連のテストを実行し、その結果と改善のために何ができるかについてのレポートを生成します。
Sizzy – Web 開発者向けのブラウザー。 複数のビューポートでのテスト、パフォーマンス スコアの確認、すべてのユースケースの開発とテストを、通常のブラウザーで手動でシミュレートする必要なく行うことができます。
定期的なテストと微調整は、次のレベルの速度を維持するための重要な部分です。 したがって、好みのツールを選択し、これを一貫して行うようにしてください。
WordPress ウェブサイトのパフォーマンスを改善する
WordPress サイトの高速化の重要性はいくら強調してもしすぎることはありません。
ウェブサイトにすべてを注ぎ込みました。今度は、その優れたコンテンツと競合するページの読み込み速度を組み合わせて、エンゲージメントとコンバージョンを増やしましょう。
WordPress サイトを高速化するための非常に多くのオプションがすぐに利用でき、その多くが無料であるため、それらを有利に利用しないのは意味がありません。
うまくいけば、この投稿で紹介したツールやテクニックをすぐに取り入れて、サイトの速度がどれだけ向上するかを自分の目で確かめてください。
WPMU DEV メンバーでない場合は、リスクなしで (クレジット カードは必要ありません) 試してみて、あなたのサイトをどれだけ補完できるかを確認してください。 私たちのサポートは比類のないものであり、WordPress のあらゆる問題を解決します – それが私たちの製品ではない場合でも.