你看到 Facebook 的这个垃圾了吗?
“为什么我需要一个 4Ghz 四核处理器才能运行 Facebook?” 这就是原因。一个单词被拆分为 11 个 HTML DOM 元素以避免广告拦截器。 pic.twitter.com/Zv4RfInrL0
— Mike Pan (@themikepan) 2019年2月6日
我访问了 Facebook 以进行验证,我看到的是一个更加混乱和嵌套的结构

他们试图对抗你的广告拦截器浏览器扩展。 当然他们会这么做。我相信,在他们这样的规模下,如果不这样做,就会损失数百万美元。但我很好奇,当你考虑到失去信任以及可能完全失去平台上的用户时,是否真的会“损失”金钱。
这感觉太粗鲁了,不是吗?就像用户专门在他们的电脑上安装技术,以便对他们允许进入他们的电脑和眼球的东西进行一些控制。而他们却说:“不,我们不尊重这种选择。我们将用我们的技术对抗你的技术,并将这些东西强加到你的电脑和眼球上。” 这让人无法接受。
我并非不知道广告拦截器对网站赚钱能力有不利影响。这确实是我赚钱的方式。但我不想在争斗中以及以破坏信任为代价地这样做。我想在建立信任的同时,优雅地做到这一点。
无论如何。
我想知道编写 HTML 来帮助广告拦截器会是什么样子
<!-- start: advertisement -->
<div class="ad sponsor paid" id="ad-1" data-ad="true">
<div>Sponsor:</div>
<a href="https://sponsor.com" rel="nofollow">Company</span>
</div>
<!-- end: advertisement -->
好的广告拦截器已经做了很多年了。
这种基于 span 的字母样式让我联想到像 Splitting.js 和 Lettering.js 这样的库,它们出于样式原因将文本分解成单独的 <span>
。
事实证明,这不会影响页面内搜索(例如,如果你搜索“dog”,你会找到 <span>d</span><span>o</span><span>g</span>
),但它确实会影响一些屏幕阅读器,因为它们会将每个字母都视为不同的元素,这会导致非常糟糕的音频输出,例如在字母之间出现你意想不到或不希望出现的停顿。
不过,这完全可以解决!
我刚刚在 Web Platform News 上阅读了关于 aria-label
的强大功能,引用了 Amelia Bellamy-Royds 的话
按钮或链接上的
aria-label
属性有效地将该元素的文本内容替换为新的标签。
很高兴看到 Lettering.js 默认情况下就是这么做的!而 Splitting.js 正在 寻找最佳方法,其中涉及 aria-label
。
我将等待 Facebook 的回应,这可能类似于
“我们很抱歉,我们犯了一个错误,我们辜负了你们的信任。我们承诺今后将尊重用户的隐私、数据和浏览器。”
…第 N 次了…
我很久以前就告别了 Facebook。Instagram 是下一个要被放弃的目标。
我开始觉得应该为新开发者开设伦理课程,以便他们能够学习关于如何以道德的方式对待用户电脑、浏览器和数据的道德规范。
仅仅因为你技术上可以做某件事,并不意味着你应该去做。
现在是时候永远停止使用 Facebook 了。所有泄漏事件。所有重复的借口。所有隐私泄露事件。从未有任何改变。这不仅非常糟糕,事实上它也是一种巨大的能源浪费。在这种情况下,不是 1 个元素而是 11 个。想象一个包含 15 个单词的广告,每个单词大约有 5-8 个字母,那么这将需要下载 75 到 120 个元素,而不是仅仅 15 个。当然你可能会想,啊,这只是一点 HTML,再想一想,在整个网络中,这是一种可怕的能源浪费。从未使用过 FB,将来也不会使用。停止使用这项服务有什么困难的?
有人可能会争辩说,用户或工具修改你的代码并降低你的生活水平(当你是一个小型内容提供者时)也是一种粗鲁的行为。
我想知道 Facebook 的做法是否存在潜在的法律问题。
“赞助”标签是法律要求,但如果依赖屏幕阅读器的用户无法阅读它,那么是否应该出于法律原因禁止拆分单词?
抱歉,Chris,我知道这是一个 Web 开发网站,而不是法律网站,但也许你对此有自己的看法?
有些人不想看广告是可以理解的,但你需要意识到社交媒体是通过广告赚钱的。否则,他们将无法继续运营业务并让你使用他们的服务。
归根结底,这些广告并没有变得过于夸张,以至于你必须屏蔽它们。
在我看来,使用他们的服务并屏蔽/指责他们合理的创收方式有点粗鲁和自私。
好吧。直到广告拦截器开始使用
aria-label
,这很快就会成为现实(如果还没有的话)。重点是……Facebook 并没有用它来处理这些乱七八糟的字母,对吧?
很多时候,我甚至忘记了自己正在运行广告拦截器,并且会在新闻页面上收到提醒,如果我能关闭它,我求之不得。我想大多数使用广告拦截器的人是因为他们不知道,或者有人安装了它(比如我爸爸的笔记本电脑),而其他用户则对突然弹出的广告感到沮丧,他们不得不搜索关闭按钮,或者更糟糕的是,关闭的 X 会在一段时间后才出现…
所以,我作为用户给网站托管者的建议
1. 让用户知道他们正在使用广告拦截器
2. 告诉他们为什么你的网站需要广告
3. 向他们展示如何将你的网站加入白名单
!! 最重要的是,不要使用弹出式广告或全屏广告。
这表明 Facebook 对用户隐私和从他们收集的数据中赚钱的态度。他们这样做非常糟糕,但我一点也不惊讶。在当今时代,广告拦截器是必需的。
我不明白为什么广告必须嵌入到内容中或在页面上跟踪你,试图让你点击。它所做的只是损害用户体验,使页面混乱,并让你想要离开并且不再回来。
我也从不点击广告。现在很难分辨它们是真实的还是存在安全风险。依靠广告收入来支持你的业务意味着你可能不得不求助于这些策略,我相信这一点。
“这感觉太粗鲁了,不是吗?”
对谁?肯定不是对普通用户。唯一会看到这段代码的人是试图编写广告拦截软件的人,他们实际上是在试图从像你这样的发布商的口袋里掏钱。去他们的。
“就像用户专门在他们的电脑上安装技术,以便对他们允许进入他们的电脑和眼球的东西进行一些控制。而他们却说:“不,我们不尊重这种选择。”
仅限于他们自己的网站。如果你不喜欢,就不要使用 Facebook。广告是他们支付账单的方式,没有广告就没有服务。
哦,我不得不说,我完全厌倦了看到 monday.com 和 Wufoo 的广告。我知道它们是什么,而且在我的生活中不需要它们,但我仍然不会考虑在 CSS tricks 上使用广告拦截器并剥夺你的收入来源。那将是非常粗鲁的。
拜托,不要使用 ::nth-letter
没有人能够就什么是“字母”达成一致。
现有的 :first-letter 已经在某些人的脑海中失效了,因为字母不是字母不是字母。
他们可能不知道
element.textContent
。:D我们生活在一个科技如此有趣的时代!Facebook 在数据隐私方面表现糟糕,并且对阻止广告拦截器采取侵入性措施,而 React 却如此受欢迎。我相信,仅凭这些做法就会导致 Vue 完全接管(如果还没有的话)。
“但我不知道,当你考虑到失去信任,以及可能完全失去平台上的用户时,它是否真的在亏损。”
观看广告的数百万人与即使了解问题并且在某些情况下仍然选择使用该平台的人数相比——这不可能。