`<img>` 标签中 `alt` 属性的作用是什么？如果图片加载失败会发生什么？

考察点：可访问性（A11y）、SEO、用户体验

---

alt 属性是 alternative text 的缩写，意为替代文本。

它的主要作用有三点：

1. 可访问性（核心）：当图片因为网络原因加载失败，或者用户使用的是屏幕阅读器时，alt 文本会被朗读出来或显示在图片位置。这对于视障用户理解图片内容至关重要。大厂面试非常看重 A11y 意识。
2. SEO：搜索引擎爬虫无法“看”懂图片，它们依赖 alt 文本来理解图片内容，从而索引图片。
3. 用户体验：在网络较差图片未加载时，显示 alt 文本能让用户知道这里原本应该是什么内容，而不是看到一个破碎的图标。

最佳实践：

• 如果图片是装饰性的（如背景花纹），alt 应设为空字符串 alt=""，这样屏幕阅读器会跳过它，避免噪音。
• 如果图片包含信息（如产品图、图表），alt 应简洁准确地描述图片内容。
• 不要堆砌关键词，要自然描述。