在没有 JavaScript 的情况下优雅降级仍然有用吗?

     2023-03-15     209

关键词:

【中文标题】在没有 JavaScript 的情况下优雅降级仍然有用吗?【英文标题】:Is graceful degradation in the absence of JavaScript still useful? 【发布时间】:2010-11-19 00:36:40 【问题描述】:

即使移动浏览器也有 JavaScript,是否真的有必要考虑潜在的无脚本用户?

【问题讨论】:

【参考方案1】:

是的。您的网页不仅被人们消费:它们被搜索引擎、爬虫和屏幕抓取工具消费。大多数这些自动工具不支持 Javascript,而且基本上没有一个会生成 UI 事件或查看深度嵌套的 AJAX 数据。你想要一个简单的静态 HTML 后备,如果没有别的,那么你的网页可以被搜索引擎很好地索引。

忘记那些禁用 Javascript 的疯子吧;想想机器人!

【讨论】:

我假设我的绝大多数人类用户都启用了 JavaScript,我不会对第三方应用程序/机器人/蜘蛛做出相同的假设。我使用的大多数高级 JS 功能对标记的语义或页面内容没有影响。在我看来,让机器人/应用程序可以访问页面是与 JavaScript“优雅降级”完全不同的问题。现在更是如此,因为 W3C 已将使用 RDFa 作为官方推荐。 现在使用 NoScript 插件运行浏览器或禁用 Javascript 真的很疯狂吗?我仍然没有看到任何迹象表明 JavaScript 已经发展到可以处理其大部分原始漏洞。 在我今天尝试使用healthcare.gov 之后,我不得不说你的应用程序在没有Javascript 的情况下运行非常重要,我想也许我可以使用Lynx。 (好吧,你可以重新编译它......但仍然!)【参考方案2】:

是的。

人们可以(并且确实)在禁用 javascript 的情况下进行浏览。如果您的网站无需用户显式为您启用 javascript 也能正常运行,那么他们会很高兴。

当然,相关程度取决于您的目标受众。

【讨论】:

尤其是如果您的目标受众包括使用屏幕阅读器或其他无障碍设备的人。 @Adam Bellaire - 人们会这样做,但如果有选择的话,他们不应该这样做。 @karim79 - 你为什么要告诉我应该如何浏览?我不知道浏览器带有道德要求。 @David Thornley - 我没有告诉你(或任何人)你/他们应该如何浏览。我的观点是“...不要关闭 JS 并期望一切都一样漂亮”。如果我拿掉 3 个汽缸和动力转向系统,我不能指望我的车能表现得那么好——而且我不希望汽车公司在他们的设计中考虑到这一点。 问题在于,当 JS 关闭时,网站会完全中断。这就是将 Web UI 开发更多地视为“渐进式增强”的全部意义所在,您可以在启用 JS 的情况下改进功能的基线级别。太多的网站从一开始就假定 JS 支持,并将自己描绘成一个绝对 100% 需要的角落,以便任何功能都能正常工作。这是一个问题。【参考方案3】:

我认为你不应该为了适应非 JS 用户而大费周章,原因如下:

所有现代浏览器都支持 JS

这是浏览器使用情况的快照 今天:

http://www.w3schools.com/browsers/browsers_stats.asp

即使是最古老的通用浏览器 IE6, 支持基本的 JavaScript 和 AJAX。 如果您决定不集成 JS 的某些特性 b/c 依赖,这证明你是 基本上是为那些 从启用 JavaScript 开始,并且 明确选择禁用它。一世 认为这些人应该期待 一些功能,甚至可能 整个网站,而不是作为一个 后果。

很少有人愿意禁用 JS

根据我上面的观点,平均 网络用户不知道或不在乎 可以在浏览器中禁用 JS。 主要是精通技术的人群 知道怎么做(我自己 包括),作为精通技术的用户,我们应该知道何时 也将其重新打开。

支持成本

