响应式网站非常受企业的青睐

      互联网技术的快速发展，手机移动端用户在不断增加，仅仅依靠PC网站体验已经无法满足人们日常生活或工作的需要，人们对网站有着更高的要求。响应式网站应运而生，它能够很好的满足用户的需求，带给终端用户良好的访问体验。响应式网站已经成为当下较为主流的网站设计，越来越多的企业倾向于建设响应式网站。

响应式网站设计理念：

页面的设计与开发应根据用户行为以及设备环境(系统平台、屏幕尺寸、屏幕定向等)进行相应的响应和调整。具体的实现方式由多方面组成，包括弹性网格和布局、图片等。无论用户正在使用笔记本还是Pad，网站的页面都应能自动切换分辨率、图片尺寸及相关脚本功能等，以适应不同设备。

也是说页面应该有能力去自动响应用户的设备环境。响应式设计理念是一个网站能够兼容多个终端，而不是为每个终端做一个特定的版本。

响应式的特点

1.快捷传播，统一管理，维护方便，跨系统，跨平台，跨终端等标杆级网站。

2.只需对站点后台和域名作的维护和推广，降低网站运营成本，提高传播效率。

3.用户可以使用浏览器、二维码扫描工具等获取网站信息。

4.响应式架构会根据各终端设备的分辨率自动调整页面布局和体验交互程序，让用户能够快速、舒适、直观地从浏览器或微信平台等获取信息。

响应式网站的设计流程

1.确定需要兼容的设备类型、屏幕尺寸

通过对用户的分析研究，了解用户使用设备的分布情况，确定需要兼容的设备类型、屏幕尺寸。

设备类型：包括移动设备(手机、平板)和PC。对于移动设备，设计和实现的同时，要注意增加手势功能。屏幕尺寸：包括各种手机屏幕的尺寸(含横向和竖向)、各种平板的尺寸(含横向和竖向)、普通电脑屏幕和宽屏。需要考虑的是某个页面进行响应式设计时，其适用的尺寸范围是哪些?结合用户需求和实现成本，对适用的尺寸进行取舍。如一些功能操作的页面，如果用户没有在移动端进行操作的需求，没有必要进行响应式设计。

2.制作线框原型

针对确定下来的不同尺寸制作不同的线框原型，要了解不同尺寸下，页面的布局如何变化，内容尺寸如何缩放，功能、内容的删减等，也可根据不同的情况，针对特殊的环境做特殊化的设计。这个过程需要设计师和前端开发人员保持密切、良好的沟通。

3.测试线框原型

将图片导入到相应的设备进行简单的测试，能够帮助研发者尽早发现网站在可访问性、可读性等方面存在的各种问题。

4.视觉设计

视觉设计是很关键的一点，需要注意的是移动设备的屏幕像素密度与传统电脑屏幕不一样，在设计时，需要保证内容文字的可读性、控件可点击区域的面积等。

响应式页面的优点

1.跨平台。在手机，pad，PC端均有不俗的表现。

2.节省人力开发成本。不再需要有人分别的去维护PC页面，移动页面。

3.表现力一致。在不同的平台上看到的东西都是基本一致的，会让用户感觉体验良好。

响应式页面的缺点

1.自由度较低，局限性较大。你需要考虑在手机，pad，PC端上三种屏幕下的页面内元素的呈现，这会存在一定的局限性，如在PC上是横向滑动的通栏图，在手机和pad是不用的。只能用一张单一的图或者一组静态图来表达。

2.页面会比较大，在2G，3G网络下打开速度会比较慢。响应式页面是同时下载多套CSS样式代码，可能造成在手机上要下载PC/pad冗余代码，这没有什么意义，也浪费流量资源。

3.对于老版本IE(IE8及以下版本浏览器)兼容性不够友好，这是一个较为严重的问题，如果你的网站用户大多还采用老版本IE(IE8及以下版本浏览器)的话，建议不做响应式设计。