优雅降级(graceful degradation):一开始就构建站点的完整功能,然后针对浏览器测试和修复。
渐进增强(progressive enhancement):一开始只构建站点的最少特性,然后不断针对各浏览器追加功能。优雅降级:使用优雅降级方案,Web站点在所有新式浏览器中都能正常工作,如果用户使用的是老式浏览器,则代码会检查以确认它们是否能正常工作。由于IE独特的盒模型布局问题,绝大多数Web设计师和开发者都通过专门的样式表或针对不同版本的IE的hack实践过优雅降级了;
使用优雅降级技术时,你必须首先完整的实现了网站,其中包括所有的功能和效果。然后再为那些无法支持所有功能的浏览器增加候选方案,使之在旧式浏览器上以某种形式降级体验却不至于完全失效。
渐进增强:从被所有浏览器支持的基本功能开始,逐步地添加那些只有新式浏览器才支持的功能。渐进增强是值得所有开发者采用的做法。渐进增强方案并不假定所有用户都支持javascript,而总是提供一种候补方法,确保用户可以访问(主要的)内容。
使用渐进增强时,无需为了一个已成型的网站在旧式浏览器下正常工作而做逆向工程。首先,只需要为所有的设备和浏览器准备好清晰且语义化的HTML以及完善的内容,然后再以无侵入(unobtrusive)的方式向页面增加无害于基础浏览器的额外样式和功能。当浏览器升级时,它们会自动地呈现出来并发挥作用。
想让网站在任何环境下看起来都保持一致是不可能的,不管为此付出多少努力,结局依旧会令你失望。与其试图让IE看起来堪比年轻它十岁的浏览器,不如努力改善网站的可访问性,或是进行更多的可用性测试,而不仅仅是让页面看起来更靓一点。
某些CSS3特性在不支持它的浏览器中简直是无法模拟实现的,但若使用渐进增强,就无需为了能让你的网站适合所有人而放弃这些技术。仅仅因为部分人不愿或不能升级浏览器,却让使用新型浏览器的用户无法享受CSS3所提供的伟大技术,这是毫无道理可言的。
我们应该先让网站能够正常工作于尽可能旧的浏览器上,然后不断为它在新型浏览器上实现更多的增强和改进。随着时间的推移,当越来越多的人开始升级浏览器而浏览器本身的支持度也不断提升时,就会有越来越多的人体验到这些增强和改进,它持续有效的使网站越来越好,却如需你刻意做什么。

转载于:https://www.cnblogs.com/zyfdeboke/p/4967633.html

