ウェブサイトの速度を部門横断的に修正する

ウェブサイトの速度最適化プロジェクトをさらに成功に導くために、他の部門はどのように貢献できるか。

Lina Hansson

「サイトの速度」に関するよくある誤解は、それは開発チームの責任だけだというものです。実際には、サイトを高速化するには複数の部門の協力が必要になります。どんなに才能があったとしても、開発者が単独で問題を解決することはほとんどありません。同僚と協力して速度を改善するには どうすればよいでしょうかこの記事では、（ウェブ デベロッパーとして）サイトの読み込み速度を優先し、最適化を行いながらさまざまな部門のサポートを受けるよう企業を説得する方法について説明します。また、最適化プロジェクトの成功に対する認知度を高める方法についても説明します。

ビジネス関係者と協力して速度を修正する

多くの企業は消費者行動の破壊的変化の真っただ中にいます。実店舗ではなくデジタル プラットフォームで購入する人が増えていることから、企業は迅速に調整する必要があると、収益が減少するリスクがあることがわかります。そのためには、新しい組織プロセスと考え方の両方が必要であり、関係者からの強い同意が必要です。

共通の課題

多くの場合、企業の編成方法は、いくつかのレベルで変更する必要があります。まず、収益の増加が見込める短期プロジェクトは、デベロッパーが取り組む時間がないと実現が困難です。リソースを割り当てる必要があり、関係者や経営幹部が優先度の高いプロジェクトであると示した場合、マーケティングやウェブ デザイナーなどの他の部門とのコラボレーションはよりスムーズになります。

この運用レベルとは別に、現在次の 2 つの変化が起きていることを関係者が理解することも重要です。

つまり、デジタル プラットフォームのエキスパートである人々の情報に基づいて経営上の意思決定を行う企業は、優位性を持つことになります。ビジネス上の意思決定を行うミーティングに 1 人のデベロッパーを招待して、最初からサイトとその制約を考慮し、売上の増加を図ることをおすすめします。

ステークホルダーに提案を送信する

一般的に、売り上げの約 10% はデジタル プラットフォームで発生していますが、調査によると、実店舗での売り上げの 85% はデジタル プラットフォームで最初に影響されています。特に、主要なデバイスとなっているモバイル デバイスで優れたパフォーマンスを発揮することは、当社のビジネスの収益にとって非常に重要です。そこで Google は、サイトのコンバージョン数を増やすのに役立つスピード プロジェクトを提案し、コミュニケーションの流れをセットアップして、サイトに影響する決定が行われる前に技術チームのインサイトをより効果的に活用できるようにします。

関係者とのミーティングを準備する

関係者と会う前に、ご自身のウェブサイトと競合他社のサイトのデータと、提案する変更に対して高い ROI を示すデータを用意してください。速度の重要性に関するデータを収集します。最適なシナリオは、そのデータが会社の収益に関連する場合です。方法は次のとおりです。

  • 相対的なモバイル コンバージョン率を計算します。 分析チームと協力して、スピードの価値で説明されている分析を行います。これまで、読み込み時間が同じ期間よりも大幅に長くなっていた期間（少なくとも 2 ～ 3 か月）があった場合、通常はサイトの速度の低下がモバイル コンバージョンに大きく影響します。分析を通じて、速度が悪い時期に企業が失った収益を計算し、速度の価値を証明できます。読み込み時間がほぼ同じレベルに留まっている場合、分析は難しくなり、以下の代替手段によってより多くの回答を得ることができます。
  • 統計モデルから速度の値を推定する。Google の TestMySite を使用すると、テストを実施し、サイトの速度がビジネスにもたらす影響を計算できます。必要なのは、1 か月の平均訪問者数、コンバージョン率、平均注文額に関するデータで、分析チームによるサポートを受けることができます。
  • ベスト プラクティスの事例紹介を提供する。また、サイトを高速化し、効果を実感している他社のユースケースも使用できます。ページ読み込み時間がコンバージョン率に与える影響: 12 件の事例紹介で例をいくつか紹介しています。
  • モバイルの重要性を示します。 モバイルとパソコンからのトラフィックの割合に関するデータを提供するよう分析チームに依頼する。
  • 料金体系を調べる。 上記の計算は、関係者にスピード感による収益増加の可能性を示すための方法ですが、関係者が決定を下すには ROI を知る必要があるので、推定費用を事前に準備しておくと、経営陣による意思決定を迅速に下すことができます。そのためには、当初の集中的なスピード プロジェクトにかかる時間と、その後のメンテナンスに必要な時間を評価します。たとえば、先進的な考え方: TUI でサイロを解消することでサイトの速度を上げるでは、開発者は作業時間の 20% をバックログやキャンペーンから解放し、スピード プロジェクトやその他のサイト改善の方法に充てることができました。

