随着移动互联网高速发展的，智能手机的普及速度扩新设备的层出不穷，为跟上时代的脚步，时下想要跟随新潮流的公司纷纷进入当代多屏世界，以时髦的响应式网站吸引来自不同终端的用户。其中也不乏一小部分不甚了解什么是响应式网站的客户；今天青岛网站建设公司云企网络就给大家简单的科普下什么是响应式网站，响应式网站与传统网站的优缺点。

一、什么是响应式网站

响应式Web设计(Responsive Web design)的理念是，页面的设计与开发应当根据用户行为以及设备环境(系统平台、屏幕尺寸、屏幕定向等)进行相应的响应和调整。具体的实践方式由多方面组成，包括弹性网格和布局、图片、CSS media query的使用等。无论用户正在使用笔记本还是iPad，我们的页面都应该能够自动切换分辨率、图片尺寸及相关脚本功能等，以适应不同设备。简单来说就是适配各种终端的网页设计。根据不同的屏幕宽度加载不同的结构，如下图所示，上面的是响应式布局，下面的是传统pc端布局:

二、需不需要响应式

对于响应式页面，很多人都以为是一种网站跨平台的解决方案。但是对于绝大部分的网站来说，其实就是一种排版技巧。只是这种排版技巧带有很多的细节调整。并不是所有的网站都适合响应式设计。所以不要盲目跟风：

1、国内的一些电商类网站可能还真不适合

    原因：因为国内的电商类网站都太复杂，整个页面都是大而乱的，巴不得把所有的内容都让你在一页内看到。这对于响应式页面来说是大忌，或者说是更本搞不了的。

2、这个是要看你做的页面类型。比如说，内容型的网站，确实很适合响应式的页面，但是具有一定功能性的网站就不一定适合了。

    原因：资讯型网站页面结构比较单一，适合响应式的前端页面内容微调。而具有一定功能型的网站对于页面的整体排版和样式要求较高。

3、时间投入响应式网站需要花费更多的时间，如果项目时间很紧的话，要好好考虑一下。但是多花费的时间会在维护成本中得到弥补。

4、支持浏览器支持，渐进增强和优雅降级;

三、响应式网站的优点和缺点

响应式页面的优点

    1) 跨平台：在手机，pad，电脑上均有不俗的表现。
    2) 一个URL：让你的用户在移动设备上更容易找到，而且不需要任何的重定向，这在较慢的网速下特别的有用。
    3) 更少维护：开发一个独立的移动网站，会增加你的工作负担。实际上你就拥有了两个独立网站。如果你有一个响应式网站，维护的成本将会很小，因为它只有一个布局，且可工作在所有类型的设备上，而这可以明显地减少你的工作量。

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

响应式页面的缺点

    1) 自由度太低，局限性较大。你需要考虑在手机，pad，PC上三种屏幕下的页面内元素的呈现，会导致有着非常大的局限，比如说我在PC上是横向滑动的通栏图，但是在手机和pad就是不用的。所以，你就只能用一张单一的图或者一组静态图来表达。
    2) 浏览器兼容性不足：对于IE6,7,8等就直接悲剧了。页面简直惨不忍堵。如果您是网店的老板，与跟随潮流，试验未来相比，活在当下，尽可能地与客户成交才是最重要的。
    3) 时间花费：开发响应式网站是一项耗时的工作。如果你计划把一个现有网站转化成响应式网站，可能耗时更多。如果你想要一个响应式网站，最好从草图开始重新设计。
    4) 页面会比较大：在当前国内渣渣2G，3G网络下打开速度会比较慢。由于响应式页面是同时下载多套CSS样式代码，可能在手机上就下载PC/pad的冗余代码，其实毫无意义，而且浪费了流量资源。

    5) 优化搜索引擎：对于响应式Web设计，为搜索引擎确定关键字不是一件容易的事。因为相比一般桌面用户，移动用户多采用不同的关键字，修改标题及其他事项都比较困难。

总结来说，事物都是利弊结合，响应式只适用某些网站，不可一概而论，各种移动设备的发展导致每种移动设备都希望拥有适合自己设备的网页。但是Web设计和开发根本无法追赶设备与分辨率的更新，如果不能满足各种设备下用户的使用，就会流失掉用户群，响应式设计的出现有效地解决了这个问题。