图片Alt文本怎么写：兼顾搜索收录与无障碍体验的方法
📱 Mozilla/5.0 AppleWebKit/537.36 (KHTML, like Gecko; compatible; ClaudeBot/1.0; +claudebot@anthropic.com)
🔗 /6c7b57c71432.html
📄
图片的Alt文本通常只是HTML里一段不起眼的描述文字，但它同时作用于两条关键链路：一边帮搜索引擎理解图片内容并提高收录质量，另一边让依赖屏幕阅读器的视障用户能准确获取画面信息。写好Alt文本，是用极小的成本同时提升网站可见度与可用性的高效手段。
1. 先判断这张图是否需要Alt文本
不是所有图片都值得写描述。动手前可以先对页面上的图片分类：能传递实际内容的图片，例如商品实拍、数据图表、界面截图，属于信息型；而纯装饰的色块、分割线、背景纹理则属于装饰型。
判断的简便标准是：如果图片加载不出来，页面的核心信息会不会因此缺失？如果会，就需要补充描述；如果完全无碍，就把Alt属性设为空值（alt=""），让辅助技术直接忽略。比如商品详情页里标注了型号与颜色的主图，描述必须具体到品牌、规格、颜色；而首屏仅起视觉点缀的渐变背景，就不需要浪费文字。
2. 写出高质量Alt文本的四个要点
确定哪些图需要处理后，关键就是怎么写。掌握以下四条规则，基本能覆盖绝大多数场景。
2.1 如实描述画面，不堆砌关键词
Alt文本的第一任务是还原内容，不是给搜索引擎凑词条。例如"浅灰色布艺沙发搭配原木色茶几，背景墙上挂着三幅装饰画"是合格的写法；而"沙发 茶几 装饰画 客厅 简约 原木"这类罗列读起来毫无信息量，也不会带来排名提升。如果图片本身含有文字，例如活动海报或产品包装，应直接把文字内容完整转写出来，这往往是用户最有价值的信息。
2.2 控制篇幅，保持简洁清晰
屏幕阅读器会把整段Alt文本逐字读出来，写得太长既拖慢理解，也容易让人失去耐心。能用一句话说清的内容，不要扩写成段落。比如"雨后屋檐悬着水珠"就够了，不需要补写"在一场阵雨过后，屋檐边缘凝结着大小不一的水滴"。如果细节实在复杂，把详细解说放进正文，Alt文本只给核心结论。
2.3 省略"图片展示的是"这类冗余开头
类似"这是一张关于……的图片"或"上图中可以看到"属于多余的套话，因为读屏软件遇到图片时本来就会给出位置提示。直接进入画面主体即可，例如写"窗台上打盹的橘猫"，而不是"这是一张展示橘猫在窗台上睡觉的照片"。
2.4 链接型图片描述动作而非外观
当图片本身可点击时，Alt文本应说明点击后的结果，而不是描述画面内容。比如顶部品牌Logo通常链回主页，应写"前往某品牌官网"；宣传会员优惠的横幅，更适合写"查看年度会员折扣详情"，而不是描述横幅上人物的表情或配色。
3. 不同场景下的描述侧重
同样是简短一句话，在不同场景里落笔的角度会有明显差别。对照常见场景调整视角，能让描述更贴近真实需求。
- 商品图：优先写明品牌、系列、材质、规格和颜色，例如"某品牌便携保温杯 500ml 雾霾蓝"就比"一个杯子"有价值得多。
- 操作步骤或流程截图：概括操作完成后的结果，例如"后台订单批量导出的参数设置页面"，而不是逐项描述界面上每个按钮。
- 数据图表：提炼图表想传达的结论，例如"第二季度销售额环比增长18%的柱状图"，而非复述坐标轴刻度。
- 人物照片：说明人物身份与动作，例如"创始人正在产品发布会上展示新品"，而不是简单写"一个人在台上"。
4. 容易犯的避坑建议
除了写对内容，避开几个常见误区同样重要，否则可能事倍功半。
- 不要用文件名代替Alt文本：例如"DSC_0023.jpg"完全无法传达任何信息，也不要依赖自动生成的默认描述。
- 不要把重要文字放在图片里而不另写说明：如果图上有价格、日期、电话等关键信息，除了Alt文本，最好在正文里也出现，避免视障用户和搜索引擎都拿不到完整内容。
- 避免重复描述同一内容的缩略图和原图：如果页面上同一张图出现两次，只需给主图写描述，另一处用空Alt即可。
- 不要因为图片不重要就把Alt写成空，但也不要做成指向性猜测：装饰图用alt=""是合理的，但信息图写成alt="图片"等于没写。
5. 常见问题
5.1 Alt文本写多长合适？
建议控制在5到15个中文词之间，能准确传达核心信息即可。个别复杂图表或截图可以稍长，但也要避免超过两三句话，否则会影响屏幕阅读器用户的体验。
5.2 图片同时有标题（title）和Alt，两者都要写吗？
Alt文本是必须的，用于传达内容；title属性是可选的，通常用于鼠标悬停时的补充提示。多数情况下写Alt就够了，title仅在需要额外提示时才加，两者内容不必重复。
5.3 动图或视频封面图的Alt文本怎么处理？
动图可以按画面内容描述，但如果动图传达的是肢体语言或动态过程，要描述关键动作。视频封面图则应与视频标题呼应，说明视频场景或人物，比如"演示平板电脑拆装全过程的封面画面"。
6. 总结
Alt文本优化并不复杂，核心思路就三句话：先筛选哪些图该写，再用简洁准确的话描述内容，最后结合场景调整视角。把每张信息型图片的Alt当成给用户的一句话解说，顺带提升搜索收录质量，就能在低投入下获得可观的回报。建议在改版或发布内容时按这套流程检查一遍现有图片，很快就能养成习惯。