鉴于上述情况,请考虑 选择容纳拥有 主要是自愿禁用的 JS 来了 以非常实际的成本。如果你是 管理一个沉重的大型项目 UI要求,可以轻松烧录 大量的开发时间 适应什么是非常 小用户偏好。检查你的 预算。如果需要 2 个开发人员 每个项目加班 40 小时 为了完成这个壮举,你是 容易烧几千 美元本质上是 对绝大多数人来说不是问题 你的用户。用那个时间怎么样 和投资进一步加强 你的核心竞争力?

优先级

这点我很可能是错的,但是 我认为很难找到 主要媒体或社交网站 在某些情况下不要依赖 JavaScript 他们的部分功能 工作。如果依赖的主要企业 关于操作和可访问性 他们经营的网站不是 这样做,很有可能是 因为不需要。

注意事项:

了解您的市场。继续构建语义化的 XHTML/CSS(最好使用 RDFa W3C 推荐)。仍然努力让视障人士可以访问您的网站。不要相信你读到的一切。 ;)

免责声明:

我上面的论点很大程度上取决于您如何定义“优雅降级”。如果您的意思是所有链接仍然有效,那是一回事,但如果您的意思是所有链接仍然有效并且袋熊游戏也有效,那是另一回事。我并不是要争辩让您的网站如此依赖于 JS,以至于非 JS 用户无法访问它的任何部分。我试图证明某些功能的可接受性,甚至是一些核心功能,依赖于 JS。

【讨论】:

此外,许多公司出于安全原因禁用了 Javascript。因此,如果您强制使用 Javascript,即使是不懂技术的人也可能会与您的技术选择发生冲突。 我认为这是一个了解您的市场的问题。如果您的 Web 服务针对在具有严格 Internet 访问策略的大公司工作的人员,您可能更有动力“优雅地降级”。但是,如果您准备在这个问题上向男人屈服,也准备放弃嵌入式 Flash、论坛、聊天室等。我个人认为这不是一个大问题——为铁腕工作的用户公司要么找到其他访问方法,要么在下班后使用个人电脑。【参考方案4】:

它是相关的,即使在 10 到 20 年后可能到处都支持 javascript,它仍然是相关的。让事情在没有 javascript 的情况下工作是重要的开发技术,因为它迫使你保持简单和declarative。理想情况下,javascript 应该只用于增强体验,但您的网站不应该依赖它。

从维护的角度来看,将大部分代码采用声明性格式 (html+css) 并尽可能少地采用命令式 (javascript) 具有明显的优势。

【讨论】:

所以你让它保持声明性,你牺牲了功能?例如输入检查等?这似乎是一个重大损失。 您根本不需要(也不应该)牺牲良好的用户体验。如果你想进行客户端输入检查,你可以拥有它,但它应该只被视为现有功能性 html 标记的“插件”。【参考方案5】:

我的立场:

我使用 NoScript 浏览,所以如果我访问您的网站,它将无法使用 Javascript。我不期待完整的用户体验。

在打开 JS 之前,我想要确保你有足够的能力并且没有恶意,并且我确实想要你使用 JS 的目的。

这意味着,如果您真的希望我使用您的网站,您应该允许我使用链接环顾四周。 (如果我看到一个没有 Javascript 完全没用的网站,我通常认为设计者不称职。)您应该让我知道启用 Javascript 将获得什么样的功能,并且您应该以一种看似合法的方式展示该网站.

我认为这并不过分。

【讨论】:

【参考方案6】:

优雅的退化/渐进增强/不显眼的 javascript 是绝对相关的!

与所有可访问性问题一样:想象一下,在外面无法使用页面的人是什么感觉。

想象一下,您正在环游世界,您在某个酒店或网吧中,使用非常旧的计算机、旧软件、旧浏览器,您想查询您的航班,但由于一些 javascript,您发现无法查询您使用的旧浏览器不兼容。 (针对不同的场景尝试“旧手机”或“卡在公司防火墙后面”)

想象一下使用屏幕阅读器和网络为盲人打开了一个充满可能性的世界,想象一下因为 javascript 而这些可能性再次关闭是什么感觉。

如此吸引你更好的本性。

您可能也想这样做 让搜索引擎可以访问您的网站。

【讨论】:

【参考方案7】:

