WordPress 替代属性解释:什么是图像替代文本?
已发表: 2021-01-19我们都知道在整个页面和文章中使用图像是多么重要。 仅仅是文本块变得更加生动,您以更直观的方式吸引访问者,并传递您的信息。 但是当添加一个时,你会情不自禁地专注于一个听起来很奇怪的领域。 “嗯,替代文本,现在会是什么”,你思考。 它肯定不能是 WordPress 开发人员随机添加的某个字段——如果它在那里,它可能是有目的的。
替代文本是添加到图像标签的 HTML 属性。 它们是短文本字符串,如果 WordPress 无法显示图像,则会显示它们。 替代文本可改善您的图像搜索引擎优化。 它们还帮助使用屏幕阅读器和搜索引擎的视障用户理解图像的内容。
替代文本也有一些随意使用的名称,例如“alt 标签”、“alt 文本”或“alt 属性”。 为了充分利用它,我发现最好将 alt 标签考虑为这样:alt 属性就像一份冗长报告的“执行摘要”。 它非常简要和具体地总结了图像(即报告)包含的内容。
一些现有的 CMS 平台和许多定制网站要求您直接在每个页面的代码中手动添加该部分。 但是,像我们这样的幸运者在 WordPress 中更容易获得该功能。
图像替代文本如何在 WordPress 中工作?
替代文本并不是什么新鲜事。 它们也不是只有 WordPress 才能提供的独一无二的东西。 事实上,它们是一个非常古老的功能,可以追溯到 20 世纪末互联网的最初几天。
自 1995 年 HTML 2.0 发布以来,alt 标签具有三个具体目的:
- 如果浏览器由于某种原因无法加载图片,则 Alt 标签会出现在您的页面上,而不是图像上。
- 屏幕阅读器为浏览互联网时使用视觉辅助的人大声朗读替代文本。
- 像谷歌这样的搜索引擎机器人使用它们来更好地理解图像的内容。
因此,替代文本是一个很好的辅助功能,不需要添加太多额外的工作。
WordPress 中的图像替代文本示例
现在让我们看一些替代文本的例子。 我已经突出显示了哪些好的和坏的例子,以便您可以准确地理解您想要包含在您的 alt 标签中的内容。
好的替代文本示例
这是我们在其中一篇博客文章中插入的图片。 正如您在下面看到的,图像的目的是准确地展示读者如何实现文章中描述的结果。

