图片的 alt 属性用于提供替代文本，确保图像无法显示或无法被感知时内容仍可理解。基本语法为 <img src="example.jpg" alt="描述">，描述应简洁准确；装饰性图片使用空 alt 属性（alt=""）以避免干扰辅助技术；功能性图片如按钮或图标，alt 文本需说明功能，如“搜索”或“返回首页”；复杂图像如图表应在 alt 中概括主题，如“2023年销售额增长趋势图”，并辅以页面文字描述或 longdesc 属性提供完整信息。合理设置 alt 属性有助于无障碍访问和 SEO，是提升网页包容性与用户体验的关键措施。
图片的 alt 属性是 HTML 中用于提供替代文本的关键属性，主要作用是在图像无法显示时提供文字说明，同时为屏幕阅读器等辅助技术提供内容描述，提升网页的无障碍访问能力。正确使用 alt 属性不仅有助于残障用户理解页面内容，也有利于搜索引擎优化（SEO）。
alt 属性的基本语法
在 HTML 中插入图片时，img 标签应始终包含 alt 属性。基本写法如下：
<img src="example.jpg" alt="一张示例图片的描述">其中，alt 的值应简洁准确地描述图片内容或功能。如果图片仅用于装饰且无信息价值，可将 alt 设为空字符串。
何时使用空 alt 属性
某些图片仅用于美化页面布局或视觉分隔，不传递实际信息。这类装饰性图片应设置空 alt 属性，使屏幕阅读器跳过它们：
立即学习“前端免费学习笔记（深入）”；
<img src="divider.png" alt="">这样既符合无障碍规范，又避免对辅助技术用户造成干扰。
功能性图片的替代文本写法
当图片具有功能作用（如按钮、链接图标），alt 文本应描述其功能而非外观。例如：
- 搜索图标：
<img src="search.png" alt="搜索"> - 返回首页的 logo：
<img src="logo.png" alt="返回首页">
确保用户即使看不到图像，也能通过替代文本理解其用途。
复杂图像的信息补充方式
对于图表、信息图等复杂图像，alt 属性应简要概括内容，并结合其他方法提供完整信息：
- 在 alt 中写明图像类型和主题，如“2023年销售额增长趋势图”
- 在页面附近用文字描述关键数据
- 通过 longdesc 属性指向详细说明页面（较少使用）
确保所有用户都能获取等效信息。
基本上就这些。合理设置图片的 alt 属性，是构建包容性网页的重要一步，既能满足无障碍标准，也能提升整体用户体验。不复杂但容易忽略。