是的,这是相关的。移动浏览器今天使用确实都启用了Javascript。当然,它可以在新手机上使用。但是像我这样的数以百万计的人拥有运行旧版浏览器的手机,而对于我们所有人来说,需要 JS 的浏览体验完全被破坏了。

我什至不会去访问那些在编写代码时没有考虑渐进增强的网站。我在技术上并不落后于时代。我的手机用了一年。但由于网络体验不佳,我不会重新签订合同并购买新手机。

【讨论】:

我有一部 iPhone,并且有很多网站(包括堆栈溢出)都有烦人的 javascript 导致的怪癖,所以这不仅仅是旧手机的问题。【参考方案8】:

这取决于您的目标受众是谁。默认情况下,我关闭了 JavaScript,并在我知道网站的意图时将其打开。

【讨论】:

作为魔鬼的拥护者,我必须向您指出一个事实,即您可能不是普通用户,并且在 99% 的情况下不是目标受众。也就是说,我让我的网站不兼容 JS,因为我是理想主义者 ;)【参考方案9】:

在禁用 Javascript 的情况下浏览通常要快得多(digg.com 是没有 JS 的闪电),这就是它受欢迎的原因。

在 Opera 中这非常简单:您只需按 F12 并取消选中 javascript 选项。我总是在没有 Flash、Java(不是 javascript)、动画图像和声音的情况下浏览。我在每个站点(例如 YouTube)上启用 Flash。如果我的系统变慢了,有时我会暂时关闭 JS。

别忘了:

屏幕阅读器(我认为他们大多禁用了 JS) 文本浏览器或其他非常旧的系统 广告拦截器(如果您的文件名出现在他们的雷达之下) 任何完全不支持 JS 或 JS 中断的旧浏览器(例如 IE6 不支持某些现代 JS 内容)。

解决方案是使用渐进增强而不是优雅降级,即从基本的 HTML 开始并添加 CSS。然后将 Javascript 和/或 AJAX 添加到网站的某些部分。

例如,如果您有 Stack Overflow 之类的网站,则对答案进行投票可以正常提交表单。如果启用 JS,它将执行 AJAX 请求,更新投票计数并取消表单提交,而无需离开页面。 SO 并没有这样做……

【讨论】:

【参考方案10】:

我总是打开 NoScript,除非我出于多种原因信任该站点,包括跨站点脚本、点击劫持和 HTML 注入。不是我偏执,而是因为我认识很多开发人员,并且知道他们中的大多数人不知道什么是网络安全,更不用说如何避免漏洞。

因此,除非我信任一个网站,否则我不可能让它做任何花哨的事情。

对于不熟悉的人,有一些关于这个主题的有趣的博客文章:

Protecting Your Cookies: HttpOnly Cross-Site Request Forgeries and You Sins of Software Security Top 25 Most Dangerous Programming Mistakes

【讨论】:

【参考方案11】:

我将不得不在这里为对方辩护。人们设计没有 javascript 的网站的原因很大程度上是理想主义的。只要有足够的时间和金钱,目标是可以实现的,并且肯定会向尽可能多的人开放您的网站。但实际上这样做会减慢您的开发速度,增加您必须处理的测试用例的数量,并最终影响那些使用 javascript 的用户的应用程序质量。

在我看来,选择让您的网站只与支持 js 的浏览器兼容并告诉那些没有它的用​​户他们错过了它是完全合理的。这使您可以专注于创建大多数用户都可以查看的丰富内容。

当然,这条规则也有例外,但如果您希望为大多数用户创建一个好的网站,或者您的客户在时间或金钱有限的情况下追求华丽的网站,那么您可以决定是仅启用 js 的浏览器是合理的做法。

【讨论】:

【参考方案12】:

真正的问题不在于它是否相关,而在于是否使用优雅降级或渐进增强作为您的脚本策略。

【讨论】:

【参考方案13】:

当谈到 JS 的优雅降级时,我实际上处于一个有趣的位置。我正在开发一个机器人和爬虫完全没有业务研究的网络应用程序。没有什么他们可以看到应该被编入索引。

但是,Web 应用程序附带的信息站点应该被索引,因此 JS 在那里优雅地降级。

