美文网首页
渐进增强与优雅降级的理解及区别

渐进增强与优雅降级的理解及区别

作者: 逸笛 | 来源:发表于2021-09-13 16:25 被阅读0次

    渐进增强(Progressive Enhancement):

    一开始就针对低版本浏览器进行构建页面,完成基本的功能,然后再针对高级浏览器进行效果、交互、追加功能达到更好的体验。

    优雅降级(Graceful Degradation):

    一开始就构建站点的完整功能,然后针对浏览器测试和修复。比如一开始使用 CSS3 的特性构建了一个应用,然后逐步针对各大浏览器进行 hack 使其可以在低版本浏览器上正常浏览。

    两者区别?

    1、广义:

    其实要定义一个基准线,在此之上的增强叫做渐进增强,在此之下的兼容叫优雅降级

    2、狭义:

    渐进增强一般说的是使用CSS3技术,在不影响老浏览器的正常显示与使用情形下来增强体验,而优雅降级则是体现html标签的语义,以便在js/css的加载失败/被禁用时,也不影响用户的相应功能。

    eg:

    .transition { /*渐进增强写法*/
     -webkit-transition: all .5s;
        -moz-transition: all .5s;
          -o-transition: all .5s;
             transition: all .5s;
    }
    .transition { /*优雅降级写法*/
             transition: all .5s;
          -o-transition: all .5s;
        -moz-transition: all .5s;
     -webkit-transition: all .5s;
    }
    
    

    相关文章

      网友评论

          本文标题:渐进增强与优雅降级的理解及区别

          本文链接:https://www.haomeiwen.com/subject/naefgltx.html