如何设计响应式后台

按照本人自己的理解，响应式就是通过合理的设计方案配合规范的技术实现策略，使同一个 Web页面在各个终端（设备）不同分辨率屏幕上都能有最佳的用户体验

响应就是系统对于外部变化的反馈跟适应，响应式就是系统做出这种反馈所依据的方案与策略。对于一个 Web页面，外部的变化是指媒介（Media）与视窗（Viewport）的变化，媒介指 Web页面运行在哪些设备的屏幕上手机、平板、PC、Mac等

视窗指浏览器用来显示网页内容的窗口，也就是浏览器去掉标签栏、地址栏、工具栏之后显示内容的窗口大小。所以对于一个 Web页面而言，响应式响应的就是媒介与视窗的变化，响应的结果在视觉上表现为页面在不同媒介、不同视窗下会有不同的布局结构、版式设计以及不同数量信息的展示

这里说是用户体验而不是视觉效果是因为用户体验包含了性能、交互、效率等多方面内容，也就是说，对于一个线上的响应式页面，我们不仅要关注视觉上看到的，也要关注我们操作、使用时的感受，这些综合因素最终影响着用户使用后台系统时的效率与体验。而这里我提到的「合理的设计方案」就是本篇文章跟大家分享的重点

提高屏幕利用率最简单的理解就是在大屏幕上显示更多内容，在小屏幕上通过数据筛选展示关键信息。一直以来大家普遍认为移动端碎片化严重，但实际上桌面端设备的分辨率也是有着不太均匀的分布，而随着新设备的更新，更多高分辨率屏幕不断加入，这种碎片化的趋势会更加明显，因而要想利用好每一块屏幕，让不同分辨率的用户都有好的体验，显然传统固定的布局是做不到了