在 Web 应用程序中,如果您没有启用 JavaScript,那么您可能不应该在那里。它旨在提供丰富的互动体验。 Web 应用程序实际上需要启用 JS,并且您不必坐在公司防火墙后面。

我们没有提供任何恶意内容,只是我们对 Web 应用程序的意图和目的不同。我们的网络应用程序的目标和我们的信息网站的目标完全不同。

【讨论】:

【参考方案14】:

我使用 JavaScript。我总是让我的浏览器保持最新。但有时,我的互联网连接非常糟糕,以至于脚本无法加载。

也有以下情况:

某些脚本会加载,但其他脚本会失败,在这种情况下,网站的某些部分会停止运行 脚本正在加载,但我想点击“提交”而不是等待那个花哨的褶边菜单 脚本发生故障,因为它被部分加载,然后在该半阶段缓存 我太着急了,所以我决定使用 Lynx。

现在,我并不是说我的互联网一直都不好,甚至大部分时间都不好,但它确实会发生。随着互联网迅速扩展到世界各地的许多农村地区,我确信我不是唯一一个。因此,除了上面提到的 Nelson mentioned 机器人之外,还有一件事要记住。 (提示:检查您的人口统计数据)。

【讨论】:

【参考方案15】:

如果您不希望页面在 Javascript 关闭时工作,那么只需将其作为 html 中的消息,如果 javascript 已打开,通过使用不显眼的 javascript,您可以摆脱该消息并使其余部分可见应用程序。

根据您编写的内容,就javascript版本而言,如果用户使用的浏览器没有最新版本,您可能需要降级,因此优雅地处理也很重要。

【讨论】:

symfony2 中的 Ajax 表单提交,为没有 javascript 的用户提供优雅的降级

】symfony2中的Ajax表单提交,为没有javascript的用户提供优雅的降级【英文标题】:Ajaxformsubmissioninsymfony2withgracefuldegradationforuserswithoutjavascript【发布时间】:2011-12-0815:44:24【问题描述】:我正在构建一个涉及表单的Web应用程序。使... 查看详情

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

...一样的。您能否向我解释一下两者之间的区别以及在什么情况下我会使用其中一种而不是另一种?【问题讨 查看详情

Javascript Ajax 优雅降级,有不同的页面?

】JavascriptAjax优雅降级,有不同的页面?【英文标题】:JavascriptAjaxGraceful-degradation,withDifferentPages?【发布时间】:2010-12-0404:27:59【问题描述】:我开始更加关注如何让我的javascript和ajax优雅地降级。哪个更推荐:致力于将优雅降... 查看详情

渐进增强,优雅降级

css3之后出现了两个概念:渐进增强,优雅降级。 渐进增强:一开始构建基础的网站架构,逐渐增强交互功能,优雅降级:满足大部分功能,并向低版本浏览器做兼容 二者区别:优雅降级和渐进增强只是看待同种事物的... 查看详情

如何在没有 TypeScript 定义的情况下导入 npm 包以使 IDE 仍然提供智能感知?

】如何在没有TypeScript定义的情况下导入npm包以使IDE仍然提供智能感知?【英文标题】:HowtoimportnpmpackageswithoutTypeScriptdefinitionsuchthatIDEstillprovideintellisense?【发布时间】:2017-01-0115:33:59【问题描述】:我使用了一个没有TypeScript类型... 查看详情

在没有互联网的情况下使用 Javascript 获取 GPS 位置 [重复]

】在没有互联网的情况下使用Javascript获取GPS位置[重复]【英文标题】:GetGPSlocationusingJavascriptwithoutInternet[duplicate]【发布时间】:2013-06-2606:16:10【问题描述】:您好,如果设备有GPS硬件,我们可以在没有互联网连接的情况下使用Ja... 查看详情

图解css----渐进增强与优雅降级

...sp;    然后考虑使用高级的但非必要的css和javascript等增强功能  优雅降级:小考虑底端涉设备的用户能否看得到所有内容,然后在此基础上为高端用户进行设计,不仅高端设备用户提供一个完美的应用,也... 查看详情

