越来越多的人现在通过智能手机访问网站，网页设计师正在争先恐后地创建适合 iPhone、Blackberry、iPad、上网本和小型计算机的网页设计。显然，不可能为不同的设备和不同的屏幕分辨率创建如此多的网站设计。现在有了所有新设备，除非 Web 开发人员考虑响应式 Web 设计，否则这样做将变得不切实际。
响应式网站设计是设计网站以响应他们正在查看的设备和屏幕分辨率。它涉及使用灵活的设计布局和网格、图形和 CSS 媒体查询。大多数网站都设计为在 1000 像素宽的桌面屏幕上运行。当在较窄的屏幕上查看这些内容时，网站看起来非常紧凑，带有水平滚动条。另一方面，更宽的屏幕会导致拉伸的网站有太多的空白。响应式网站设计将允许网站自动考虑图像大小、分辨率和脚本能力。这意味着网页设计师不必为每一个发明的新设备进行网页设计和开发，因为网站设计本身就会对用户的偏好做出反应。
术语“响应式设计”可以暗示以下内容：
针对不同设备和屏幕分辨率调整设计布局和图像
更改图像，使其在手机上使用低带宽
通过使用易于选择的大按钮和消除小屏幕不必要的元素来简化网页元素
Web 开发人员可以使用 CSS 媒体查询创建响应式布局。这些媒体查询允许设计仅在以特定高度或宽度或特定宽度/高度范围查看网站时应用的 CSS 规则集。例如，如果您在 700 像素宽的设备中查看网页，网页设计师可以自定义 CSS 规则，这些规则本身会调整网页元素的大小以适应更窄的屏幕。媒体查询的问题在于，当一个新的查询到来时，之前的设计风格会迅速改变。这个问题可以通过对某些元素使用 CSS 过渡来解决。
数据表通常很宽，缩放选项可让您放大和缩小以清晰阅读。这个数据表问题可以通过重新格式化数据表或使用饼图来解决狭窄的移动屏幕。以前当灵活布局出现时，布局列和文本是灵活的。网页中的图像可能会通过影响像素来破坏布局。但现在随着进步，可以在不破坏布局的情况下调整图像。此外，响应式设计不仅仅是调整图像和内容的大小以适应更小的屏幕。移动环境还可以依赖于相关和重点突出的内容、更简单的导航、行和列表等内容，而不是过多的列。
随着移动世界的不断创新，响应式网页设计并不是唯一的答案。它无疑可以增强用户体验，但不能解决每个平台或设备的问题。