関係者とミーティングを行う

  • モバイルとパソコンからのトラフィック量と、モバイルからの過去数年間の増加率を提示します。これで、優れたモバイル エクスペリエンスを作成する重要性がわかります。
  • 速度が会社の収益にどのような影響を与えるかについて、調査結果を発表します。
  • 継続的にスピードアップに取り組む時間があれば、モバイル ユーザーから収益を増やせることをデベロッパーに知らせます。
  • サイトに関する意思決定を行う経営幹部会議に、開発チームの 1 人を招待することを提案します。今ではデジタル プラットフォームで販売しています。勝者となるのは、デジタル エキスパートとコミュニケーションを開始した企業です。現代の企業では、部門間、およびステークホルダーとデベロッパー間のコミュニケーション ストリームを設定する必要があります。Harvard Business Review の調査によると、IT プロジェクトの 6 つに 1 つで 200% の費用が超過しています。その一例が Kmart です。Kmart は、2000 年に 14 億ドル規模の IT モダナイゼーション プロジェクトを開始したとき、Walmart と Target に負けました。コミュニケーションとメンテナンスを早期に設定することで、サイロを破壊し、知識の共有を競争上の強みにすることができます。

マーケティング チームのサポートを受けて速度を修正する

共通の課題

マーケティング チームは、十分な情報に基づいて判断を下すために広告とデータを処理するツールを必要としますが、ほとんどのツールはウェブサイトの処理速度を低下させます。また、多くの場合はレンダリングをブロックするスクリプトが実装されているため、サイトにアクセスしたユーザーは、画面に何も表示されるまで待つ必要があります。したがって、バランスを取る必要があります。マーケティング部門にはデータとツールが必要ですが、マーケティングで十分な投資対効果を得られるよう、サイトの直帰率とコンバージョン率を高くするには、サイトを高速化する必要があります。

このバランスを取るには、スクリプトを慎重に使用する必要があります。

  • ほぼ同じものを測定する重複は避けます。
  • 使用しなくなったツールを削除する。
  • 「あれば便利」とは測定しないでください。測定はビジネス クリティカルなもののみで行う。

デベロッパーがマーケティング部門が何に頼っているかを把握するのは困難です。また、マーケティング部門はどのツールがサイトで特に負荷の高いものかを把握していない可能性があるため、共同作業が必要になります。

マーケティング チームに提案を送信する

通常、トラッキングや広告に使用するツールでは、サイトにアクセスしたユーザーがコンテンツを見るまでの時間がブロックされます。広告に料金を支払い、興味を持ってクリックしたものの、待たされてしまうため、マーケティング投資の価値が下がります。いらいらしてその場を離れてしまうリスクがあります。ある調査によると、速度指標である Time to Interactive が 0.15 秒から 0.3 秒に増加すると、コンバージョン率は約 50% から約 35% に低下しました。必要なツールとサイト パフォーマンスのバランスを取り、マーケティング投資の費用対効果を高めるために、この問題の解決に協力できますか？

マーケティング チームとのミーティングの準備

  • サイトに実装するスクリプトのリストを作成します。
  • リストをマーケティング部門に送信し、事前に内容を確認して 3 つのバケットに分類するよう依頼します。
    • ビジネス クリティカル。これらのスクリプトはそのまま残す必要があります。
    • あると便利です。使用が少なく、削除できる可能性のあるスクリプト。たとえば、ヒートマップや画面録画を収集しても、データの確認頻度が低く、アクションやコンバージョンの増加につながらない場合があります。このような場合は、ツールを（たとえば）2 週間だけ実行することに同意し、分析のために分析情報を収集してから、次の集中的なデータ収集の時間になるまでスクリプトをクリーンアップするとよいでしょう。
    • 未使用または未所有。これらは削除する必要があります。
  • スクリプトの有無によるサイトの速度を比較して、各スクリプトによってサイトの速度がどの程度低下するかを確認します。 WebPageTest では、[詳細設定] の [ブロック] タブで設定できます。または、Chrome DevTools でネットワーク リクエストをブロックすることもできます。