我们创建的 alt 标签的最终结果是“联系我们页面上 NAP 的好例子”。
因为图像添加了上下文并帮助用户解决他们的问题,所以我们正确标记它并指出这一点很重要。
糟糕的替代文本示例
同时,您还可以创建无用的替代文本。 假设完全相同的图像具有“NAP”或“企业 NAP”的 alt 标签。
这个替代文字很糟糕,因为它不为任何人服务,而且只会消耗时间。 那么是说没有替代文字比一些替代文字更好吗? 虽然这是有争议的,但我们的观点是,从用户可访问性的角度来看,此类 alt 标签没有帮助。 他们也不为 Google 的爬虫添加任何上下文。 即使在图像无法显示的最坏情况下,用户仍然会感到困惑,因为他们在页面上看到的只是一个随机的词——而不是一个简洁的字符串,让他们知道那里应该有什么。
因此,我们认为浪费时间来创建糟糕的 alt 标签是不值得的。 相反,当我们决定检查我们的网站并这样做时,我们发现实际创建有用的替代标签是更好的时间投资。
在 WordPress 中编写出色图像替代文本的 9 个最佳实践
现在您知道如何在 WordPress 中使用图片的 alt 属性了。 有了这个,让我们回顾一些技巧和最佳实践,以确保您正确使用它。
1. 替代文本应少于 125 个字符
保持你的 alt 标签少于 125 个字符。 对于 alt 标签的长度没有严格的规定,因此请将此建议用作经验法则。 但是,只要相关,请随意牺牲此一般规则以获得更具描述性的文本。 然而,这通常是不需要的。
最重要的是,这是 125 个字符的示例:
“阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿阿
这是很多文字! 大多数情况下,您可以将替代文本放入其中。
2.要么写好Alt标签要么根本不写
但是较低的利润呢? 技术上没有(当然,除了 0)。 就个人经验来说,偷懒,只写一两个字也不值得花时间。 也就是说,如果您不打算编写好的 alt 标签,它们就像您一开始没有它们一样好。
3.保持相关的Alt标签相似但独特
让你的 alt 标签相似是完全可以接受的——但要确保它们仍然是独一无二的。 假设您有图片解释了操作指南中的两个连续步骤。 在这种情况下,有些重复的部分是不可避免的。
但是,在这里您可以通过清楚地解释每个步骤并用正确的数字标记来确保每个替代文本都足够独特。
例如: alt=”这是我的 WordPress alt 文本教程的第一步” vs. alt=” WordPress alt 标签教程的第二步”
4. 避免使用“Image of”,除非它是相关的
通常,您不需要在替代文本中写入“图像”或“屏幕截图”。 搜索引擎和屏幕阅读器知道他们正在处理图像,因此无需添加该文本。 相反,可以更好地利用剩余空间。
这当然是正确的,除非您想在 Google 中出现这些关键字查询。 如果您的目标关键字包含短语,例如“屏幕截图”,那么将其添加到图像中确实有助于它在 Google 搜索中的排名更高。
例如,假设您在新闻中听到政治家电子邮件通信的泄露图像。 自然地,您可能会寻找诸如“泄露电子邮件的图像 [政治家的虚构名称]”之类的内容。
在这里,在替代文本中添加“图像”短语将帮助您显示该搜索查询 - 当然,仅凭这一点并不能保证您的网站会靠近顶部。
同样,假设您的帖子以主题的“灵感”为目标关键字。 在这种情况下,使用“[主题]的鼓舞人心的图片”之类的短语也是可以接受的。
5. 不要在替代文本中使用垃圾邮件关键字
编写替代标签时,请保持文本相关并避免垃圾邮件关键字。
也就是说,如果您的图片展示了一只狗,请不要写类似于“dogs canine pet puppy hound man's best friend dog crazy pup”这样的替代文字。 相反,选择更具描述性的内容来添加上下文。
考虑到图像周围的内容和段落,该文本可能会自然地解释图像。 我将在下面的部分中向您展示具体示例。
6. 最后添加图片有助于写出好的替代文本
在您完全准备好您的博客文章后添加图像可以确保您不会错过任何 alt 标签,并且以后必须花费额外的时间来修复它们。 有时,您甚至可能在插入图像后编辑 alt 标签,却发现它没有在页面上更新。
请记住,在创建页面和帖子时,最好在 WordPress 中添加图像作为最后一步。
7. 使用图像名称作为替代文本
在获取图像时,只需记住为它们命名与您所写内容非常相关的名称。 而不是使用空格,只需使用破折号来分隔单词。 有了这个,一旦你上传了图片,你就可以简单地复制你已经写好的名字并删除破折号。 这样做会给你一个完美的 alt 标签,而不会浪费任何时间。 要准确了解我如何执行此过程,请阅读有关在 WordPress 中添加 alt 标签的指南中的这一部分。
8. 伟大的 Alt 标签详细描述图像
在编写 alt 标签时,描述性很重要。 您对图像上的内容描述得越好,视障用户就越容易理解为什么要将图像放在那里。 这同样适用于搜索引擎。 当有人搜索此类图像时,这种做法使您有更好的机会让 Google 展示您的网站。 即使对于比您优化的确切搜索更长的、不同的搜索(也称为长尾关键字),也会发生这种情况。
9. 将您的网站设计图片放入 CSS 中
如果纯粹出于设计原因制作图像,则应在网站样式的 CSS 中实现它。 这样做将设置正确的站点代码结构/层次结构。 它还允许搜索引擎和屏幕阅读器区分有助于内容的图像和纯粹用作设计特征的图像。
按照这个逻辑,您现在已经了解到实际上所有图像都应该有一个 alt 标签。 在 HTML 中实现图像意味着图像向页面添加上下文 - 并且它允许您添加替代文本。 同时,在您的 CSS 中实现图像意味着图像不会添加上下文,而是帮助呈现页面——因此您无法访问添加 alt 标签的功能。
结束语
对于大多数网站来说,添加替代文本不需要大量的时间投入。 同时,随之而来的好处是巨大的。 您使您的网站更易于访问 - 您可能会因此获得 Google 的奖励。
学习如何编写 alt 标签的最好方法是查看一些示例并自己尝试一下。 要了解如何在 WordPress 中为图像添加或更改替代文本的实际过程,请阅读此处链接的指南。
最后,始终确保在 WordPress 中保存更改并确认 alt 标签可见。 否则,由于它的制作方式,有时 WordPress 不会显示您的新替代文本。 如果您之前遇到过这种情况,请阅读本指南,了解如何修复 WordPress 不显示 alt 标签。
