第143天:渐进增强和优雅降级之间的不同

渐进增强和优雅降级之间的不同

1、渐进增强

.transition{
  -webkit-transition: all .5s;
     -moz-transition: all .5s;
       -o-transition: all .5s;
          transition: all .5s;  
}

2、优雅降级

.transition{ 
       transition: all .5s;
    -o-transition: all .5s;
   -moz-transition: all .5s;
 -webkit-transition: all .5s;
}

第一个例子的写法叫做渐进增强(progressive enhancement),第二个例子的写法叫做优雅降级(graceful degradation)。(关于渐进增强,可以参考张鑫旭的文章: http://www.zhangxinxu.com/wordpress/?p=788

3、什么是渐进增强(progressive enhancement)、优雅降级(graceful degradation)呢?

  渐进增强(progressive enhancement):针对低版本浏览器进行构建页面,保证最基本的功能,然后再针对高级浏览器进行效果、交互等改进和追加功能达到更好的用户体验。(从被所有浏览器支持的基本功能开始,逐步地添加那些只有新式浏览器才支持的功能,向页面添加无害于基础浏览器的额外样式和功能。当浏览器支持时,它们会自动地呈现出来并发挥作用。)

  优雅降级(graceful degradation):一开始就构建完整的功能,然后再针对低版本浏览器进行兼容。(Web站点在所有新式浏览器中都能正常工作,如果用户使用的是老式浏览器,则代码会检查以确认它们是否能正常工作。由于IE独特的盒模型布局问题,针对不同版本的IE的hack实践过优雅降级了,为那些无法支持功能的浏览器增加候选方案,使之在旧式浏览器上以某种形式降级体验却不至于完全失效。)

  区别优雅降级是从复杂的现状开始,并试图减少用户体验的供给,而渐进增强则是从一个非常基础的、能够起作用的版本开始,并不断扩充,以适应未来环境的需要

4、渐进增强观点:

 渐进增强观点认为应该关注于内容本身。内容是我们建立网站的诱因,有的网站展示它,有的则收集它,有的寻求、有的操作,还有的网站甚至包含以上的种种,但相同点是他们全都涉及到内容,这使得“渐进增强”成为一种更为合理的设计范例。这也是它立即被Yahoo!所采纳并用以构建其“分级式浏览器支持(Graded Browser Support)“策略的原因所在。

5、优雅降级观点:

优雅降级观点认为应该针对那些最高级、最完善的浏览器来设计网站。而将那些被认为“过时”或有功能缺失的浏览器下的测试工作安排在开发周期的最后阶段,并把测试对象限定为主流浏览器(如IE、Mozilla等)的前一个版本。

在这种设计范例下,旧版的浏览器被认为仅能提供“简陋却无妨(poor,but passable)”的浏览体验。你可以做一些小的调整来适应某个特定的浏览器。但由于它们并非我们所关注的焦点,因此除了修复较大的错误之外,其它的差异将被直接忽略。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏沃趣科技

容器化 RDS:借助火焰图定位Kubernetes性能问题

借助 CSI(Container Storage Interface),加上对 Kubenetes 核心代码的少量修改,可以 out-tree 的方式高效且低耦...

15520
来自专栏杨建荣的学习笔记

一种能够快速进阶的学习方式

晚上下地铁的时候,突然想到一个需求,是关于防火墙的,看似简单的防火墙需求,我已经翻来覆去想了好多的招了。

10910
来自专栏web前端教室

第七节,生成商品类型、广告条--《vue+vant+node+mongoDB+koa2》电商项目实战连载

视频有些模糊,这个目前我也没有办法,因为我没有微信公众号的视频的高级权限,所以这里只能是先搞成这样。清晰视频的获取办法,在文章结尾有写到,同学们可以自行获取。

22630
来自专栏软件测试经验与教训

接口分类

38680
来自专栏散尽浮华

Linux系统下CPU使用(load average)梳理

在平时的运维工作中,当一台服务器的性能出现问题时,通常会去看当前的CPU使用情况,尤其是看下CPU的负载情况(load average)。对一般的系统来说,根据...

1.2K60
来自专栏PPV课数据科学社区

点进来,这里告诉你:爬虫学习之一个简单的网络爬虫

###概述 这是一个网络爬虫学习的技术分享,主要通过一些实际的案例对爬虫的原理进行分析,达到对爬虫有个基本的认识,并且能够根据自己的需要爬到想要的数据。有了数据...

497140
来自专栏高性能服务器开发

9 百万用户级游戏服务器架构设计

所谓服务器结构,也就是如何将服务器各部分合理地安排,以实现最初的功能需求。所以,结构本无所谓正确与错误;当然,优秀的结构更有助于系统的搭建,对系统的可扩展性及可...

1.2K50
来自专栏恰童鞋骚年

谈谈对于企业级系统架构的理解—李平

原文地址:http://www.cnblogs.com/liping13599168/archive/2011/05/11/2043127.html

13140
来自专栏后端技术探索

Facebook 宣布开源 Katran,高性能第4层负载平衡器

为了管理Facebook的流量,他们部署了一个分布式PoP服务器作为数据中心的代理。鉴于极高的请求量,PoP和数据中心都面临着巨大挑战,比如如何将大量的后端服务...

18420
来自专栏ImportSource

NoSQL Peer-to-Peer Replication 对等复制

翻译内容: NoSQL Distilled 第四章 Distribution Models 作者简介: ? 本节摘要: 今天我们主要讨论有关...

43260

扫码关注云+社区

领取腾讯云代金券