マーケティング チームとミーティングを行う

  • スクリプトのリストを確認し、各スクリプトに対する見解を示します。たとえば、あると便利なスクリプトが、サイトのパフォーマンスに大きく悪影響を及ぼすことはありますか？推奨事項を受け取ることで、マーケティング チームは優先順位を付けやすくなり、ビジネス クリティカルなことが何かを尋ねることで、マーケティング チームの視点を理解しやすくなります。
  • 次のトピックについて話し合います。
    • 収集したデータのメリットが、サイトの速度低下による減少を上回り、コンバージョン数の増加につながるか。データは意思決定の指針となる。
    • あなたの会社は、市場で最も高速なバージョンのツールを提供するプロバイダを選択していますか？マーケティング部門は、ビジネス クリティカルなツールをより高速な代替ツールに置き換えることができるかどうかを判断するために、デベロッパーの支援を必要とする場合があります。
    • サイトに掲載されているスクリプト以外の代替手段はありますか？たとえば、ヒートマップの代わりにユーザビリティ テストを実施して、ユーザーの行動の背後にある「理由」を聞くことで、より詳細な分析情報を得ることができる場合があります。

次のステップについて合意

  • 今後のプロセスを決定する。マーケティングにおいては、実装前に新しいツールとそれがスピードに及ぼす影響を確認するよう、デベロッパーに必ず求めるべきですか？または、マーケティング担当者が速度の確認方法を学んで、速度目標を満たしている限り、どのツールを優先できるかについてパフォーマンス バジェットを設定すべきでしょうか。

ウェブデザイン チームと協力して速度を修正する

ウェブ パフォーマンスに関する最大の課題の一つは、多くのリージョンで接続が高速になる可能性がある一方で、ウェブサイトの負荷が増加し、その結果として速度が遅くなっていることです。この問題を解決するために、デベロッパーはウェブ デザイナーと協力する必要があります。

共通の課題

結局のところ、収益の創出であろうとなかろうと、通常、社内のすべての部門はコンバージョンにつながるサイトに依存しています。ウェブページがどれほど美しくても、読み込みに時間がかかりすぎてユーザーが何度も閲覧しなくなるという厳しい現実は、問題ではありません。

しかし、スリムなウェブページは共有責任です。デベロッパーは、さまざまな画像最適化手法を使用して、画像の読み込みを高速化できます。ウェブ デザイナーは、ページの重量を合意レベルより低く抑えるページを作成できます。

ウェブデザイン チームに提案を送信する

調査によると、ページの画像と要素が少ないと、コンバージョンの増加が見込まれます。たとえば、Google と SOASTA の調査では、ユーザーがコンバージョンに至ったセッションの画像は、コンバージョンに至らなかったセッションより 38% 少なくなることがわかっています。速度目標を達成するために協力し、サイトでのコンバージョン数を増やすための共同連携を設定することはできないでしょうか。ともに実現できることの例としては、品質と速度のバランスを保ちながら適切なレベルの画像圧縮を見つけることや、サイトの処理速度が遅くなることの多い複雑なレイアウトや機能を減らすことなどが挙げられます。

ウェブデザイン チームとの会議の準備

  • サイト内で、読み込み時間が最も長く、ページのデータ量が最も大きいページを追跡する。たとえば、e コマースサイトを運営している場合は、ホームページだけでなく、キャンペーン ページ、主要なカテゴリページ、一部の商品ページ、購入手続きページも確認してください。
  • デザイナー向けにパフォーマンス バジェットの提案を準備する。代わりに、できる限りシンプルな指標としてページの重み付けを設定し、すべてのページの目標を 1 MB（ブランディングが非常に重要な場合は 1.5 MB）に設定することもできます。
  • 対象ページのウェイト レベルを超えるページのリストを用意します。

