当前位置:首页 > 开发 > Web前端 > 前端 > 正文

渐进增强和优雅降级

发表于: 2014-08-28   作者:AILIKES   来源:转载   浏览次数:
摘要: 优雅降级(graceful degradation):一开始就构建站点的完整功能,然后针对浏览器测试和修复。 渐进增强(progressive enhancement):一开始只构建站点的最少特性,然后不断针对各浏览器追加功能。   优雅降级: 使用优雅降级方案,Web站点在所有新式浏览器中都能正常工作,如果用户使用的是老式浏览器,则代码会检查以确认它们是否能正常工作。由于IE独特

优雅降级(graceful degradation):一开始就构建站点的完整功能,然后针对浏览器测试和修复。

渐进增强(progressive enhancement):一开始只构建站点的最少特性,然后不断针对各浏览器追加功能。

 

优雅降级:

使用优雅降级方案,Web站点在所有新式浏览器中都能正常工作,如果用户使用的是老式浏览器,则代码会检查以确认它们是否能正常工作。由于IE独特的盒模型布局问题,绝大多数Web设计师和开发者都通过专门的样式表或针对不同版本的IE的hack实践过优雅降级了;
使用优雅降级技术时,你必须首先完整的实现了网站,其中包括所有的功能和效果。然后再为那些无法支持所有功能的浏览器增加候选方案,使之在旧式浏览器上以某种形式降级体验却不至于完全失效。

渐进增强:

从被所有浏览器支持的基本功能开始,逐步地添加那些只有新式浏览器才支持的功能。渐进增强是值得所有开发者采用的做法。渐进增强方案并不假定所有用户都支持javascript,而总是提供一种候补方法,确保用户可以访问(主要的)内容。
使用渐进增强时,无需为了一个已成型的网站在旧式浏览器下正常工作而做逆向工程。首先,只需要为所有的设备和浏览器准备好清晰且语义化的HTML以及完善的内容,然后再以无侵入(unobtrusive)的方式向页面增加无害于基础浏览器的额外样式和功能。当浏览器升级时,它们会自动地呈现出来并发挥作用。

想让网站在任何环境下看起来都保持一致是不可能的,不管为此付出多少努力,结局依旧会令你失望。与其试图让IE看起来堪比年轻它十岁的浏览器,不如努力改善网站的可访问性,或是进行更多的可用性测试,而不仅仅是让页面看起来“更靓一点”。
某些CSS3特性在不支持它的浏览器中简直是“无法模拟实现”的,但若使用渐进增强,就无需为了能让你的网站适合所有人而放弃这些技术。仅仅因为部分人不愿或不能升级浏览器,却让使用新型浏览器的用户无法享受CSS3所提供的伟大技术,这是毫无道理可言的。

我们应该先让网站能够正常工作于尽可能旧的浏览器上,然后不断为它在新型浏览器上实现更多的增强和改进。随着时间的推移,当越来越多的人开始升级浏览器而浏览器本身的支持度也不断提升时,就会有越来越多的人体验到这些增强和改进,它持续有效的使网站越来越好,却如需你刻意做什么。只需要一次实现,它就让网站的体验与时俱进。

渐进增强和优雅降级

  • 0

    开心

    开心

  • 0

    板砖

    板砖

  • 0

    感动

    感动

  • 0

    有用

    有用

  • 0

    疑问

    疑问

  • 0

    难过

    难过

  • 0

    无聊

    无聊

  • 0

    震惊

    震惊

编辑推荐
如今一个网页展现的内容是越来越丰富,其中不乏一些HTML5、CSS3的功能特效。那么如果客户端的浏览器
作者: 阮一峰 文件上传是最古老的互联网操作之一。 20多年了,它几乎没变,还是原来的样子:操作麻
来看一个经典的三栏布局: 从内容出发(渐进增强的核心思想),一份合理的HTML结构如下: <div i
来看一个经典的三栏布局: 从内容出发(渐进增强的核心思想),一份合理的HTML结构如下: <div i
文件上传的渐进式增强 作者: 阮一峰 日期: 2012年8月10日 文件上传是最古老的互联网操作之一。 20
原文地址:http://nicolasgallagher.com/progressive-enhancement-pure-css-speech-bubbles/ 作者:
文件上传是最古老的互联网操作之一。 20多年了,它几乎没变,还是原来的样子:操作麻烦、缺乏交互、
来看一个经典的三栏布局: 从内容出发(渐进增强 的核心思想),一份合理的HTML结构如下: <div
转: http://meditic.com/degrading-for-success/ 降级论 几乎一年没有写博客了,说没时间那是借口
几乎一年没有写博客了,说没时间那是借口,唯一的原因是,年纪越大越发觉自己肤浅。有些想法还没提
版权所有 IT知识库 CopyRight © 2009-2015 IT知识库 IT610.com , All Rights Reserved. 京ICP备09083238号