Question

直到最近，网站设计普遍还在使用固定宽度（如960像素），以期给所有终端用户带来较为一致的浏览体验。这种固定宽度设计在笔记本电脑上显示刚刚好，而在高分辨率显示器上却会在两边多出些空白。

但现在有了智能手机。苹果公司的iPhone第一次带给我们真正意义上易用的手机上网体验，之后其他公司纷纷效仿。现在人们可以舒服地使用手机上网冲浪，不用再像过去那样需要有“挑圆片”⁽¹⁾世界冠军一样的灵活拇指，才能在小屏幕上看看网页。此外，消费者在家中上网时优先使用小屏幕设备（如平板电脑、上网本）正成为趋势。一个不争的事实是，使用小屏幕设备上网的人数正在以前所未有的速度增长。与此同时，27英寸和30英寸的大显示器也在快速普及。上网设备之间的尺寸差距与日俱增。

幸运的是，面对不断发展的浏览器和上网设备，我们有可行的解决方案。采用HTML5和CSS3技术的响应式网页设计，可以使网站兼容多种设备和屏幕。而这种方法的最佳之处，在于不需要什么服务器端方案，也完全可以实现。

本章内容

支持小屏幕设备的重要性

什么是移动网站设计

什么是响应式网页设计

优秀响应式网页实例赏析

视口和屏幕的区别

安装和使用修改视口的浏览器扩展程序

使用HTML5编写更简洁的标记

使用CSS3解决常见的设计问题