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

时间:2010-03-31 04:05:39

标签: javascript progressive-enhancement graceful-degradation

我对渐进增强优雅降级之间的区别感到困惑。他们看起来像是一样的东西。

你能否向我解释两者之间的差异以及我将使用哪一种情况?

8 个答案:

答案 0 :(得分:84)

它们几乎完全相同,但它们的背景不同。

有一类浏览器称为“A级浏览器”。这些是典型的受众成员(可能)构成了大部分访问者。您将从这些用户的基线开始。称之为最佳现代实践

如果您希望增强使用FF3.6或Safari 4或其他一些开发者夜间webkit的任何人的体验,那么您需要做一些很棒的事情,比如

  • 通过css的圆角
  • 阴影文本(但请上帝,不要太多)
  • 阴影(参见上面的括号内容)

这些会让你的网站看起来很好看,但不会破坏它。这是渐进增强。从最佳实践开始迎接未来。

另一方面,你的利基任天堂网站吸引了相当数量的IE5用户。你很差,但你也想确保他们继续回来。您可以通过在外部文件中包含ajax脚本来提供ajax行为的替代方法,如果他们的JS没有打开,那么您的链接可能会更新整个页面。等等。从最佳现代实践的角度来看,您确保某些历史市场正在被一些功能性网站的外观所照顾。这是优雅降级

它们大多相同,但在许多开发团队的优先级方面有所不同:如果你有时间,PE非常好,但GD通常必要

答案 1 :(得分:32)

如果您的网站在所有浏览器上看起来同样出色,但某些浏览器会因为它们支持跳舞小马而跳舞小马,那就是渐进式增强功能。它适用于所有浏览器,但某些浏览器可以获得额外的功能。通常该术语适用于某些Javascript功能,这些功能可能会增强“原始HTML”之外的可用性。

如果您的网站只是在您完全支持的浏览器上看起来像CSS3那样,并且IE8-将显示相同的页面,而不是圆角,那就是优雅的降级。该网站真正适用于最先进的浏览器,但它仍然可以在旧版浏览器中使用,只是不那么花哨。

最后,从两个不同的角度来看,它们真的是一样的。

答案 2 :(得分:23)

每个概念的选择基线的方向是不同的。

优雅降级从理想的用户体验级别开始,并根据用户代理功能降低到最低级别,适用于不支持基线使用的某些功能的代理。

渐进式增强功能始于最广泛的最低用户体验,并且根据用户代理功能的增加而提升至更高级别,适用于支持比基线更高级功能的代理。

我认为如果时间/预算允许,可以使用这两个概念。如果没有,则优先降级。

答案 3 :(得分:10)

很抱歉复活了一年多的事情,但我觉得我可以用一些小的方式贡献自己对此事的看法。

虽然我在某种程度上同意Alex Mcp和deceze,但“优雅降级”和“渐进增强”这两个术语的含义与我的立场略有不同。

优雅退化,很多时候(在我看来),在我的体验中首先构建严重的应用程序后,似乎更像是一个坚持击败应用程序的坚持。就像有人建立了一些巨大的javascript对象,为用户提供了一些非常酷的东西,直到经理出现,测试这个东西,每个人都尖叫着,当他们注意到他们的应用不起作用时,他们会搂着他们在35%的浏览器中。 “有人最好为此提供后备支持。”

渐进式增强虽然(而且这个也是一个更好的术语)在我看来更多的是通过最基本的方法在入门级,无处不在地构建一些正常工作的东西可用,提供用户需要的所有功能。然后可以添加整齐的小的不显眼的助手,样式等,这实际上增强了所讨论的应用程序的用户体验,而不仅仅是使其几乎不可用。 “看起来很酷。它在IE6中是否有效。哦是的。它确实存在”

我认为也许将风格作为前两个答案中两个术语的一个例子,这类忽略了渐进增强经常通过其本质解决的真正的潜在可用性问题,其中优雅退化忽略,直到出现问题。

Rant over ...

答案 4 :(得分:8)

优雅降级是构建您的网络功能的做法,以便它在更现代的浏览器中提供一定程度的用户体验,但它也会在较旧的浏览器中优雅地降低到较低级别的用户体验。这个较低级别不适合您的网站访问者使用,但它仍然为他们提供了他们来到您的网站使用的基本功能;事情不会为他们打破。

渐进增强是类似的,但它反过来做事情。首先,建立所有浏览器在呈现网站时能够提供的基本用户体验级别,但您还可以构建更高级的功能,这些功能将自动提供给可以使用它的浏览器。

换句话说,优雅的降级从复杂性的现状开始,并试图修复较少的体验,而渐进式增强从一个非常基本的工作示例开始,并允许对未来环境的不断扩展。优雅地退化意味着回头看,而逐步提升意味着向前看,同时保持脚踏实地。

答案 5 :(得分:7)

优雅降级

  

优雅退化是计算机,机器,电子的能力   系统或网络即使在很大的时候也能保持有限的功能   其中一部分已被破坏或无效。目的   优雅退化是为了防止灾难性的失败。

优雅降解是一种解决方案。这是构建网站或应用程序的做法,因此它在现代浏览器中提供了良好的用户体验。但是,对于那些使用旧浏览器的人来说,它会优雅地降级。系统可能不那么令人愉快或漂亮,但基本功能将适用于旧系统。

一个简单的例子是使用24位alpha透明PNG。这些图像可以毫无问题地在现代浏览器上显示。 IE5.5和IE6会显示图像,但透明效果会失败(必要时可以使其工作)。不支持PNG的较旧浏览器会显示替代文字或空格。

采用优雅降级的开发人员通常会指定其浏览器支持级别,例如: 1级浏览器(最佳体验)和2级浏览器(降级体验)。

渐进式增强

  

渐进增强是强调网页设计的策略   可访问性,语义HTML标记和外部样式表和   脚本技术。渐进增强使用Web技术   以分层的方式,允许每个人访问基本内容   和网页的功能,使用任何浏览器或Internet   连接,同时还提供页面的增强版本   那些拥有更高级浏览器软件或更高带宽的人。

渐进式增强与优雅降级的概念类似,但相反。该网站或应用程序将为大多数浏览器建立基本级别的用户体验。当浏览器支持它时,将添加更高级的功能。

渐进增强功能不需要我们选择支持的浏览器或恢复到基于表格的布局。我们选择一种技术水平;即浏览器必须支持HTML 4.01和标准页面请求/响应。

回到我们的图片示例,我们可能会决定我们的应用程序应该在所有图形浏览器中都能正常运行。我们可以默认使用质量较低的GIF图像,但在浏览器支持时将它们替换为24位PNG。


链接

维基百科:Progressive EnhancementGraceful Degradation(Fault_tolerance)

  

来源:Sitepoint Blog

答案 6 :(得分:0)

我发现它往往是态度 - 你说“好吧,我的网站与Lynx合作,用户可以做我希望他们能够做的一切,现在让我们添加一些夸张”,或者你说“好吧,我的网站在Firefox中运行,现在让我们尝试为不愿意使用/关闭javascript /等的人修复它“

答案 7 :(得分:-1)

为了更容易,只需将栏设置在顶部,然后您就可以忽略渐进增强。当一个新功能出现时,提高你的标准;)

或者将您的栏设置为最低级别(也许是lynx?)并且只使用渐进式增强。