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

5章レスポンシブWebデザイン

モバイルはもはや「未来」の話などではありません。第1章で述べた通り、世界中の膨大な数のインターネットユーザが、インターネットアクセスの一次的な手段としてモバイル端末を利用しています。誰もがインターネットのアクセスにモバイルを利用するようになり、ユーザの所有するそれぞれの端末に独自の問題が生じています†1。モバイルネットワーク上の膨大な待機時間（「1.2.1 モバイルネットワーク」参照）と、Wi-Fi信号の強度やバッテリー性能などハードウェア面の問題（「1.2.3 モバイルハードウェア」参照）の間で、可能な限り高パフォーマンスで効率的なサイトのデザインと開発をしていくことが、これまでになく重要になっています。そのため、ユーザにとって不要なオーバーヘッドをなくし、ユーザの体感速度をあらゆる画面サイズで最適化することを目指していかなくてはなりません。

[†1] On Device Research「The Mobile Only Internet Generation」（2010年12月14日）http://slidesha.re/eW8wQ9

レスポンシブなWebデザインのサイトが抱える課題とは、不要なコンテンツ――大きすぎる画像、未使用のCSSやJavaScriptなど――をうっかり配信する可能性が非常に高い点です。それは、レスポンシブなデザインの制作過程では、小型画面向けにレイアウトやコンテンツを最適化する目的で、追加のタグや機能を取り込んでしまう場合が多いからです。大多数のサイトではデザイナーや開発者当人すら気づかないうちに、モバイル端末向けに（大型画面の容量と）同じページ容量または追加のページ容量を配信してしまっていますが、その理由もよく分かります。 ...