Google Lighthouseのサクセスストーリー：技術的な最適化によるパフォーマンスの向上

Google Lighthouseを使用すると、任意のURLの技術的パフォーマンスをすばやく簡単に評価できます。 詳細なテストでは、読み込み時間、アクセシビリティ、Webセキュリティを測定すると同時に、Webサイトの技術インフラストラクチャを改善する可能性を明らかにします。 このブログ投稿では、GoogleLighthouseを使用してオンラインパフォーマンスを向上させた企業の例をいくつか紹介します。 アジアのマーケットプレイスCarousellがLighthouseを使用して63％多いオーガニックトラフィックを生成した方法、トリップアドバイザーとExpediaのLighthouseパフォーマンススコアがGoogleのランキングとどのように相関しているかなどをご覧ください。

Google Lighthouseとは何か、検索エンジンのランキングとの関連性の概要をお探しの場合は、Searchmetricsホワイトペーパー「GoogleLighthouseランキングファクター2019」をお読みください。 このペーパーでは、1,500万件を超えるGoogle Lighthouse監査のデータに基づいて、Google.comのトップランクのウェブサイトの最適化の現状を分析しています。 ここからホワイトペーパーをダウンロードします。

GoogleLighthouseランキングファクター2019

サクセスストーリー1：アジアのeBayが灯台のパフォーマンスを17ポイントから84ポイントに引き上げた方法

私たちの最初の灯台のケーススタディは、eBay、マーケットプレイスcarousell.comに対するアジアの回答から来ています。 シンガポールのプラットフォームは主にモバイルトラフィックに依存しており、インドネシアやフィリピンなどの他のアジア諸国への拡大を視野に入れて、プログレッシブウェブアプリのモバイル読み込み時間を増やす方法を模索していました。 CarousellのWebTechLeadであるStaceyTayは、Mediumのブログ投稿で、Carousellが技術的なパフォーマンスの最適化にどのように取り組んだかについて説明しています。彼らのサイトの。

まず、Stacey氏は、最初のLighthouse監査の結果はモーニングコールでした。パフォーマンススコアはわずか17ポイントで、プログレッシブWebアプリとアクセシビリティのカテゴリの結果は非常に平凡でした。 HTTPSや安全なJavaScriptライブラリなどのWebサイトのセキュリティ面に焦点を当てたSEOとベストプラクティスの2つのカテゴリのスコアのみが満足のいくものでした。

これらの結果に基づいて、最適化は主に、パフォーマンスおよびプログレッシブWebアプリのLighthouseカテゴリの結果を改善することを目的としていました。 carousell.comのLighthouseスコアの前後の比較は、これらの領域でどの程度の進歩があったかを示しています。

技術的な最適化対策は2018年に実施されました。10月末に、StaceyTayはMediumでの成功を記録しました。 母国であるシンガポールでのcarousell.comのSEOの可視性を見ると、パフォーマンスが明らかに向上していることがわかります。

最適化に必要なタスクを実装する前に、明確なミッション目標が確立されました。

「パフォーマンスはユーザーエクスペリエンスであるため、新しいユーザーに最初から楽しいエクスペリエンスを提供したかったのです。 これを行うために、パフォーマンスファーストの新しいWebエクスペリエンスを設計しました。」 CarousellのWebTechLead、Stacey Tay

この使命は、ウェブサイトの技術的最適化の基礎を築きました。 重要なことに、これは副次的なプロジェクトとして扱われず、優先度が高く、専用のパフォーマンス予算が与えられました。 Staceyは、この使命を果たすことで、チームの意欲を高め、プロジェクトの重要性を経営陣に納得させ、プロジェクトの成功を実証することで投資を正当化することが容易になったと述べています。

予算に合意した後、Google Lighthouse監査のスコアに基づいて、目標が設定されました。

前述のように、最適化前のパフォーマンススコアはわずか17ポイントでした。 carousell.comのホームページを最適化した後、彼らはこれを84ポイントのスコアに上げました。 対処されたサイトのインフラストラクチャの側面には、ワークボックスのプリキャッシングとサービスワーカーを使用したより効果的なキャッシングシステムのセットアップ、画像の圧縮、CSSインライン化の適用が含まれていました。 これらの対策を組み合わせることで、高速でユーザーフレンドリーなプログレッシブウェブアプリの作成に貢献しました。これが、ページの読み込み方法です。

カルーセルのパフォーマンス最適化の成功の確かな証拠は、数字で見つけることができます。 ロード時間を65％短縮するだけでなく、トラフィックの増加で最も注目すべき改善が見られます。 最適化以降、カルーセルのオーガニックトラフィックは63％増加しました。

GoogleLighthouseランキングファクター2019を読む

サクセスストーリー2：ステープルズとウォルマートがより速い読み込み時間を使用してコンバージョンを促進した方法

ロード時間の最適化について話すとき、参照のポイントとして頻繁に使用されるいくつかのGoogle統計があります。 たとえば、読み込み時間が長くなると、モバイルユーザーが検索結果に戻る可能性も高くなります。 ロード時間が1秒から3秒に増加すると、バウンス率の確率は32％増加します。 ロード時間が1秒から5秒になると、バウンス確率は90％上昇します。

ページ速度分析ツールGTmetrixは、さまざまな小売Webサイトを調べて、読み込み時間を短縮することの具体的なメリットを調査しました。 例には、ステープルズやウォルマートなどの大手小売業者が含まれており、読み込み時間の短縮とコンバージョン率の向上の間に明確な相関関係があることを示しています。

GoogleLighthouseランキングファクター2019を読む

サクセスストーリー3：ダグラスがロード時間を半分に短縮する方法

