我们希望您喜欢这个关于 google SEO 和可访问性的系列。在最后一部分中,Cooper 向您展示了您在网站上实施的技术性 google SEO 策略如何帮助使其更易于理解、可操作、易于理解和强大。
单击上面的白板图像以在新选项卡中打开更大的版本!
视频转录
嘿,莫兹的粉丝。欢迎使用最新版的 Whiteboard Friday。我是库珀霍尔迈尔。自 2016 年以来,我一直在做谷歌搜索引擎优化,今天我为一家大型户外零售商工作,帮助我们实现谷歌搜索引擎优化技术战略。非常感谢您参加关于 google SEO 和可访问性的这个系列。
我希望您已经获得了广阔的视野和新的技巧和窍门,以创建不仅能引起观众共鸣、在搜索中表现良好而且可供更多人访问的内容。今天我们将讨论技术谷歌搜索引擎优化和可访问性。
技术谷歌搜索引擎优化和可访问性
让我们深入了解。上次我们谈到了 Web 内容可访问性指南,您可能还记得 WCAG 的四个原则是可感知的、可操作的、可理解的和稳健的。
可感知的
作为一名技术型 google SEO,您可能最关心可感知性,因为您的日常运营、日常工作流程涉及确保您创建的页面、内容和体验可访问搜索引擎和可感知的搜索引擎。
很多时候,当我们通过谷歌搜索引擎优化建议或谷歌搜索引擎优化审计时,我听到了很多常见的主题,比如标题标签被烘焙到图像中,所以搜索引擎看不到它,或者我的内容生产对机器人可见,但对人不可见。这些是基础感知的问题。我希望您采用这种心态并考虑是否也将其应用于所有观众。那么,您所有希望参与您的服务、产品或体验的人是否能够在基本层面上感知您必须提供的所有东西?
1. 风格
您可能会想到的某些事情与您在此次审核中看到的内容相似,例如:页面上的所有文本都可见吗?它是活动文本吗?它是页面原生的,所以我可以选择它并复制并粘贴它,还是它被烘焙到图像中并且辅助技术或浏览器无法访问,或者你有什么?您可能还会在想:颜色与我的背景和文字形成对比,是正确的对比吗?
我的布局元素之间是否有足够的清晰度和清晰度?如果事情看起来有点模糊,或者不太清楚搜索引擎和用户是否可以访问某些内容,请返回绘图板并找出如何使这两个事情顺利进行。
2. 富媒体
我们还喜欢将图像、文本、视频和音频添加到我们为客户构建的页面中。重要的是这些丰富的元素,现在我们已经超越了基本的文本和样式元素,我们放在页面上的丰富元素也可以被所有用户感知。我们可以做几件事来实现这一点。对于图像,为他们提供文本替代方案并提供除该图像之外的其他内容将有助于屏幕阅读器看到它并让有视觉障碍的人理解它。
还用人性化的名称命名事物而不是“DSC1352.JPEG”将帮助搜索引擎和辅助技术看到该图像并理解它是什么。在页面上下文中,将图像放在增加价值的页面上也很重要。你想用一些额外的内容来启发用户,给他们更多的感觉,或者给他们更多关于你在说什么的上下文。添加图片以获得价值,而不仅仅是显示在 Google 图片搜索中。
视频呢?所以视频有点不同。视频有一系列运动图像。所以每次我想到运动时,我都会想,“我怎样才能确保如果用户想要停止这个运动,他们可以?”
当我们谈论可访问性以及为任何用户提供出色的视频播放器体验时,拥有清晰的播放控件至关重要。此外,这些文本替代项的同步等效项。我们讨论了具有替代文本的图像。视频也需要有替代文本,但它们需要与该视频同步。否则它们在上下文中没有意义。
然后确保它们是可区分的。这在视频和音频之间是一样的。我们要确保前景和背景易于相互区分。如果您的视频感觉浑浊,如果您的音频感觉浑浊并且我需要用力耳朵或眼睛才能看到该内容并理解正在发生的事情,那么您需要更清晰一点,更清晰一点这两个区别。
然后文字成绩单。就像视频需要隐藏式字幕一样,音频需要文本转录,所以如果我可能在嘈杂的地方听不到音频,或者我没有插入耳机,或者我需要要使用辅助技术,我可以访问该音频。
这些都是您在将代码作为技术性 google SEO 审查时会看到的所有内容,您应该注意这一点。
如果你没有这些事情发生,在你的网站上,我会授权你提出这些问题,像这样的难题:嘿,这张图片有文字替代品吗?视力障碍者、听觉障碍者如何获得这些东西?
3.页面结构
第三和第四是关于页面结构和语义 HTML。所以这有点少关于这是可感知的并且是可以理解的。
这是一种可以理解的放牧,但它也应该有点关于感知。可以想象,在一个页面上有一堆 H1,搜索引擎可能会感到非常困惑,对吧?他们就像,好吧,这个页面上有一堆 H1。我不太确定这个页面是关于什么的。添加结构和级联标题以表示父子关系将帮助您的内容更易于理解。将更容易理解正在发生的事情。
4.语义HTML
语义 HTML 也是如此。我们倾向于在 HTML 中放置大量 div 和 span 以及无法识别的元素。但是通过以更合适的方式标记它们,以便我们了解它们的含义,了解这些标签包含的内容,无论是导航、表单还是表格,提供额外的信息层和可理解性将允许搜索引擎和辅助技术能够解析这些内容,让他们能够感知您在页面上放置的彼此不同的内容,并提供更丰富的体验。
可操作
好的,所以我们能够感知内容。但是我们如何确保它是可操作的呢?
1. HTML 站点地图
我经常看到人们提出的一些谷歌 SEO 建议是构建 HTML 站点地图并将面包屑放在您的页面上。很多时候,你可能会因此受到一些阻力。HTML 站点地图对于我们知道的 google SEO 来说非常重要,因为它可以发现我们网站层次结构深处的那些页面。
我们知道面包屑对于可发现性也同样重要。这两个元素都可以帮助使用辅助技术的用户更好地浏览网站。HTML 站点地图允许您的菜单不包括您网站上的所有页面,或者如果它令人困惑,或者您使用的是 JavaScript 或我的技术堆栈无法访问的其他技术。
2.面包屑
然后面包屑允许我向上和向下解析特定的假设它是电子商务网站上的产品搜索页面,而无需返回菜单然后再次解析每个菜单项。因此,这两个对于导航非常重要,但对于使用键盘导航和使用辅助技术的人来说尤其如此。
3. 开发键盘优先
然后是非谷歌搜索引擎优化的事情,但重要且相关,首先开发您的网站和您的体验键盘。不是每个人都有鼠标或有能力使用鼠标,因为运动障碍、损伤或缺乏技术或硬件。因此,请确保您首先开发键盘,并且您将封装更多您希望与您的观众封装的人。
可以理解
1. 语言
可以理解。所以我们在国际谷歌搜索引擎优化中谈到,当我们与不同的国家和不同的语言打交道时,在我们的页面上使用 HTML 来表示页面的语言是多么重要。它可以帮助搜索引擎在正确的国家或国际背景下提供正确的结果。它还可以帮助屏幕阅读器以正确的语言大声朗读您的内容。
2.导航布局
然后导航布局和插页式广告我认为很常见,但没有人喜欢令人困惑的导航或网站布局。你做得越容易,人们就越容易转换或做你希望他们在这个网站上做的事情,无论是学习、购买还是参与服务。当导航和布局被简化并且我们不会在不同的地方使用不同的词来表示相同的事情时,这会更容易。对于拥有辅助技术的人来说,这一点更为重要。
3. 插页式广告
插页式广告,没有人喜欢我们脸上的那些弹出窗口,它们不允许我们浏览网站的其余部分。谷歌也不爱他们。但尤其是使用辅助技术的人,如果我们没有以正确的方式处理这些弹出窗口,我们最终会陷入用户可能陷入键盘陷阱而无法摆脱插页式广告的情况,或者他们不明白页面上什至放置了插页式广告。因此,在使用插页式广告时要非常小心,这一点很重要。
强大的
最后但并非最不重要的是稳健。我们如何确保我们放置在页面上的内容与各种设备和场景兼容?
1. 验证
仅使用正确的 HTML 是实现此目的的重要方法。您可以使用验证器并查看您的 HTML、CSS 和 JSON-LD。创建正确的代码,尤其是当您使用语义 HTML 并为该代码提供意义时,您将获得更好的体验,并且您构建的所有内容都更易于理解。
2.反应灵敏
您的网站响应速度快吗?你应该已经这样做了。但如果不是,请确保它在移动设备、台式机和平板设备上运行,并且布局保持不变,只是可能会以不同的方式调整大小或重新成像。
3. 可交互
确保它是可交互的。如果用户希望能够放大,因为他们有视觉障碍,或者他们希望能够更改颜色,您网站上的技术是否允许他们这样做?它应该。如果你在底层做这三件事,我认为它会做很多繁重的工作,你将不得不做更少的工作,因为你已经在框架中构建了一个易于访问的基础.
那是技术谷歌搜索引擎优化和可访问性。如果您有更多问题或想要一些验证工具,这里的右侧有一些,或者您可以在 Twitter @cooperhollmaier 上联系我以获得更多建议。但是非常感谢您收听 Whiteboard Friday 和可访问性以及 google SEO。我希望你能接受这一点,你在未来做谷歌搜索引擎优化的方式上变得越来越包容。
Speechpad.com 的视频转录
资源
- HTML 站点地图
- WCAG
- 标记验证
- 丰富的结果测试
- 国际无障碍专业人员协会