图片Alt文本写法全攻略：兼顾SEO优化与无障碍体验
📱 Mozilla/5.0 AppleWebKit/537.36 (KHTML, like Gecko; compatible; ClaudeBot/1.0; +claudebot@anthropic.com)
🔗 /bbbee06949c8.html
📄
网页上的每一张图片都有一段看不见的文字描述，它就是Alt属性。这段文字体积虽小，却同时是搜索引擎理解图片内容的重要依据，也是视障用户借助屏幕阅读器感知画面信息的唯一途径。写对了，图片能带来更多自然搜索流量；写错了，轻则错失机会，重则让部分用户完全无法理解页面。掌握下面这套写法，能以极小的投入换来双重收益。
1. 写之前先给图片做分类：哪些需要描述，哪些可以留空
不是每张图片都需要认真的替代文本。落笔之前，先看这张图在页面里承担什么角色。通常可以分成两类：一类是内容型图片，比如产品实拍、数据截图、流程示意，它们承载着页面不可缺失的信息；另一类是装饰型图片，比如背景渐变、圆角分割线、纯装饰的插画，删掉也不会影响任何理解。
最直接的判断方法是做个假设：如果这张图加载不出来，页面是不是就少了关键内容？如果是，必须配上清晰完整的描述；如果不是，直接把Alt属性写成空值（alt=""）就好，这样读屏软件会自动跳过，反而比硬写一句“装饰图片”更友好。举个例子，详情页里展示按键布局的键盘图必须写清型号和按键排列，而页面底部迎合视觉美感的几何纹理则完全没有描述的必要。
2. 四条核心原则，让替代文本准确又得体
判断好哪些图片需要处理，接着就该认真组织语言了。下面的四条原则几乎覆盖了日常会遇到的所有场景。
2.1 忠实描绘画面内容，别把关键词堆成杂货铺
替代文本的首要使命是把画面讲清楚，而不是凑关键词给搜索引擎看。一句“白色陶瓷马克杯放在深色木桌上，旁边摊开一本翻到中间的书”就是合格的描述；而“马克杯 木桌 书 咖啡 书房 阅读角”这种名词罗列，读屏用户听了只会一头雾水，搜索上也几乎带不来什么有效流量。如果图里本身有文字，比如海报上的活动主题或包装上的产品名，这部分务必原样转写，因为那往往才是用户真正想找的信息。
2.2 用最少的字说清最关键的事
屏幕阅读器会一字不落地把整段替代文本念出来。写得太长，听的人不仅容易烦，还可能漏掉后面真正重要的内容。两三个短语能讲明白的事，绝不扩写成完整的句子。比如“傍晚江面上的轮船剪影”已经足够，不需要补充“这是傍晚时分，一艘轮船在江面上缓缓驶过，江面倒映着船身和远处城市灯光”这类的细节铺陈。万一画面信息确实很丰富，更稳妥的做法是把细致的说明放在图片下方的正文里，替代文本只给一个概括性的结论。
2.3 删掉多余的“这是一张……的图片”式开场
读屏软件在播报图片前会自动提示“图片”二字，所以“下图是”“这张图展示了”“这是一张关于……的图片”这类前缀毫无意义。直接从画面主体切入更清爽，例如写“阳光穿过百叶窗在地板上投下条纹光影”，而不是“这是一张展示阳光穿过百叶窗在地板上投下条纹光影效果的图片”。
2.4 图片作为链接时，描述点击后会发生什么
如果整张图被包在一个可点击的链接里，替代文本应该说明这个链接的用途，而不是图片本身长什么样。页头Logo指向官网首页时，写“前往某某官网首页”就比“某某公司彩色Logo”更合适；一张推广夏季活动的横幅，写成“查看本季清凉好物优惠”远比描写横幅上的模特造型和配色对用户更有帮助。
3. 不同内容类型，描述各有侧重点
同一幅图放在不同的页面位置，写作角度大不相同。摸清下面几类常见场景的偏好，能让你的描述更贴合用户的实际预期。
- 电商产品图：优先写品牌、型号、关键规格、材质和颜色。“某某品牌便携保温杯 磨砂黑 500毫升”显然比泛泛的“一个杯子”有价值得多，用户想搜同款时这样的信息能直接命中需求。
- 操作截图或示意图：重点写清动作与结果，不要复述界面上的所有文字。“在设置菜单中点击‘隐私’选项后，可关闭位置权限”这类描述，比单纯念出画面上显示的按钮文字更实用。
- 信息图表或数据图：把图表要传达的核心结论用一句话写出来。“柱状图显示三季度销售额较上季度增长百分之十五”就比“一张蓝色柱状图”更有意义。
- 人物或场景照片：适当交代人物动作或环境氛围，但不必判断情绪或虚构心理活动。“两位工人在车间里调试一台大型设备”是恰当的，而“工人脸上露出欣慰的笑容”这类主观推测则不太合适。
4. 常见误区与避坑提醒
就算理解了原则，实际写作中还是容易踩进几个老坑。提前知道这些雷区，能帮你省下不少返工的时间。
- 把关键词列表当描述：一长串名词或短语既不符合无障碍阅读习惯，也难以对搜索排名产生实质帮助，搜索引擎早已能识别这种低质量写法。
- 为了“凑字数”把无关内容写进去：描述了图里根本没有的东西，会同时误导用户和搜索引擎，得不偿失。
- 对纯装饰性图片也硬写一句话：这不仅不会加分，反而会给读屏用户带来无意义的干扰，正确做法是留空Alt属性。
- 忽略图片周围正文的语境：描述应当与上下文有呼应，而不是孤零零地另起炉灶。如果正文已经交代了品牌背景，图片描述就无需再重复一遍。
- 图片上有重要文字却完全不提：有的海报或截图里包含核心信息，比如价格、日期、按钮名称，这些文字必须出现在替代文本中。
5. 常见问题
5.1 替代文本的空值（alt=""）和完全省略Alt属性是一回事吗？
不完全一样。二者的效果都是让读屏软件跳过这张图片，但对搜索引擎而言，空值明确的表达是“这张图没有信息含量，不用处理”，比省略属性更清晰。如果页面代码里图片缺失了Alt属性，有些工具会标记为问题，而显式的空值则不会。因此，对装饰性图片，推荐写出alt=""而不是直接删除属性。
5.2 写Alt文本时，是否应该把品牌名或产品型号放进去？
要看图片本身是否包含这些信息，以及它们对理解有没有帮助。如果图上印着产品型号，或者图片属于品牌官方宣传物料，写进去是合理的，能帮助用户确认商品身份。但如果品牌名和型号跟画面内容毫无关系，硬塞进去不仅无用，还可能让描述显得刻意。核心还是“如实描述画面”这一条原则。
5.3 同一张图在文章里出现多次，每处的替代文本都要重新写吗？
如果每次出现的语境和用途不同，建议分别编写，因为替代文本应当服务于当前上下文的阅读需求。比如同一张数据图，在总览部分可以写“年度营收整体呈上升趋势”，而在具体细节段落则侧重“第三季度增幅最明显”。如果图片在完全相同的语境下重复出现，可以保留一致的描述，但这通常不算常见情况。
6. 总结
写好图片的替代文本，说到底就是回到两个根本问题：这张图对用户有什么用，以及用户在图加载不出时最需要知道什么。实际操作时，先按内容型和装饰型把图片分好类，再依据如实描述、语言精炼、去掉废话前缀、链接描述动作这四条原则逐张处理，最后按不同内容场景微调侧重点。这套方法不挑工具、不依赖特定平台，是一套可以长期复用的基本功。改稿时提醒自己：先想清楚“看不见图的人该怎么理解”，再落笔，多数情况下就不会出错。
