html - 如何使用 alt 属性并确保 IE 不将它们用作工具提示？

Question

我们的网站有一个图形主菜单（即文本在图像编辑器中完成，然后显示为图像），但是每当我将鼠标悬停在菜单项上时，它都会显示一个工具提示。（例如，当我将鼠标悬停在“联系我们”上时，会弹出另一个“联系我们”作为工具提示）

我的网页设计师说这对于让搜索引擎索引菜单文本是必要的，但它严重地使演示文稿变得丑陋 - 有没有办法避免工具提示但仍然让搜索引擎索引 alt 属性？

score 2 · Accepted Answer

该alt属性在img标签中是必需的。它在那里为那些看不到图像的人提供信息。这可能包括视障者（可能使用屏幕阅读器）、使用非图形浏览器的人或禁用图像的人。在图像纯粹用于格式化的情况下，该alt属性应设置为空字符串 ( alt="")。

该alt属性不应呈现为工具提示。据我所知，Windows 的 Internet Explorer 是唯一能做到这一点的浏览器。

title属性“提供有关为其设置的元素的咨询信息”。它不是必需的，并且只应在它提供其他有用信息的情况下使用，而这些信息尚未出现在为其设置的元素中。该title属性通常在图形用户代理（浏览器）中呈现为工具提示。

有关详细信息，请参阅alt 和 title 属性。

您的图形菜单可以采用多种方式之一进行设计，因此很难说可以更改哪些内容（如果有的话）。你需要考虑的是：

那些不以与您相同的方式看到该网站的人可以访问您的导航菜单。是否可以在 Lynx 等纯文本浏览器中浏览您的网站？如果关闭图像会发生什么？如果关闭样式表会发生什么？关闭图像现在可能很少见，而且处理起来很棘手 - 这是一个判断电话。
是导致工具提示被呈现的一个alt或属性吗？title如果是前者，那么那些有幸使用适当浏览器的人将看不到工具提示。
首先这真的是一个问题吗？考虑到删除它可能导致的可访问性问题，这真的很重要吗？
搜索引擎旨在查找对人们有用的内容。如果您的网站在纯文本浏览器中查看时没有意义，那么它可能对搜索引擎没有意义。为人们而不是搜索引擎设计您的网站。

score 1 · Accepted Answer

来自alt属性的工具提示消息仅显示在 IE 中，不显示它的唯一方法是不设置它（坏主意）。

所有其他浏览器title都应显示带有属性的工具提示。

score 1 · Accepted Answer

就在这里。您可以使用基于图像的菜单，但仍将文本隐藏在其中。有不同的技术，这个链接显示了其中的几个：

它不仅可以帮助搜索引擎索引网站，而且对屏幕阅读者（例如访问您网站的盲人）更友好。

score 0 · Accepted Answer

该alt属性是可访问性和 SEO 目的绝对需要的文本。像往常一样，IE 是错误的，它也使用该文本作为工具提示。如果您不想要工具提示，请将正确的属性设置title为空白 alatitle=""

但是，正如其他人所说，更好的解决方案是根本不使用图像。如今，您可以使用 CSS 轻松设置文本样式。它不需要 alt 属性，不会产生工具提示，允许用户更轻松地调整它的大小，更容易编辑，并且最终用户的加载速度更快。

score 0 · Accepted Answer

如果您的菜单文本是标准的，即

然后忘记alt/title标签。你不会从搜索引擎索引这些获得真正的价值。

当然，应该添加alt标签以实现可访问性。images

如果这是一个真正的问题，您可以做的一件事是将imagesasbackground-images放在div/divs. 然后添加titleorname属性到divs.

5 回答 5