サイトの診断が完了したら、結果をわかりやすくまとめましょう。
- ステークホルダーごとに異なるレポートを作成することを検討します。
- ビジネスニーズに焦点を当て、技術的指標がどのようにこれらのニーズをサポートするのかを示します。
- 要約から始めます。
- ツールの出力データを単純にリストするのではなく、トピック（読み込みパフォーマンスやページのウェイトなど）ごとにデータを構造化します。
- 結果を優先度で並べ替えます。
- 関連性のない、または関心のない検索結果を除外します。
- 可能な場合は、数値データをチャートやグラフとして提示します。
- サイトに詰め込みすぎないようにしましょう。サイトのレビューは退屈なものではありません。
監査を受ける側の人々に配慮する。
サイトの担当者は問題に十分気づいているかもしれません。問題が修正されていない理由は、技術面以外の複雑な理由にある可能性があります。
単に障害のカタログを一覧表示するよりも、機会と解決策の観点からパフォーマンスが低いことを説明したほうが、はるかに役に立ちます。
調査結果を広く発表する前に、可能な限りサイト デベロッパーや他の関係者に相談してください。
コンテキストを提供する
レビュー結果を共有する際は、コンテキスト データを含めて、労力を正当化し、デベロッパーやその他の関係者が提案する改善を実装するように動機付けすることができます。たとえば次のような DoubleClick です。
- ユーザーの 53% は、読み込みに 3 秒以上かかるサイトを放棄しています。
- モバイルサイトの読み込み時間が 5 秒であれば、モバイル広告の収益は最大 2 倍になります。
- モバイルサイトの平均読み込み時間は 19 秒です。
neotys.com には、パフォーマンスを向上させるビジネス上の理由の包括的なリストがあります。サイトのパフォーマンスを向上させる方法について詳しくは、perf.rocks と ウェブの基礎をご覧ください。事例や成功事例もご覧いただけます。
パフォーマンス バジェットが決まっていない場合は、今がチャンスです。予算を算出し、サイトの収益を見積もります。
有望度を示す
Chrome DevTools のローカル オーバーライドを使用すると、ウェブサイト アセットをローカル バージョンでオーバーライドできます。これは、単純な変更によって大きな違いがもたらされることを示す優れた方法です。
次に例を示します。
- サイトのホームページで使用する CSS のバージョンを作成し、冗長なルールを削除します。
- HTML を変更して JavaScript の読み込みを遅らせる。
- 画像ファイルを最適化バージョンに置き換えます。
変更されたファイルをサイトの開発者と共有し、改善点を同僚に直接示してもらうこともできます。また、ローカル オーバーライドを使用すると、最適化されたバージョンと最適化されていないバージョンでのパフォーマンスの違いを示すスクリーンキャストを並べて簡単に作成できます。このアプローチは、長々とした ToDo リストよりもはるかに説得力のあるものです。ローカル オーバーライドの使用方法については、こちらをご覧ください。