次に、ドイツの香水大手であるダグラスに目を向けます。ダグラスは、GoogleLighthouseを使用してウェブサイトのパフォーマンスを大幅に向上させました。 彼らのサクセスストーリーは、トラフィックの大幅な急増により一部のユーザーがページを利用できなくなった2017年のブラックフライデーにまでさかのぼります。 当時のGoogleLighthousePerformanceスコアにも、明らかに改善の余地がありました。 ミュンヘンを拠点とするフリーランスのTechSEOコンサルタントであるMichaelSingerは、douglas.deのプロジェクトに取り組み、2018年5月から、ITとSEOの間の運用を調整しました。「最適化前は、3Gでインタラクティブになるまでの時間は20秒以上でした。 –今では約8秒に短縮されています。」

Google Lighthouse監査でこの印象的な結果を達成するために、香水小売業者のWebサイトの内部で大幅な変更が行われました。 「200を超えるテクニカルチケットを通過しました」とMichaelは説明し、行われた多数の変更を思い出します。モバイルサブドメインが非アクティブ化されました。 モバイルユーザーは現在、ダグラスのレスポンシブメインwwwドメインにアクセスしています。 また、douglas.deはJS Reactを使用するように変換されました。これにより、ノードとリクエストの数が減り、HTMLが圧縮され、画像サイズが小さくなります。 データベースの待ち時間も短縮され、いくつかのキャッシュの最適化が実装されました。

「私たちの仕事の焦点は、ウェブサイトをできるだけ早く使用できるユーザーです。 ページ速度の最適化の目的は、最初のインタラクティブ時間である4秒に到達することでした。 これは、JS Reactへの切り替えと、単一のレスポンシブWebサイトバージョンへの移行とともに、SEOの可視性の大幅な向上、トラフィックの増加、売上高の増加につながりました。」 マイケルシンガー、フリーランステックSEOコンサルタント

Google Lighthouse Performanceスコアを使用したこれらの最適化により、ページの読み込み時間が大幅に改善されました。 「メトリクスを検証するために、Instanaを使用してリアルタイムの速度テストを実行し、長期的な効果を示しています。 2018年4月、デスクトップの値はまだ8秒を超えていました。 2018年10月、私たちはしばしば4秒のマークを打ちました。」 最後になりましたが、Webサイトの技術的な可用性も改善され、ブラックフライデーで発生したようなトラフィックのピークをより適切に処理できるようになりました。

このパフォーマンスの最適化により、douglas.deのSEOの可視性が即座に改善されました。 2018年5月から2019年5月の間に、ドメインでは有機的な可視性が25％増加しました。

もちろん、Searchmetrics SEO Visibilityは、Googleでのウェブサイトのパフォーマンスの最初の指標の1つにすぎません。 Michael Singerは、douglas.deの最適化によって影響を受けた他のKPIについてさらに洞察を提供します。 「訪問数は大幅に増加し、売上高も大幅に増加しています」とMichael氏は言います。 コンバージョン率も同様の割合で増加しています。特に、SEOがdouglas.deの売上高を最大化するチャネルであるためです。

ダグラスの最適化の結果の概要：

• ページの読み込み時間-50％
• SEOの可視性+25％
• 訪問数、コンバージョン数、売上高が大幅に増加しました。

GoogleLighthouseランキングファクター2019を読む

サクセスストーリー4：URLのパフォーマンスがトリップアドバイザーとExpediaのGoogleランキングにどのように影響するか

Lighthouse Performanceスコアと実際のGoogleランキングとの関係を調査するために、私は旅行業界内で分析を行うことにしました。 ホテル、フライト、キャラバンのトピックに関する3,500の旅行関連のキーワードを照合し、Google.comのランキングページを分析し、これらのキーワードのトリップアドバイザーとエクスペディアのランキング位置を調べました。 結果：Google Lighthouseのパフォーマンスも高い場合、トリップアドバイザーとエクスペディアは上位にランクされます。

なぜここにそのような明確なつながりがあるのですか？ オンライン旅行業界は非常に競争が激しく、多くの大手企業が戦いを繰り広げています。 トリップアドバイザーやエクスペディアだけでなく、Booking.com、Hotels.com、FlightRadarなどもあります。これらはすべて信頼度が高く、定評のある人気ブランドです。 同時に、異なるブランドを区別することは困難です。 多くの場合、ホテルの説明などのコンテンツは非常に似ています。これにより、主要なUSPでWebサイトを目立たせることが難しくなります。 また、いくつかのランキングシグナルがほぼ同じである場合（同じサイズのブラン​​ド、同じようなインターフェイス、同じような機能、同じようなコンテンツ）、ランキングを決定する際の決定的な要因はWebサイトのパフォーマンスである可能性があります。

「優れたユーザーエクスペリエンスを実現するには、読み込み時間を短縮することが非常に重要です。 Webサイトを操作するときに中断するたびに、小さなフラストレーションが生じ、ユーザーのフラストレーションは、中断が発生するほど大きくなります。 読み込み時間がわずか数秒長くなると、多くのウェブサイトでバウンス率が上昇し、最終的にはコンバージョン率が低下します。」 Nils Kattau、コンバージョンスペシャリスト

Google Lighthouseの結果が市場にどの程度関連しているかを調べるには、カスタマイズされたSearchmetricsランキング係数を使用できます。 Googleは、関連する市場のGoogle Lighthouseデータを分析し、それを独自のSearchmetricsランキングデータと組み合わせて、Webサイトの技術的最適化のための具体的で実用的な推奨事項を提供します。 今日あなたの個人的なレポートを要求してください：

カスタマイズされたSearchmetrics灯台監査をリクエストする