RWD(Responsive Web Design)：

Wikipedia的定义：「自适应网页设计（英语：Responsive Web Design，通常缩写为RWD）是一种网页设计的技术做法，该设计可使网站在多种浏览装置（从桌面电脑显示器到行动电话或其他行动产品装置）上阅读和导航，同时减少缩放、平移和捲动。」 具体来说RWD是在客户端侦测屏幕尺寸和尺寸的改变(比如手机从垂直显示变成横向)来改变页面佈局和外观，配合如流体佈局和可以自适应的图片/视频等技术，使页面只需同一套程式码，就能够适应不同屏幕尺寸的技术。

• 选择性加载CSS和流体佈局
  流体佈局是多年前已经流行的技术，指页面佈局会随着浏览器尺寸改变而变化，例如两栏弹性佈局，一边是固定宽度的边栏，另一边是弹性宽度，随着浏览器尺寸改变而填充空间。 CSS3的新功能Media Queries，原理是制定不同断点(Break point)，当屏幕尺寸符合某2个断点之间的范围，就使用特定的CSS来改变佈局，通常还会配合流体佈局使用，例如使用百分比定义元素宽度而不是固定宽度，提高页面自适应性。
• 自适应的图像和视频
  以相对单位(%，em)调整多媒体大小。
• 相对大小字体
  同2，对字体不使用绝对单位(px，pt)，而使用相对单位(em)。
• 页面缩放控制
  使用HTML的标籤，控制页面在设备上的缩放初始值和被用户缩放的上下限等。
• JavaScript
  除了CSS3的Media Queries，也会能使用JavaScript侦测屏幕尺寸变化，对页面作出比CSS更大程度的调整。
• 兼容性
  有移动优先(Mobile first) 和渐进增强(Progressive enhancement) 2个概念： 移动优先是由于较基础或较旧的浏览器不能使用Media Queries或JavaScript，因此比较好的做法是先做出通用的固定佈局框架，之后再为功能较强的浏览器提供增强功能。 渐进增强是使用某些侦测技术推断浏览器是否支援个别功能，例如JavaScript的库Modernizr。也会使用Polyfills来以非官方的技术为特定浏览器补充其所缺失的功能。

AWD(Adaptive Web Design)：

"Adaptive Web Design"一词最初由Aaron Gustafson着作的同名书籍提出，他认为除了使用RWD技术于客户端控制页面佈局外，也应该针对不同客户设备来增减内容和外观以提高适应性和用户体验。AWD可以在伺服端或客户端以设备辨识技术来为不同设备提供不同内容，甚至是另一套程式码，页面或站点。

• 伺服端辨识客户设备使用伺服端的辨识，来决定执行什么程式，例如决定是否转址到行动设备的程式码，这是许多网站经常使用的方式。
• 客户端辨识客户设备Google所推荐的方式JavaScript-adaptive概念，使用相同的HTML/CSS/Javascript在各种不同的载具上，不同的载具会有不同的执行结果。
• 不同版本的资源网站开发者会先准备好不同版本的内容和资源，根据辨识的结果来提供对应的版本。还能从不同伺服器的运行速度，或者域名的网络速度等层面实现更大程度的优化。

RWD与AWD比较

简单来说，RWD主要是依靠高弹性的佈局策略，使同一个页面能适应不同设备的运行环境。AWD则是通过辨识客户设备，提供针对该设备的不同版本的页面内容和资源。 RWD和AWD有很多重叠的特性，甚至有人说RWD是AWD的一个子集。两者没有明显的优缺点，支持RWD的说法认为不应该因为用户使用移动设备就删减内容或限制功能，应该公平对待。而支持AWD的说法则认为移动设备有不同于桌面设备的使用情况，包括网速，流量，性能等，应该针对其提供优化过的页面，并批评RWD在移动设备上加载体积巨大的图像，运行性能消耗大的脚本等。然而这些问题也有解决方法，对于图像，可以利用CSS的层叠特性和Media Queries技术，先加载体积小版本的图像，当页面尺寸符合较大的断点时才加载更大尺寸的版本。而性能方面也能通过JavaScript对页面元素做更多调整来优化，例如于移动设备上(辨识客户设备或侦测屏幕尺寸)不运行对性能要求高的脚本等。甚至也出现RESS(Responsive Web Design with Server Side Components，透过伺服器端元件的响应式网页设计) 的概念，就是RWD和AWD同时配合使用，例如佈局具有RWD的良好弹性，也会用设备辨识技术，于某个断点使用AJAX动态加载对应该设备的资源。

RWD和AWD两者并没有明确的实现标准和优缺点，都是以提高用户体验为目标，开发者应该根据不同情况，选择该使用的技术，弹性处理。