比方，生搬硬套的PC模块，无差异化的规划使得移动端阅读不佳，导航兼容性有限等等原因，上线几个月后又悄然下线。我不由反思，项目中是否应该推广响应式?今年年初重新启动了全站响应式项目，从产品、交互、视觉到开发，各个角色全方面参与了响应式项目，终究门户的页面完成全面响应式。

  概念

  Ehan Marcotte为A List Apart写过一篇介绍型的文章<响应式网页规划>。文中讲到响应式的概念源自响应式建筑规划，即房间或许空间会依据其内部人群数量和活动而变化。

  「最近一门新兴的学科“响应式建筑(responsive architecture)”开端在讨论物理空间依据活动于其间的人进行响应的办法。建筑师们通过把嵌入式机器人与可拉伸材料结合的办法，测验艺术装置和可曲折、弹性和扩展的墙体结构，到达依据挨近人群的状况变化的效果。运动传感器与气候控制系统相结合，调整围绕人们周围的房间的温度以及环境照明。已经有公司制造了“智能玻璃技能”，当室内人数到达必定的阀值时，它能够自动变为不透明状态，为人们供给更多隐私保护。」

  Web响应式规划的概念与之也十分类似。在如今技能飞快开展的时代，一贯是以快论英豪，设备和分辨率一日千里，就以分类相对明晰的iPhone为例，就有多达4种的分辨率和屏幕尺度，更别提厂商蓬勃开展的安卓机范畴。因此，为每种设备或许特定设备分辨率拟定相应的独立版本是十分费时吃力的工作。

  Web响应式规划的理念，应当是，页面能够依据用户的设备环境，包含系统，分辨率，屏幕尺度等等要素，进行自发式调整，供给更适合当前环境的阅读和操作体会，对已有和未来即将出现的新设备有必定的适应能力。

  实践

  有了概念，必定要谈谈完成的办法。类似于响应式建筑，Web页面也有对应关键要素。

  可曲折、弹性、扩展的墙体结构——可扩展的布局;

  运动传感器——MediaQuery;

  气候控制系统——栅格;

  艺术装置——css等等。

  以上给了我写文章的头绪结构灵感，所以先从最基础的布局谈起。

  可扩展的布局

  有一种流体布局的概念在早起web鼓起的时，就开端盛行了。它的概念是说页面会依据浏览器窗口的变化进行更改，网站能够通过保护一套代码，保质一致性的规划。我这儿着重的可扩展的布局也是根据这个概念，仅仅现在的办法多种多样，因此要着重页面布局的可扩展性。