パフォーマンス最適化週間 — 知っておくべきことすべて
公開: 2021-08-10今週、私たちのコミュニティは、21 人の尊敬されているパフォーマンスの専門家とつながり、最も差し迫った Web 最適化の質問をしたり、重要な最適化の課題について学んだり、最適な結果を達成するためのベスト プラクティスを発見したりするユニークな機会があります。 以下では、最も一般的な 3 つの Web パフォーマンスの問題と、主要なパフォーマンスの専門家によるそれらへの対処方法について詳しく説明します。 それでは、これ以上苦労せずに、最適化を始めましょう!
「サイト スタッフィング」
Web サイトを構築する際の最も重要な経験則の 1 つは、価値のないウィジェットやプラグインを削除して「サイトのスタッフィング」を回避することです。 これにより、ユーザーエクスペリエンスが向上するだけでなく、アイテムが少なくなるため、速度が向上します. Elementor Expert の Tim Liversage は、特定の機能セットにコミットする前に、すべての要素がどのように機能するかを学び、すべてをテストするようアドバイスしています。
Brian Erickson 氏によると、サイトのパフォーマンスを向上させるための重要なポイントは次のとおりです。
- 軽量テーマを選択
- WordPress インストールごとに最大 10 ~ 15 個のプラグインをインストールします
- 主要な機能が 1 つだけのウィジェットを多数追加するのではなく、さまざまなタイプの機能を提供する多目的ウィジェット (画像ボックス ウィジェット、CTA ウィジェットなど) を 1 つ見つけるようにしてください。
- 複数の列ではなく、ウィジェットのレイアウトにインライン配置を使用します (列を追加するたびにより多くのコードが必要になり、Web サイトのパフォーマンスが低下します)。
- 可能な限り最高のキャッシュ ツールを使用します。サイトによっては、WP Rocket または WP-Optimize をお勧めします。 一部のウェブサイトはロケットでより良いパフォーマンスを発揮しますが、注意してください。 他の人は最適化でうまくいく
- アップロードする前に画像のサイズを変更して圧縮し、アイコンやイラストには SVG ファイルを使用します
ジュリアン・ソング
シェイ・トーダー
ブライアン・エリクソン
ティム・リバーセージ
モバイル画像の最適化
デスクトップに幅 1920px/2560px の画像を読み込むと、デフォルトでは同じサイズの画像がモバイルにも読み込まれます。 デスクトップ サイズの画像を (モバイル サイズの画像ではなく) モバイルに読み込むと、Web サイトのパフォーマンスと Core Web Vitals 指標が大幅に低下する可能性があります。 これを防ぐために、Elementor Expert の Shay Toder は次のようにアドバイスしています。フォトショップなどのグラフィックソフト。
デスクトップ モードでセクションまたは列の背景画像を追加する場合は、必ず [レスポンシブ モード] アイコンをクリックして、背景画像を新しいモバイル サイズの画像に変更し、モバイル ビューに合わせてください。 このプロセスにより、デスクトップ用の全幅画像とモバイル用の 480 ピクセル幅の画像が生成され、Core Web Vitals 指標も改善されます。」
不十分なホスティング
Web ホスティングは、Web サイトのパフォーマンスに大きな影響を与える可能性があります。 これは、ホスティング会社がウェブサイトの読み込み速度と Google Core Vitals スコアに影響を与えるためです。 残念ながら、多くの Web サイト所有者に共通する盲点は、信頼性が高く堅牢なホスティング会社を選択し、安価なホスティングを控えることの重要性を過小評価していることです。
Elementor のエキスパートである Julian Song は、彼の推奨事項を次のように共有しています。 次に、ローカル ホスティング サービス プロバイダー (つまり、ターゲット ユーザーがいる場所) に移行するようクライアントにアドバイスします。 ただし、視聴者が世界中に散らばっている場合は、CDN サービスを使用して遅延を 150 ミリ秒未満に短縮し、ウェブサイトをさらに高速化することを強くお勧めします。」
別のパフォーマンス最適化の問題または質問に遭遇し、それについて専門家に相談したいですか? ここをクリックして質問を送信してください。8月 10 日と 8 月 12 日に開催される Q&A セッションで、21 人の精査された専門家の 1 人があなたの質問に答えます。
質問に対する簡単な回答以上のものをお探しですか? 専門家ネットワークを回ってみることをお勧めします。 Elementor Experts Network は、Elementor ユーザーがプロの Elementor Experts を検索して雇うことができる包括的なプラットフォームです。Elementor は、彼らが私たちの基準を満たし、実際に彼らの仕事において最高であることを確認するために精査します。
WPのウェブサイト
即座に