响应式布局和移动端布局

响应式布局就是响应式设计方案呈现的效果。具体就是页面的布局会根据不一样设备的显示面积(主要是宽度)的不一样而呈现不一样的布局,这个效果是比弹性的布局更好的地方是样式会主动地根据用户的设备的显示面积呈现的布局更灵活,可读性更强。固然对研发的要求也更高(好比说如何更好地让图片,适配,UI动画自适应各类布局)。响应式设计通常来讲是一套设计方案解决全部的设备的自适应问题。对应的样式文件多是多个,也能够只写一个(在一个css文件声明不一样的media query就能够)。

移动端布局就是传统的固定宽度或者弹性布局的设计方案呈现的效果。通常来讲,这个布局设计开发都比较简单,同时设计的效果能够更精细,细节更丰富。不过很差的地方就是若是要适应不少不一样的设备,就须要设计多套设计方案,或者让比较小屏的方案去适应多个大屏,适应的效果上可能不是特别好。

响应式设计方案的通常的作法就是根据目标用户的访问设备的主要类型作三种或四种布局。每种布局有一个区间,好比说小屏的手机分分辨率能够设定为[320,640]。而后分别设计每种布局便可,通常来讲,各个布局主要是调整模块的排列布局顺序,内容调整越少越好(尽可能减小用户适应成本)。css

不一样之处:布局

一、适配的群体不一样,响应式适配各类终端,而移端大部分为智能手机为主
二、响应式布局能根据不一样的终端设备实现不一样的页面布局,而移动端布局大部分是单列布局
三、响应式布局有可能形成冗余的代码较多(传统式响应式布局,仅依赖于媒体查询,控制不一样的页面布局),移动端布局冗余代码较少,对针对性较强。动画

相同之处:

一、在智能手机上,响应式看到的页面效果能和移动端的同样效果
二、二者都要面对适配的问题设计

相关文章
相关标签/搜索