ウェブデザイン チームに相談する

  • 画像圧縮、レスポンシブ画像、画像のサイズ変更、遅延読み込み、キャッシュ保存、サーバーの最適化など、さまざまな画像最適化手法を通じて開発チームが画像をより速く配信する方法の調査に取り組む。
  • さまざまな画質とサイズで画像が公開されるテストページを作成し、さまざまな画面でパフォーマンスと品質のバランスが取れるレベルに合意します。モバイル ユーザーのセッションは短いことが多く、ある調査によるとモバイル セッションの半分以上が 30 秒以下であることがわかっています。このようなユーザーは画像を詳しく調べていないため、サイトの処理速度を速くすることを好む可能性があります。
  • パフォーマンス バジェットを提案します。この予算では、ウェブ デザイナーがすべてのウェブページのページ ウェイトを 1 MB 未満（または最大 1.5 MB）に抑えることを確約します。

分析チームと協力して速度を修正する

企業は、何に焦点を当てるべきかを理解し、意思決定の基盤を得るためにデータを必要としています。しかし、サイトの速度の重要性と、収益や売上への影響について多くの人が語っていますが、技術チーム以外では週次レポートに速度を記載していない企業もまだ数多くあります。これは、デベロッパーが分析チームとのコラボレーションを開始すると変更できます。

共通の課題

現実は、「レポートされていないものは重視されない」のです。サイトの速度がビジネス関係者向けの週次レポートや月次レポートに含まれないと、簡単に忘れられ、それに集中するためのリソースを確保することが難しくなります。ただし、分析チームは追跡速度に慣れていないことが多いため、デベロッパーの支援が必要になります。また、速度が改善された場合の収益への影響を計算するには、分析チームの支援が必要になります。これらの部門は初めのうちは 他に依存しがちです

分析チームに提案を送信する

サイトの速度が収益と直帰率に及ぼす影響は、多くの事例紹介で示されています。会社のサイト速度のトラッキングを共同でセットアップし、関係者に提出するレポートの一部としてスピードを確認して賛同を得ることはできるでしょうか。

分析チームとのミーティングの準備をする

  • 定期的に速度を測定する。おすすめの方法の 1 つは、Lighthouse CI、PageSpeed Insights、WebPageTest などのツールで API を使用することです。これにより、管理されたラボ設定で定期的に統計情報を収集し、さまざまな期間で簡単にベンチマークを実施できます。
  • スピードの価値を分析チームに転送し、分析を実施できるかどうかを尋ねて、会議中にグラフを分析できるようにします。

分析チームとのミーティング

  • 速度の値から作成されたグラフを確認します。相対的なモバイル コンバージョン率は、速度の影響とサイトの改善状況をトラッキングする 1 つの方法です。分析チームに追跡を開始してもよいかどうかを尋ねます。
  • Google アナリティクスの読み込み時間の指標が、シンプルなビジネス レポートに適しているかどうかを判断します。 速度の値では、この指標が使用されます。多くのデベロッパーに知られているとおり、これは重要な速度指標の 1 つにすぎず、Google アナリティクスで使用されるため、ラボデータではなくフィールド データでもあります。しかし、シンプルなビジネス レポートに使用するだけで十分でしょうか。上記の分析で得られた結果を確認し、少なくとも 2 ～ 3 か月間読み込み時間が長いと相対的なモバイル コンバージョン率が低下し、2 ～ 3 か月間読み込み時間が短いときに相対的なモバイル コンバージョン率が上がるかどうかを確認します。読み込み時間が安定している場合、速度が大幅に向上するまで、分析が機能しているかどうかを確認するのは困難です。その場合は、次の代替手段に進みます。
  • デベロッパーが使用している速度指標をグラフに表示する。分析チームに説明し、コンバージョン率や相対的なモバイル コンバージョン率との相関関係がないか確認します。
  • 分析チームが、収益に関連する計算で速度を使用する方法と、それを関係者に報告する方法を検討する時間を与えます。多くの場合、これは彼らにとって新しいトピックです。そしてもう一度ミーティングを行い、自分が賛同するアプローチを試してみましょう。いつものように、適切なものが見つかるまでデータ収集に変更を加える必要がありますが、これはコラボレーションを始めるための方法です。

次のステップ

スピード プロジェクトによって大幅な改善につながったら、分析チームにスピードの価値で説明されている分析を行うよう依頼します。これにより、獲得したコンバージョン数と収益がどれだけ増えたかが明らかになり、チームとコラボレーションしたすべての部門に報いることができます。これは関係者への週次レポートに記載できるため、プロジェクトは 1 回限りの取り組みではなく継続的に管理されます。