深圳网站设计公司|域名注册|云服务器|商标注册

官方微信 400-8855-150

深圳网站建设

自适应和响应式的介绍和区别

文章编辑:俊网网络 发表日期:2018-07-05 浏览次数:413

前言


“自适应设计和响应式设计的区别”是个老生常谈的问题,在这里将更加直白的来介绍它们之间的不同之处。

视口


先来了解一个概念(下文中经常出现):
视口:用户浏览信息屏幕尺寸大小(每一个视口后面都是真实一位的用户)

概念:


响应式设计(Responsive design):

[百科]:响应式设计是Ethan Marcotte在2010年5月份提出的一个概念,简而言之,就是一个网站能够兼容多个终端—而不是为每个终端做一个特定的版本。这个概念是为解决移动互联网浏览而诞生的。

自适应设计(Adaptive Design)

[百科]:自适应设计指能使网页自适应显示在不同大小终端设备上新网页设计方式及技术。
image

不同点


Adaptive design (自适应设计实现原理):是为不同类别的设备建立不同的网页,检测到设备分辨率大小后调用相应的网页。在app横行的当下,目前国内自适应布局应用主要集中在视口已经很稳定的web端,(web端视口大数据[2016])针对笔记本,台式机进行优化体验。

响应式设计(Responsive design)是一套界面同时运行到pc端、平板、手机端各个不同的视口。通过检测设备的分辨率,来对页面做出不同的布局和内容。

共同点


两者都是优化适应互联网中越来越分化的视口浏览体验,而出现的为视口提供更好的体验的技术。用技术来使页面适应不同分辨率的视口的设计。

响应式优缺点和标志


标志
优点:
缺点:

自适应网站优缺点和标志


标志
优点
缺点:

服务于设计和 开发


理论上来说,响应式布局在任何情况下都比自适应布局好一些,但在某些情况下自适应布局更切实际。

自适应布局可以让你的设计更加可控,因为你只需要考虑几种状态就万事大吉了。

但在响应式布局中你可能需要面对非常多状态——是的,大部分状态之间的区别很小,但它们又的确是不同的,这样一来就很难确切搞清你的设计会是什么样。

同时这也带来了测试上的难题,你很难有绝对的把握预测到它会怎样。

换个角度说,这也是响应式布局的魅力所在。相比较来说自适应布局有它自己的优势,因为它们实施起来代价更低,测试更容易,这往往让他们成为更切实际的解决方案。

上一篇: 没有独立站何谈亚马逊引流?

下一篇: 没有了!

返回列表

扫描二维码关注官方微信公众号
立享网站建设8折优惠

确定

业务咨询:

18126161217(7X24)

技术咨询:

13528466027

客服邮箱:

jeff.chan@jungo.com.cn

确定
客服
嘿,我来帮您!

TEL:400-8855-150

QQ在线咨询

381226572

微信扫描二维码咨询