SEO和辅助功能重叠的9种方式
SEO专家在SEO和可访问性之间的重叠中扮演着至关重要的角色。这是我们如何通过我们的工作对可访问性产生积极影响的方法。确保每个人都可以访问和使用网站应该是在在线空间内工作的任何人的首要考虑。
虽然可访问性通常被视为开发人员和设计人员的责任,但我们在SEO工作中存在很多重叠之处,以使网站易于访问并易于搜索引擎理解。但是,这不是SEO中经常谈论的话题,通常也不是SEO的“需要了解”中包含的话题。
什么是Web可访问性?
简而言之,网站可访问性是确保每个人都可以访问和使用网站的行为。
它确保所有用户都能感知,理解,浏览网站并与之交互,并且涵盖了可能影响用户体验您网站的所有障碍。这包括听觉,认知,身体,神经和视觉。
辅助功能还使有暂时性障碍的用户受益,其中包括:手臂骨折的用户或手术中康复的人。它还包括:
- 情境障碍,例如:在行驶的火车上的人。互联网连接受限的人。
- 环境损害,例如:在明亮的房间里。无法大声播放音频。
为什么可访问性很重要?
确保我们工作的网站对每个人都可用,这对于SEO中的每个人以及我们与之合作的设计师和开发人员来说,应该是首要考虑的问题。
可访问的网站可帮助所有用户:
- 轻松浏览站点。
- 改善他们的经验。
- 查找他们正在寻找的信息。
随着冠状病毒大流行导致网络的使用进一步增加,对可访问网站的需求从未像现在这样大。
Deque的一份报告发现,在2020年3月和4月接受调查的可访问性从业人员中,有62%表示“ COVID-19提高了可访问性对数字渠道的认识和影响。”
可访问性对于用户体验,满意度和忠诚度也很重要。无法访问的网站也有法律影响。
用户体验
重要的是要超越排名,而是要确保每个人都可以使用该网站。反过来,这将导致用户满意度提高,并增强品牌情感和忠诚度。
当无法访问网站时,某些用户很难执行必要的任务或找到他们想要的信息。这是一篇关于不可访问的Web元素的非常有力的文章,它是屏幕阅读器用户最讨厌的东西。
Google还将重点转移到提供良好用户体验的奖励网站上。我们知道,他们正在认真考虑可访问性,因为他们希望确保它们在搜索结果中包含最佳网站,并且他们认为可访问性网站是最佳网站,因为它们最容易理解和使用。
法律含义
在大多数情况下,除了必须要用户体验外,法律还要求可访问的网站。在欧盟内部,2019年引入了《欧洲无障碍法案》。该法案涵盖了产品和服务,例如计算机和操作系统,智能手机和电子商务平台。
它要求它们与辅助技术兼容,并以适合所有用户的格式显示。在美国,1990年首次实施的《美国残疾人法》(ADA)规定了网站可访问性。该民权法禁止歧视残疾人。
在该法案中,包含无法访问内容的网站可能被视为歧视性内容,并违反了法律第三章的规定。2010年《英国平等法》涵盖了英国的网站可访问性,旨在保护个人免受不公平待遇,同时促进公平,平等的社会。
根据该法律,站点所有者必须预见潜在残疾客户的需求,并针对这些需求进行“合理调整”。有一些著名的ADA网站合规性诉讼,例如:碧昂斯的网站
该诉讼是由玛丽·康纳(Mary Conor)提起的,该人打算购买碧昂斯演唱会的门票,但发现了许多辅助功能错误,例如:
- 图片没有替代文字。
- 拒绝键盘访问。
- 缺少可访问的下拉菜单。
- 多米诺比萨
由于无法通过屏幕阅读软件访问网站和应用程序,2016年还对Domino的披萨提起了诉讼。这阻止了订购定制比萨饼或利用仅在线折扣的功能。
耐克
2018年,耐克因屏幕阅读器无法访问而被起诉。该诉讼引用了空白链接和缺少图片的替代文本的问题。
辅助功能的四项原则
为了能够访问,网站必须符合四个原则,即POUR:
- 可感知的
- 可操作
- 可以理解的
- 强大的
- 可感知的
这包括消除用户访问您的内容可能遇到的任何障碍。这包括通过提供替代文本和逻辑结构,使屏幕阅读器可以访问网站。
可操作
为了能够操作,主要着眼于用户界面和导航,尽管用户正在浏览设备,但网站必须能够对所有用户可用。这还包括为用户留出足够的时间来完成任何给定的任务。
可以理解的,用户需要能够理解网页上显示的信息,以及清楚地了解用户界面和浏览站点。这包括具有可预测且一致的导航。强大的,为了变得健壮,必须能够通过包括屏幕阅读器在内的不同技术和平台来访问和解释网站。此外,它必须在所有平台的整个更新过程中保持可访问性。
SEO与辅助功能的交集
尽管我们的SEO工作通常着重于确保搜索引擎可以访问网站,但我们关注的许多领域也对用户对网站的可访问性产生影响。
2020年2月,Web Aim使用其WAVE可访问性引擎分析了应用脚本和样式后所有页面的渲染DOM,以评估最终用户可访问性障碍和Web内容可访问性准则(WCAG)失败。
这项研究发现98%的网页都有可检测到的WCAG故障,而97%的较深内容网页也没有通过可访问性测试。
造成这两种失败的最大因素是对比度低的文本,缺少替代文本和空链接。我们可以直接控制以下三个因素中的两个:
- 替代文字
- 空链接。
考虑到这一点,让我们探索SEO和可访问性之间的重叠领域,并分享我们如何通过我们的工作产生积极影响。
1.页面标题
页面标题用于提供上下文并帮助用户了解该网页的内容,并在搜索结果中显示为主要标题。
标题不仅使用户能够识别页面上的信息是否与他们相关,而且还可以在打开多个标签或页面时区分内容。屏幕阅读器将依靠页面标题向用户解释在页面之间导航时的情况。
通过针对用户优化页面标题,而不是针对机器人填充关键字,SEO最佳实践和可访问性是齐头并进的。
2.标题
在SEO中,标题的主要焦点是在H1标签上,以提供页面上主要内容的概述,而H2-H6标签用于进一步定义页面的结构。就像搜索引擎爬网程序一样,辅助技术使用标题来快速导航页面并移至内容的特定部分。
与SEO最佳做法类似,在使用标题标签进行可访问性时,仅使用一个H1很重要,请确保所有标题均与其下方的内容相关,并且仅在其下方包含内容时才使用标题。
3.网站地图
站点站点地图对于所有用户查找他们正在寻找的内容很有用,尤其是在站点导航复杂的情况下。它们对可访问性特别重要,因为它们提供了对网站上所有重要页面的概述和清晰的访问。
同样,对于SEO,站点地图可帮助搜索引擎爬网程序查找到站点上其他页面的链接,如果这些链接未链接到站点上的其他地方,则特别有用。
4.锚文字
锚文本用于描述将在链接到的页面上找到的内容。它可以用来描述页面的用途,并帮助用户确定是否要单击链接来访问目标页面。
通常,屏幕阅读器会在页面上切换,并在宣布锚文本之前通知用户何时找到了链接。如果用户认为有用,则将按Enter键以跟随该链接。搜索引擎爬网程序还使用锚文本来帮助理解目标页面的上下文。
另外,链接所包含的句子对于SEO和可访问性也很有帮助。编写锚文本时,请确保它不仅是通用的“单击此处”消息,而且还与链接到的页面相关,同时也要简洁。
5.面包屑链接
面包屑用作辅助导航,使用户可以导航回到其原始页面或顶级内容,并追溯其导航至所在页面所用的路径。面包屑链接还用于向搜索引擎抓取工具和屏幕阅读器显示网站的结构。
它们也是改善网站内部链接的好方法,特别是对于具有复杂导航结构的大型网站。要确保所有用户都可以访问面包屑,需要考虑一些因素,例如确保将面包屑放在整个站点的同一位置。
类似于内部链接锚文本,重要的是面包屑链接必须具有描述性,尤其是当屏幕阅读器通过它们导航时。
6.替代文字
可能最著名的SEO和可访问性交叉点是图像alt文本,它用于为视力障碍的用户提供替代文本。屏幕阅读器会大声朗读Alt文本,这意味着它们需要准确且相关,而不是为了针对机器人进行优化而塞满了关键字。Alt文本还用于帮助搜索引擎爬网程序了解图像的上下文,以便在图像搜索中显示。
机器学习算法在过去几年中发展迅速,这使得搜索引擎能够轻松确定是否在替代文本中使用了关键字填充。此外,计算机视觉已经变得足够先进,可以识别图像中的特征,以便自动创建相关的替代文本。
7.导航
一个网站的导航是用来帮助用户轻松地找到他们所寻找的同时,也显示在网站上的最重要的网页。这对用户以及搜索引擎爬网程序很有用。
通常,导航链接被构建为可选项卡化的,这意味着所有键盘和屏幕阅读器都可以阅读它们。为了确保可以访问您的导航,请确保仅包括主页而不是整个站点。这可能会引起所有用户的困惑,同时还会向搜索引擎抓取工具显示您具有纯网站架构。
8.可读性
确保网站上的任何内容可读性和可消化性对于用户和搜索引擎也很重要。简化内容的阅读水平是帮助可能有认知障碍的用户的最佳方法之一。这也将帮助那些母语不是网站上使用的母语的用户,以及可能在分散注意力的同时阅读内容的用户。
为了简化网站的可读性,重要的是避免使用行话或难懂的语言,确保文本左对齐并使用列表。可读的URL对于可访问性也很重要,最佳实践建议包括确保URL易于阅读和理解,以及使用破折号等单词分隔符。
URL应告知用户单击页面时应找到的内容,搜索引擎还使用URL来帮助他们了解页面的上下文。
9.用户互动
就像Googlebot无法执行物理交互(例如单击按钮或打开手风琴)一样,屏幕阅读器也无法执行此操作,除非用户指示。这就是为什么建议减少所需的物理交互次数的原因。
如果您的站点上有下拉列表或手风琴,请确保源代码中仍包含文本;这样可以确保漫游器和屏幕阅读器都能阅读内容,而无需执行任何用户交互。但是,此隐藏文本必须有意义并反映页面上写的内容,而不是使用传统的隐藏关键字填充方法。
最好的做法是避免使用悬停操作来显示任何内容,除非隐藏的内容也包含在源代码中。
测试可访问性
有几种可用于测试可访问性的工具,包括许多可在浏览器中运行以评估特定网页的Chrome扩展程序。在研究可访问性时,我发现了一些最有用的方法。
WAVE评估工具
该WAVE评估工具被开发webAIM.org并通过添加图标和指标到页面上提供了有关内容的可访问性的视觉反馈。
WAVE辅助工具
它还提供了问题摘要,可让您深入分析特定错误以查找更多信息。
斧头网站可访问性测试
此chrome扩展程序利用了Deque Systems开发的ax开源JavaScript库。该斧辅助功能测试工具是浏览器的开发工具和标识的无障碍网页上的缺陷中运行。
斧头辅助工具-开发工具
该工具具有清晰的用户界面,可显示检测到的可访问性问题及其在页面上的位置。
斧头辅助工具
网站改进辅助功能检查器
“ 站点改进可访问性检查器”提供了页面可访问性问题的清晰概述,并明确说明了它们如何影响用户。
该工具还显示有关解决已确定问题的建议。
网站改进辅助功能检查器
Google Lighthouse
Google的Lighthouse工具还执行可访问性审核,并提供与绩效得分相似的得分。但是,与性能审核不同,每个可访问性测试都是通过或失败,并且该页面不会获得部分通过的任何分数。
Google的Lighthouse工具
将为执行的每个测试给出权重,这将产生最终分数。
该报告还会在页面上显示未能通过审核的特定元素。
Google的Lighthouse工具
DeepCrawl规模化
我们还能够将斧头测试工具与自定义JavaScript脚本和DeepCrawl中的提取功能结合在一起。这是一种令人兴奋的方式,可以在整个站点上大规模查看违规情况,并提供分数和摘要。