Webサイトパフォーマンス管理と客観的評価手法セミナー

3月12日に開かれたWebサイトパフォーマンス管理と客観的評価手法セミナーに行ってきたー

1.サイトパフォーマンスの重要性

（ゴメスが定義する）サイトパフォーマンスとは？

• 表示速度 = ユーザーがWebページにアクセスしてから、完全にページが表示されるまでの時間
• 稼働率 = ページ稼働率（エラーになっていない率) + オブジェクト稼働率（エラーになっていない率）

サイト表示速度が企業経営に与える影響

• アマゾンはページの反応が0.1秒遅くなると、売り上げが「1%ダウン」する
• グーグルのページ反応が0.5秒遅くなると、アクセス数が「20%ダウン」する
• 一般的に表示スピードが1秒遅くなると、PVは11%、コンバージョンは7%、顧客満足度は16%ダウンする
  Aberdeen Group Report

ヨドバシドットコムとアリコのパフォーマンスダメージ

ユーザーがサイトを重いと感じる時間

Webサイトの反応時間の3つの重要限界

• 心理的・感情的な違和感を感じないのは0.1秒まで
• 思考の流れが妨げられないのは1秒まで
• 注意力を維持する限界の時間は10秒まで

2.事例：業界別パフォーマンス状況

銀行各社のパフォーマンス状況 全体的に速い表示速度を記録。 14位のイーバンク銀行はパーツ数の多さが原因で遅くなっている

不動産仲介各社のパフォーマンス状況 業界全体としては良好なパフォーマンス状況

ニュースサイト各社のパフォーマンス状況 業界全体としてはパフォーマンスは良くない トップページに動的なパーツが多いのも一因

ヤフー対Google対goo google.co.jpが0.171秒と最速。yahoo.co.jpは0.978秒、gooは0.524秒 （データセンター拠点からの測定。家庭PCからの測定の場合、High Broadbandで3.165秒）

3.パフォーマンス管理9つの道

1. あらゆる関係部署を巻き込む
2. パフォーマンス評価手法を共有する
3. ベースラインを設定する
4. ユーザーを知る
5. 機能設計基準以外にも注目する
6. 実際のパフォーマンスを測定する
7. サードパーティのパフォーマンスを測定する
8. パフォーマンス検証を継続する
9. パフォーマンス重視文化を仕組み化する

あらゆる関係部署を巻き込む

• 経営層 サイトパフォーマンスの劣化が収益に及ぼす悪影響はいくらか？
• 現場マネージャー サイト改修や新機能導入がパフォーマンスに影響を及ぼさないか？
• デザイナー リッチコンテンツやグラフィックで表示速度が遅くならないか？
• アプリケーション開発部門 コード手法ひとつでパフォーマンスに影響を与えないか？
• 品質管理部門 自分のデスクトップからではなく正確なユーザーエクスペリエンスはどのようなものか？
• オペレータ部門 ユーザーに一番近い立場にいる部門はパフォーマンスの影響状況をWebチームに迅速にフィードバックをする

パフォーマンス評価手法を共有する

• Availability：可用性 サイトがダウンしていない割合 稼働率が99%だと1年間の動作不能時間は3日15時間36分に及ぶ 経産省のSaaS産業向けのガイドラインでは稼働率を99.9％を保証するように通達
• Responsiveness：反応性 サイトの表示速度
• Consitency：一貫性 時間・地域等によらず一貫して安定していること
• User satisfaction：顧客満足度

ベースラインを設定する

• 競合他社と比較する
• パフォーマンス推移を知る

ユーザーを知る

• 最も重要なターゲット顧客を知る
• ターゲットの行動特性を知る
• 各ターゲットに最適化されたサイトを構築する

機能設計基準以外にも注目する

• スタンダードでないOS・ブラウザにも対応する
• iPhone等のスマートフォンにも対応する
• 世界各国からのアクセス（海外出張ビジネスマン・旅行者・海外居住者）に対応する （日本からみれば1秒前後のyahoo.co.jpもアメリカから見れば11-12秒、イギリスから見れば18秒）
• アプリケーション開発の王道は「最初はきちんと立ち上げること、次にそれを改善すること」
• ページサイズを管理する。特にページビュー上位10ページ
• IE6,7とFirefoxでのダウンロード速度の違い
• WindowsとMacでのダウンロード速度の違い

実際のパフォーマンスを測定する

• ISP拠点からのレスポンス計測
• リアルユーザー（家庭PC）からのレスポンス計測

サードパーティのパフォーマンスを測定する

パフォーマンス検証を継続する

• 日々のサイト更新の中でパフォーマンスに影響を与えることもある
• 競合他社の状況を常に監視しておく
• パフォーマンスエラーが検知できるような体制をつくっておく

パフォーマンス重視文化を仕組み化する

• 目標値を業績評価基準に組み込む
• 客観的・継続的で明確なパフォーマンス測定ツールの導入

4.どうしたらパフォーマンスが向上するのか？

Yahoo!Exceptional Performanceの14のルール

1. Make fewer HTTP requests
2. Use a CDN
3. Add an Expires header
4. Gzip components
5. Put CSS at the top
6. Move JS to the bottom
7. Avoid CSS expressions
8. Make JS and CSS external
9. Reduce DNS lookups
10. Minify JS
11. Avoid redirects
12. Remove duplicate scripts
13. Turn off ETags
14. Make AJAX cacheable and small

ゴメスが薦めるパフォーマンス改善ポイント

技術側面では、特に以下の4つが重要

• パーツ数を減らす
• JavaScript・CSS内の不要な記述を削除する
• CSSを適度に分割する
• サードパーティのコンテンツが悪影響を及ぼしていないかチェックする

• Webサイトのパフォーマンスを可視化！ / Gomez, Inc. | Web担当者Forum