针对不同电脑分辨率设计不同的样式_Web UI设计师需要了解的响应式UI界面设计...

“ 再做网页设计时候，关于适配，初级设计总是在纠结：“要做几套设计呢？做多大尺寸的设计呢？如何和前端小哥哥对接呢？”等等问题。”

当我们拿到网页设计需求时，首先要确定是不是要单独开发移动版本。因为响应式布局兼顾了手机端适配问题，但是受加载速度、手机浏览器、栅格化系统的限制设计发挥的自由度、等的影响很大。

   01   

UI设计——栅格化设计

栅格化设计：是针对网页设计师。主要是为了提高网页的规范性。

栅格设计系统：(网格设计系统，标准尺寸系统、程序版面设计)是一种屏幕设计的方法和风格，运动固定的格子设计版面布局，其风格工整、整洁。

栅格化布局：针对前端开发人员，指前端攻城狮使用的css框架，来实现页面的响应式布局。

设计师使用纵向的栅格(列)让页面元素垂直方向上对齐，使用横向的栅格(排)让元素水平方向上对齐。设计师结合基准网格(8pt)和纵向栅格(12栏 16pt)进行设计。

   02   

响应式ui设计前的准备

基于设备的逻辑像素进行UI设计——设计开始前UI设计师要根据桌面和平板手机分辨率大