响应式网站（Responsive Web Design）是由网页设计师兼开发者Ethan Marcotte在2011年提出的一个概念：使网页根据不同设备环境自动响应及调整。

       近年来，随着网络环境的日益完善、移动互联网技术的发展，PC互联网加速向移动端迁移，手机网民的规模在不断扩大。截至2015年12月，我国网民规模为6.88亿，其中手机网民规模达6.2亿，占所有网民的90%以上（图1 为中国手机网民规模及其占网民比例）。可见手机上网在所有的上网方式中占有越来越重要的比重，因此网页在移动端的体验绝对不能忽视。

图1

  不同设备的屏幕分辨率不同，一般的网页直接放到平板、手机上等移动设备上显示，多数情况下将出现显示不完全、图文排版错位等问题。而且由于不同设备使用时的网络环境不同，对于移动端，多数网民需要通过接入蜂窝移动网络上网（图2 为网民网络接入情况），尤其是在外出的时候，信号不一定好。若不对移动端网页进行优化、简化，将会使得网页加载时间长、耗费流量多、浏览体验差，使得客户流失。

图2

  以往，很多网站的解决办法，是为不同的设备提供不同的网页，专门提供一个mobile版本或者ipad版本等。这样做确实能够保证效果，但是比较麻烦，要同时维护几个版本，而且如果一个网站有多个入口，会大大增加架构设计的复杂度。

       于是，有人设想，能不能"一次设计，普遍适用"，让同一张网页自动适应不同大小的屏幕，根据屏幕宽度，自动调整布局？基于此，Ethan Marcotte提出了响应式网站的设计理念。

       以下（图3）是青朴科技的一个网站开发的案例，正是使用了响应式布局，CSS（用于生成样式的代码）根据不同屏幕大小加载不同的代码资源。使得该网站在不同设备上，布局灵活变化，均展现出良好的显示效果。

图3

  文中涉及数据来源：CNNIC 第37次《中国互联网络发展状况统计报告》