带你读《2022技术人的百宝黑皮书》——下一代响应式Web设计： 组件驱动式Web设计（2）https://developer.aliyun.com/article/1340896?groupCode=taobaotech
虽然这种依赖动态分辩率布局的方案可以在不同的分辨率下提供更佳的体验，但随着 2005年08月10日 Opera 软件公司推出Opera Mini（地址：https://www.webdesignmuseum.org/web-design-history/op-
era-mini-2005）和 2007年01月09是第一台 iPhone（地址：https://www.webdesignmuse-
um.org/web-design-history/steve-jobs-introduced-the-first-iphone-2007）手机的出现，市场上不同品 牌，不同分辨率的移动端以及品牌商自己的Web浏览器就越来越多。
在这种环境之下，基于动态分辨率加载不同的样式表已不太现实，Web开发者不得不想出其他的方案来适应不同的 屏幕尺寸。在很长一段时间，甚至到今日，为了适应不同屏幕的尺寸适配，为移动端单独创建一个网站，即 移动子域名网站。比如 Facebook的桌面版本和移动端版本，采用两个不同的域名来访问：
如此一来，开发人员要开发两个版本，相应的工作量就更大了，特别对于要快速响应和试错的Web应用来说，难度变得更大。
Web开发人员为了能改善这种现象，在 2010 年的时候，Ethan Marcotte（@beep）基于 John Allsopp
（@johnallsopp）的 《网页设计的道（A Dao of Web Design）》（地址：https://alistapart.com/article/d-ao/），提出响应式Web设计思路（《Responsive Web Design》）（地址：https://alistapart.com/article/re-sponsive-web-design/）。从此响应式Web设计（Responsive Web Design，简称 RWD）的身影就出现在了公众面前。
Ethan Marcotte（@beep）在《Responsive Web Design》（地址：https://alistapart.com/article/respon-sive-web-design/）中提到，响应式这个词源自于建筑学领域，原本指的是建筑物本身会“响应”实际的使用情 况，来自我调整。在Web开发领域，“响应式”的意思就变成了，我们开发的Web页面会“响应”用户的设备尺寸 而自动调整布局。在这篇文章中提到过，我们可以基于 流体网格（Fluid Grids）、灵活的图片（Flexible Imag- es）和媒体查询（Media Queries） 三种技术来构建一个响应式Web网站或Web应用。
另外，Ethan Marcotte（@beep）构建了第一个具有响应式的Web网页，可以说是响应式Web设计经典案例之一
（只可惜现在打不开了）：
那通过这个示例，大家对响应式Web设计是什么样的有了一个初步的了解了。其实，Ethan Marcotte 在他的文章中就提到：
带你读《2022技术人的百宝黑皮书》——下一代响应式Web设计： 组件驱动式Web设计（4）https://developer.aliyun.com/article/1340893?groupCode=taobaotech
