直到最近，网站设计普遍还在使用固定宽度（如960像素），以期给所有终端用户带来较为一致的浏览体验。这种固定宽度设计在笔记本电脑上显示刚刚好，而在高分辨率显示器上却会在两边多出些空白。
但现在有了智能手机。苹果公司的iPhone第一次带给我们真正意义上易用的手机上网体验，之后其他公司纷纷效仿。现在人们可以舒服地使用手机上网冲浪，不用再像过去那样需要有"挑圆片" 世界冠军一样的灵活拇指，才能在小屏幕上看看网页。此外，消费者在家中上网时优先使用小屏幕设备（如平板电脑、上网本）正成为趋势。一个不争的事实是，使用小屏幕设备上网的人数正在以前所未有的速度增长。与此同时，27英寸和30英寸的大显示器也在快速普及。上网设备之间的尺寸差距与日俱增。
幸运的是，面对不断发展的浏览器和上网设备，我们有可行的解决方案。采用HTML5和CSS3技术的响应式网页设计，可以使网站兼容多种设备和屏幕。而这种方法的最佳之处，在于不需要什么服务器端方案，也完全可以实现。 广州网站建设
本章内容
支持小屏幕设备的重要性
什么是移动网站设计
什么是响应式网页设计
优秀响应式网页实例赏析
视口和屏幕的区别
安装和使用修改视口的浏览器扩展程序
使用HTML5编写更简洁的标记
使用CSS3解决常见的设计问题
1.1 为什么智能手机很重要（而老版的IE不再重要）
虽然统计数据一般仅用作粗略参考，但来自gs.statcounter.com的统计数据却值得注意。从2010年7月到2011年7月的12个月中，全球手机浏览器的使用量从2.86%上升至7.02%。Internet Explorer 6的使用率则是从8.79%下降到3.42%。到2011年7月，Internet Explorer 7的使用率也降到了5.45% 。如果客户老是要求："我们的网站必须兼容IE6和IE7！"你可以反驳说："我们应该把精力花在更有价值的地方。"用手机上网的人比用台式机和笔记本中的IE6或IE7上网的人多多了。你可以听到全球前端开发工程师震耳欲聋的欢呼声！ 广州网站设计
越来越多的人使用小屏幕设备上网，这些设备上的浏览器在设计时都考虑到了如何显示好现有网站。手机浏览器会将一个标准网页缩小至与设备可视区域（标准技术术语叫做"视口"）恰好匹配。然后用户在自己感兴趣的内容区域上放大浏览。这样看起来已经挺好了，那作为前端设计师和工程师的我们，为什么还要在这上面继续优化呢？
 |
