加入空的alt = ""有什么好处？应该使用哪种alt，是alt = ""还是alt = " "？

Question

在HTML中添加null alt =""有什么好处？仅仅是为了通过验证还是有其他原因呢？

应该如何书写？

像这样，没有空格。

alt=""

或者这样只留一个空格

alt=" "

- Jitendra Vyas

---

标题应该写成“空”而不是“null”，因为“null”有时在数据表示中（包括Javascript，但不包括HTML）具有特定的非空字符串含义；而您已经用空引号说明了您的意思。 - Anonymous

Answer 1

为了让你的XHTML有效验证，图片上的alt属性是必须的。但是如果程序员在图片上添加空属性，则表现出懒惰的迹象（尽管我承认对于不是网站导航关键的小装饰元素等图片，我也会这样做）。

附注：如果你有像阴影组件、某些装饰物之类的装饰元素，可以将它们作为CSS背景添加，从而避免编写替代文本并保持你的标记干净，没有非内容的东西。

- user151323

---

也许在未来几十年内，验证将变得更加严格，并需要非空字符串。这可能是历史上最激动人心的技术竞赛。 - Daniel Earwicker

我不相信这总是因为懒惰造成的 - 有些图像（间隔符、边框等）你真的不希望被读出来，因为它们大多只是装饰，对内容没有贡献，所以你必须能够标记那些需要被读者忽略的内容。不幸的是，这并不是我目前了解得足够多的东西，所以我会欢迎更多的评论... - Murph

我不同意这是懒惰的行为。有时候描述图像毫无意义，它纯粹是为了创造主题或“图标语言”。例如，假设您有一个导航栏，其中每个导航选项都有一个图标，与文本相补充，即“家庭图标”家庭。在屏幕阅读器中，使用“带有家庭图标的主页”比使用空的alt-text更好吗？我认为不是！

• 使用alt-text: “家庭图标主页”
• 空的alt： “主页”

- PatrikAkerstrand

@Murph：我同意。为像阴影组件这样的图像添加替代文本是毫无意义的。 - user151323

@Mac：这不仅仅是屏幕阅读器的问题。如果我在浏览器中关闭图像渲染，我也会看到替代文本。对于低带宽连接的用户来说，这并不罕见。 - Joey

装饰性图片，如阴影组件，应通过CSS和background-image及其相关组件插入，而不是通过标记语言。这样，您可以同时做两件好事。您可以将设计保留在样式表中，并将非语义代码从页面中删除。虽然我认为“语义至上”的运动未能看到div和span的失败以及它们产生的固有歧义，但我仍然认为具有background-image的div比img标签更适合进行样式设置。 - Tor Valamo

Answer 2

其他答案已经指出了标准中的要求。这里有一个实际的例子：

如果alt文本为空，Lynx将呈现：

如果alt属性缺失，Lynx将呈现：

filename.jpg

您不希望您的内容中散布着无关的文件名。

- Quentin

---

哪种方法是正确的添加空alt？你的示例会如何影响屏幕行为？ - Jitendra Vyas

使用空格的目的是为了避免一些旧软件中的错误，如果我没记错的话。屏幕阅读器的行为不同（取决于哪个屏幕阅读器以及如何配置）。有些会告诉用户那里有一张图片，而其他一些则会跳过它，还有一些可能会让用户获取有关文件名的信息。 - Quentin

你的建议是正确的。如果我们使用alt=" "，那么IE在鼠标悬停时会给出空白提示。 - Jitendra Vyas

Answer 3

对于没有适当替代文本的图像（即不具有任何语义的图片，如装饰元素），alt属性应为空。空意味着为空，而不是一个空格（这是一种惯例和建议，但是一个好的惯例）。

必须为IMG和AREA元素指定alt属性。对于INPUT和APPLET元素，该属性是可选的。

虽然备用文本可能非常有帮助，但必须小心处理。作者应遵守以下准则：

• 在包含旨在格式化页面的图像时，请勿指定无关的备用文本，例如，对于添加红球以装饰标题或段落的图像，alt="red ball"将不合适。在这种情况下，备用文本应为空字符串（“”）。无论如何，建议作者避免使用图像来格式化页面；应改用样式表。
• 请勿指定无意义的备用文本（例如，“dummy text”）。这不仅会使用户感到沮丧，而且会减慢必须将文本转换为语音或盲文输出的用户代理。

实现者应查阅辅助功能部分以了解如何处理省略备用文本的情况。

——HTML 4规范。第13.8节如何指定替代文本

- Joey

---

仅用于验证的是 null alt 吗？ - Jitendra Vyas

属性对于 img 元素是强制性的。因此，可以通过这种方式验证文档，同时确保没有为没有意义的图像引入无用的混乱。 - Joey

Answer 4

我也会将这个作为一个答案添加进来（原本是对另一个答案的评论），因为这样做有点意义。

用于页面样式的图片（因此没有真正的“alt”用途）应该通过CSS和background-image及其相关内容插入，而不是通过标记。这样你可以同时做两件好事。你可以将设计保留在样式表中，并且可以避免非语义化的代码出现在页面中。

虽然我认为“语义至上”的运动未能看到div和span的失败以及它们产生的内在歧义，但我仍然认为使用带有background-image的div比使用img标签进行样式更好。

- Tor Valamo

---

不要忘记第三种情况：用于说明内容的图像。它们并没有添加任何重要的含义，但它们是内容的一部分（例如以可视化方式展示表格数据的图表，或者与文章讨论相关的人物形象）。这些不是设计元素，但也不应该有alt文本。 - Quentin

当然应该。alt元素描述了图像所包含的内容，这样那些无法渲染图像（或使用屏幕阅读器）的人就知道其中的内容。"12215426.jpg" 对他们来说毫无意义，而"奥巴马拿着伞"或"详细说明去年销售情况的图表"则能告诉他们一些信息。alt元素应该是图像标题的简化版，或者如果图像实际上有标题，则应该与标题相同。 - Tor Valamo

"Obama拿着一把伞"或"详细说明去年销售情况的图表"并没有传达给用户有用的信息，而且如果您使用文本浏览器，这种做法就没有意义了。 Alt文本是替代方案，而不是描述性语言。您需要确保图像旨在传达的信息包含在文档中，您不需要告诉用户他们看不到的所有内容（尽管偶尔这样做会很有用，但这就是“longdesc”属性的作用）。 - Quentin

它描述了图片。如果标题是“奥巴马又忙于与共和党人斗争的一天。”，那么alt就是这个。然而，如果该标题实际上在图片周围显示，那么alt应该是图片上的内容，即“奥巴马拿着一把伞。”，因为这就是实际情况。你还会在什么时候使用alt呢？包含文本的内联图像？是的。也是，但这只是一个非常有限的用途，而且是必需的。 - Tor Valamo

我同意David的观点，如果你正在阅读一篇关于奥巴马忙碌一天的文章，而文中某处出现了“奥巴马拿着一把雨伞”的文字，那么这将是一个令人困惑的干扰，对内容没有任何贡献。 - Nick Higgs