客户端考试之渐进增强与优雅降级相关推荐

  1. 浏览器兼容CSS渐进增强 VS 优雅降级如何选择

    由于低级浏览器不支持 CSS3,但是 CSS3 特效太优秀不忍放弃,所以在高级浏览器中使用CSS3,而在低级浏览器只保证最基本的功能.二者的目的都是关注不同浏览器下的不同体验,但是它们侧重点不同,所以 ...

  2. 杂谈:渐进增强与优雅降级

    作为一名前端开发人员,最头疼的莫过于浏览器兼容.远古时期万恶的IE6,到现在CSS3不兼容的IE7/8.为了保证不同版本浏览器都有共同或更优化的用户体验,前端搬砖的我们不得不与浏览器兼容顽强斗争.而渐 ...

  3. 自定义字体样式引入使用方法、文本阴影、边框阴影、(边框)圆角、渐变、理解重绘与回流、渐进增强和优雅降级的区别

    目录 1.文本阴影 text-shadow 2.边框阴影 box-shadow 3.自定义字体样式方法 引入与使用方法举例: 4.(边框)圆角 5.渐变 6.过渡  transition 7.理论知识 ...

  4. 渐进增强和优雅降级之间的区别?

    一省:HTML 16. 渐进增强和优雅降级之间的区别? 1. 渐进增强: 一开始就针对低版本浏览器进行构建页面,完成基本的功能,然后再针对高级浏览器进行效果.交互.追加功能达到更好的体验. 2. 优雅 ...

  5. 渐进增强和优雅降级有什么区别

    渐进增强: 针对低版本的浏览器进行构建页面,保证最基本的功能,然后再针对高级浏览器进行效果.交互等改进和追加功能达到更好的用户体验 优雅降级:一开始就构建完整的功能,然后再针对低版本的浏览器进行兼容 ...

  6. CSS 渐进增强与优雅降级

    你可能听过优雅降级(graceful degradation)和渐进增强(progressive enhancement)这两个词,它们是构建Web应用时,处理多浏览器支持的两种方法论,并在Web社区 ...

  7. 前端学习(239):渐进增强和优雅降级

  8. 2021/1/3-每日三题第10弹:雨停了天晴了,你又觉得你行了?你知道渐进增强和优雅降级之间有什么不同吗???

    前言: "朋友们好啊,我是xxxxxx掌门人xx,今天有朋友给我发来几张截图,我一看,嗷,原来是元旦假期要结束了,我大意了啊,没有闪,~~~,我劝,这位朋友,耗子尾汁,好好反思,武林要讲武德 ...

  9. 好程序员web前端学习路线分享css3中的渐进增强和降级

    好程序员web前端学习路线分享css3中的渐进增强和降级,渐进增强和降级这两个概念是在 CSS3 出现之后火起来的.由于低级浏览器不支持 CSS3,但是 CSS3 特效太优秀不忍放弃,所以在高级浏览器 ...

  10. 《图解CSS3:核心技术与案例实战》——1.3节渐进增强

    本节书摘来自华章社区<图解CSS3:核心技术与案例实战>一书中的第1章,第1.3节渐进增强,作者 大漠,更多章节内容可以访问云栖社区"华章社区"公众号查看 1.3 渐进 ...

最新文章

  1. Wireshark筛选常用命令
  2. php和js序列化,PHP中serialize和json序列化与反序列化的区别
  3. 文本分类--普通分类
  4. ubuntu mysql 初始化_Ubuntu初始化MySQL碰到的坑
  5. 《嵌入式C编程:PIC单片机和C编程技术与应用》一第1章C语言概述和程序结构1.1 C源代码...
  6. New-Python-数据类型、字符编码、文件处理
  7. 【推荐实践】阿里飞猪“猜你喜欢”推荐排序实践
  8. 9个月宝宝还不会爬怎么办?
  9. 【C/C++】一个实例看 回调函数 / 函数指针 应用与原理
  10. vm14远程连接服务器,VisualVM 远程连接服务器
  11. 2012年3月份第1周51Aspx源码发布详情
  12. C语言里的符号重载《C专家编程》
  13. 无损数据压缩算法的历史
  14. 服务器工作站显示器,HP Z25n超窄边框显示器【深度测评】
  15. Codeforces 1010D Mars rover
  16. 倾囊相授:小编是如何从阿里云转战达摩院并成功上岸de?
  17. 不重视需求过程的项目队伍将自食其果
  18. Java网络编程socket基础学习
  19. ERROR: Failed to parse XML in E:\LWJ\AndroidStudioProjects\MyApplication6\app\src\main\AndroidManife
  20. 昨天,我的大学学习[5]--转载自:www.cstc.net.cn

热门文章

  1. 如何更换 Mac 登录画面的背景桌面?
  2. 如何更改 macOS Monterey 和 iPadOS 15 中的 Safari 选项卡外观?
  3. 如何在 Mac 上重命名 Apple Magic Mouse?
  4. Scherlokk for Mac(文件搜索软件)
  5. 势差、高度、结构、做工、逆熵
  6. ASP.NET:返回按钮的解决方案摸索
  7. linux命令大全之ss命令详解(获取socket统计信息)
  8. JavaScript常见封装方法
  9. 创建控制文件副本出现错误ORA-00205: error in identifying control file
  10. MSP430F149学习之路——比较器Comparaor_A