パフォーマンス向上のためのデザイン設計

7章外観とパフォーマンスの両面を考慮するには

サイトのユーザエクスペリエンスは、外観、アクセシビリティ、情報アーキテクチャ、ユーザビリティなど多数の要素で構成されています。パフォーマンスは、そういったユーザエクスペリエンス全体のうち1つの要素にすぎません。しかしパフォーマンスを高めていけば、ユーザエクスペリエンス全体の改善にもつながるのです。ページ容量を減らせば、限られた帯域幅のユーザがよりアクセスしやすくなります。ユーザの体感速度を高めれば、サイトの操作性が向上します。

一方で、サイトの高速化を進めていくには時間と労力がかかります。ユーザエクスペリエンスの高速化以外の領域を改善するために費やしてきた開発時間を失うことになります。皆さんにも、パフォーマンスの向上を目指したために、他のエクスペリエンス（外観など）を犠牲にしてしまった経験があるかもしれません。本章では、パフォーマンス向上に対する難しい決断をする時期やどのような犠牲を払うか、さらにどのような利点があるかについて取りあげていきます。

7.1　バランスを見つけだす

前章までお読みいただき、ブラウザがコンテンツをどのようにリクエストし、取得し、表示するかお分かりになったことでしょう。画像形式の違いによってそれぞれどのような効果を生み、どの画像形式が最適かについても理解されたことと思います。HTMLやCSSのデザインパターンのセマンティクスと再利用について考慮してきましたし、それによってクリティカルパスの読み込み順序を微調整することの重要性についても理解されていることでしょう。パフォーマンスを高めるための準備は整いました。後はそれらの材料をうまく活用していくだけです。

パフォーマンスは見た目の美しさと密接にかかわっています。フロントエンドアーキテクト兼コンサルタントのHarry ...