2015大趋势：响应式布局设计

响应式布局大趋势

         办公一台电脑？上班或出去玩的时候手里抓着一两个手机？Ipad？回到家，又守着笔记本？放眼一看，其实大家都差不多。移动端需求量庞大，但功能强大的PC还是必不可少的。这时我们就会想到，我们希望可以随时随地浏览那些常用的网站，包括我们借朋友手机用或换了新的手机或笔记本或Ipad的情况。但对于开发者来说，现在各种分辨率的设备层出不穷，如果为每个网站做出适应这么多类型的版本，这工作量可想而知，真是巨恐怖，且后期维护也是很很麻烦的事。
         我们可以考虑下响应式布局（Responsive Web Design,RWD）。

         简单来说响应式布局就是一个网页适应多个终端，它在不同分辨率的设备下都能让用户体验到舒适的浏览，但工作量大，高成本低效率；代码累赘，载入时间会加长，布局结构的改变也可能引起用户混淆，总体来说性能会受到一定的影响，因此这是一种折中的办法。

响应式布局设计4种模式——大图平铺、中心定位、两侧定位、全屏响应

• 大图平铺，图片大小根据屏幕自适应，菜单和字体根据屏幕进行大小变换和移位
• 中心定位两侧自适应，把重要内容放在中间，将次要的菜单和按钮放两侧
• 两侧定位中心延展，主要信息放在左侧或右侧，次要菜单信息放在另一侧
• 小切糕全屏响应，又称瀑布流设计，比如花瓣网那样的

响应式布局设计更多信息

如何设计响应式布局？

自适应，首先要识别屏幕设备及屏幕大小，然后根据具体情况自动调整布局

我们要用CSS中的Media Query（媒介查询）

自适应

如果是APP，就不需要一个软件适应那么多设备了，比如微博，一个电脑版一个手机版，手机下一个路上刷，电脑下一个家里刷，如果有iPad就更好，在哪儿刷都so方便。