响应式网页设计

响应式web设计，简称RWD，是在开发和设计网站过程中产生的一种方式，它的目的是让内容布局能随用户使用显示器的不同而变化。

【响应式布局】https://baike.so.com/doc/3979398-4175385.html

使网页在不同屏幕上以不同样式表现出来的响应式web设计则是由弹性网格布局，弹性图片/媒体和媒体查询等技术实现。媒体查询可解决页面布局被严重拉伸的问题，使网页适应屏幕。弹性网格布局可使媒体查询平滑过渡得更加流畅，弹性图片则可为特定的设备视口发送特定的图片。

随着社会的快速发展和科技的日新月异，我们身边已不单单局限于电脑，手机，还有各种联网电视，平板电脑，智能手表等电子设备，显示屏的大小也随之多样化，即使是同一种设备，显示屏也有上百种型号，为了让网页内容适应不同的视口和设备，响应式web设计就显得很重要了。

手机，在近几年已经逐渐成为了我们生活中不可或缺的电子设备，从statcounter网站调查中国用户使用手机vs电脑vs平板人数数据显示，2016年3月中旬手机开始超过电脑的使用率，可见响应式web设计的愈发重要。试想分别打开不能适屏的网页和适屏的网页，哪个的用户体验会更高呢？只有用户体验足够高，网页才可能被更多的浏览，信息才可能被更好的传达，这不正是网络的本质吗？此时拥有响应式设计的网页就更胜一筹了。平时我们班里港澳通行或出国签证都需在网上进行预约，广州市公安局的官方网站，使用了响应式web设计的网页自动适屏，布局排版与电脑版都有许多不同，完善了用户体验。反之，打开广东省公安厅出入境政务服务网，并没有使用响应式网页设计，操作十分困难。虽没有进行过调查，但从我身边人的使用经验来说，大多数人都会选择在广州市公安局网页上进行办事的预约。

【广州市公安局】https://baike.so.com/doc/3979398-4175385.html
【广东省公安厅出入境政务服务网】http://www.gdcrj.com/

现今的响应式web设计与前后端程序，我认为是一种不可分离，更加完善的关系，与前后端程序的结合，使网页页面相较以前更加丰富、美观、动态化，数据的存取和平台的稳定性与性能上就更不用说了。这也从另一方面更加完善了用户的体验。

名词解释

• 响应式web设计（RWD）
  网页内容随着设备的不同而适应设备调整呈现 。可以兼容所有尺寸的屏幕，随着手持设备（手机）屏幕尺寸繁多，也有很好的兼容性；而且开发
  一次，pc版和触屏版，手机版融合为一。
• fluid grid
  弹性网格布局。适应不同屏幕的网页布局。
• flexible images
  弹性图片/媒体。适应不同屏幕呈现图片或视频
• media queries
  媒体查询。当页面布局存在严重拉伸现象时，可使用CSS3的媒体查询根据屏幕宽度调整布局。
• (互联网与新媒体)市场调查机构 （statcounter）
  StatCounter 是美国一家网站通讯流量监测机构，提供各种类型的统计报告以及网站流量统计服务，用户嵌入StatCounter 代码后，可以查看网站访问量、访问来源、访问地区、浏览器类型等。
• HTML
  超文本标记语言。在WWW上的一个超媒体文档称之为一个页面。作为一个组织或个人在万维网上开始点的页面称为主页Homepage，或首页，主页中通常包括有指向其他相关页面或其他节点的指针（超级链接）。在逻辑上将视为一个整体的一系列页面的有机集合称为网站（Website或Web）。
• CSS
  Cascading Style Sheets。一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。