什么是Alt Attribute？
ALT属性（Alt Attribute/Alt Text）是一种HTML代码属性，在SEO中主要用于标记图像信息，当图像无法加载时，浏览器会展示ALT属性值来提醒读者缺少的图片与什么信息相关。ALT属性能够帮助搜索引擎和屏幕阅读器（为盲人和视障人士），为他们提供图片内容信息。如下，ALT属性指的就是”Flower in garden”。
<img src=”flower.jpg” alt=”Flower in garden”>我以前写过一篇关于图像Alt属性优化详细指南的详细文章，可以点击链接查看更详细的内容。
Alt标签的优点
Alt 文本由搜索引擎编入索引，可以提升您网站的在线形象。
提升用户体验，增加图片流量
提高视障用户和屏幕阅读器的可访问性。
如果图像加载失败，则会显示 Alt 文本。
Alt标签的常见错误
- Alt属性和图片无关；
- Alt属性和图片相关，和内容无关；
- 使用“image of”、“picture of”等词；
- 想太多，Alt属性描述太长，或者太短，导致描述不准确；
- 描述每一个小细节，而不是考虑选择此图片的关键原因要素；
- 复制文档或网站中相邻的文本。
可以使用Ahrefs等类似的网站审查工具来审查Alt属性设置问题。
不同类型的图像如何编写Alt Text？
针对不同的图像，撰写Alt Text时需要采用不同的方法。请遵循以下准则来撰写有效的描述：
- Logos：描述品牌和目的（例如，“SINE独立站品牌运营 logo – 助力独立站品牌运营”）。
- 图表和图形：总结关键数据见解而不是描述视觉元素。
- 图标和按钮：解释该功能（例如，“搜索按钮”或“下载 PDF”）。
- 人：必要时包括动作、表情或相关标识符。
- 装饰图像：使用 alt=”” 以便屏幕阅读器忽略它们
图片ALT属性的实践案例
案例 1：
Alt Text: Group of young college students laugh and walk along a tree-lined pathway.
案例 2
如果图标被用作另一个页面的链接，则Alt Text应该描述单击该图标时会发生什么。来自于HARVARD UNIVERSITY。
Alt Text: Visit the Harvard Library Instagram.
案例 3
编写Alt Text时，请考虑图片的使用场景和使用方式。文档、网站或电子邮件周围的文字可能会影响图片中哪些部分需要重点描述。在本例中，哈佛园霍利斯楼 (Hollis Hall) 的图片在两种不同的场景中使用，因此每种场景都需要不同的替代文本。
对比用例 1
一篇题为“
Spring is Here! ”的文章介绍了学生们享受好天气和卢森堡椅子归还哈佛园的情况。
Alt text: Students lounge and work in brightly colored Luxembourg chairs in Harvard Yard.
对比用例 2
一篇题为“
Famous residents of Hollis Hall”的文章谈到了霍利斯大厅相对于公共空间的优越位置。
Alt text: Hollis Hall, a red brick building, sits directly adjacent to the open grassy space of Harvard Yard.
最后
不要低估Alt属性的力量，它可以帮你的网站在Google中获得更好得用户体验，更多图片流量。