在 JSX 中调用 javascript 函数:为啥在没有 () 的情况下调用函数?

】在JSX中调用javascript函数:为啥在没有()的情况下调用函数?【英文标题】:CallingajavascriptfunctioninJSX:whydoescallingafunctionwithoutthe()work?在JSX中调用javascript函数:为什么在没有()的情况下调用函数?【发布时间】:2018-06-2320:28:21【问... 查看详情

如何构建优雅降级 AJAX 网页?

...efulDegradation”构建网页。也就是说,网页功能甚至禁用了javascript。现在我必须对AJAX响应的格式做出设计决定。如果禁用了javascript,对服务器的每个HTTP请求都会生成HTML作为响应。浏览器使用返 查看详情

JavaScript:在没有画布的情况下获取 ImageData

】JavaScript:在没有画布的情况下获取ImageData【英文标题】:JavaScript:gettingImageDatawithoutcanvas【发布时间】:2012-06-0101:12:59【问题描述】:是否可以像普通的<img>一样从不在画布上而是在DOM树中的其他位置的图像中获取Ima... 查看详情

在没有 JavaScript 背景的情况下学习 TypeScript [关闭]

】在没有JavaScript背景的情况下学习TypeScript[关闭]【英文标题】:LearningTypeScriptwithnoJavaScriptBackground[closed]【发布时间】:2014-03-2917:18:12【问题描述】:我打算学TypeScript,我有足够的HTML5,CSS基础知识,我的问题是我几乎没用过也... 查看详情

优雅降级与渐进增强

优雅降级:观点认为应该针对那些最高级,最完善的浏览器来       设计网站,而将那些认为过时或有功能缺失的浏览器下      的测试工作安排在开发周期的最后阶段,并把测试对象      &... 查看详情

JavaScript 在没有任何库的情况下获取元素类

】JavaScript在没有任何库的情况下获取元素类【英文标题】:JavaScriptgettinganelementsclasswithoutanylibraries【发布时间】:2011-03-2802:19:43【问题描述】:我想使用JavaScript获取元素的class属性值。但是在这种特殊情况下,我没有像YUI、jQuer... 查看详情

Django:如何在没有''的情况下将数组传输到javascript?

】Django:如何在没有\\\'\\\'的情况下将数组传输到javascript?【英文标题】:Django:howtotransferarraytojavascriptwithoutu\'\'?Django:如何在没有\'\'的情况下将数组传输到javascript?【发布时间】:2012-01-0316:55:35【问题描述】:在视图中:\'som... 查看详情

在没有 Javascript 的情况下使用 Google Analytics?

】在没有Javascript的情况下使用GoogleAnalytics?【英文标题】:UsingGoogleAnalyticswithoutJavascript?【发布时间】:2013-02-2208:06:51【问题描述】:是否可以在不支持javascript或任何服务器端脚本的网站上使用GoogleAnalytics代码?(例如,网站... 查看详情

在没有 Javascript 的情况下使用 Google Analytics?

】在没有Javascript的情况下使用GoogleAnalytics?【英文标题】:UsingGoogleAnalyticswithoutJavascript?【发布时间】:2013-02-2208:06:51【问题描述】:是否可以在不支持javascript或任何服务器端脚本的网站上使用GoogleAnalytics代码?(例如,网站... 查看详情

如何在没有 flashvars 的情况下使用 JavaScript 自动填充弹性输入?

】如何在没有flashvars的情况下使用JavaScript自动填充弹性输入?【英文标题】:HowtoautofillflexinputbyusingJavaScriptwithoutflashvars?【发布时间】:2011-12-0913:03:27【问题描述】:我有flex应用程序(swf文件)。有谁知道如何在不使用flashVars... 查看详情

[JavaScript]有没有办法在没有终端的情况下使用 Cloudinary

】[JavaScript]有没有办法在没有终端的情况下使用Cloudinary【英文标题】:[JavaScript]IsthereawaytouseCloudinarywithoutterminal【发布时间】:2021-12-2809:21:18【问题描述】:我的开发环境(聊天机器人应用程序)不提供终端。(使用Rhino)但我... 查看详情