幻灯片中每张图片的有效alt属性应该是多少？

Question

在网站目录中，每个商家都有一个包含多张图片的幻灯片。如果我不知道每种情况下的图片类型，那么处理每个图片/链接的alt属性的最佳方法是什么？

示例（已编辑）

<ul class="slideshow">
   <li>
     <a href="img1_full.jpg" ><img src="img1_thumb" alt=""></a>
   </li>
   <li>
     <a href="img2_full.jpg" ><img src="img1_thumb" alt=""></a>
   </li>
</ul>

Answer 1

alt="Slideshow image 1 of Business X"等

由于您不知道图像是什么，这将是一个有效的选项。它告诉使用屏幕阅读器的人，或者由于某种原因无法看到图像（它没有加载），图像是幻灯片的一部分。它还告诉它是什么图像以及它与之相关的业务。

要获得额外的功劳，您可以使用可以分析图像内容的Cloud Vision API等API，并返回描述图像内容的短语。

Answer 2

The a element can’t have an alt attribute

假设您使用img：

• 如果幻灯片中的图片只是装饰，则必须使用空的alt值。

• 如果链接转到页面（而不是图像），则alt值has to describe the purpose of the link，而不是图像。例如，如果幻灯片显示产品图片并链接到产品页面，则alt值可能是产品名称。

• 如果链接转到图像（例如，分辨率更高）或幻灯片未链接，则alt值必须描述图像。

Exception：如果您自动生成标记但无法添加合适的alt值，则可以使用属性generator-unable-to-provide-required-alt（空值）而不是{{ 1}}。它不符合要求，但验证者可能会忽略错误，并且无论如何都比提供不合适的alt值更好。