想象你是一家数字博物馆的负责人,馆里陈列着几万件“展品”——它们是网页上的每一张图片。馆里接待着一位特殊的观众:视力障碍用户。他看不见画面,只能依靠屏幕阅读器逐行朗读网页内容。这时,每张图片下面那行不起眼的 alt 文本,就是他唯一的“导览讲解词”。 你的任务,是组建一支 AI 讲解员团队,为每件展品写出准确、简洁、有人情味的讲解词。有的展品需要特聘专家精讲(调用顶级多模态大模型),有的交给常驻讲解员即可(开源图文模型);讲解词要控制在两句以内,不能把观众讲到睡着;讲解员还要知道展品挂在哪个展厅(图片所在页面的语境);新人写的稿子必须由资深讲解员抽查复核(人工审核流程);而整座博物馆必须先通过无障碍法规的验收(WCAG 合规)。这就是 AI 自动生成图片 alt 文本的完整图景——它不只是“丢一张图给 AI”,而是一条从模型选型、长度控制、语境补充到人工审核环环相扣的流水线。

岗位关联

掌握 AI 生成 alt 文本的完整流水线与权衡方法,能让你在无障碍合规、前端体验与团队效率之间找到平衡点,成为团队里既懂 AI 又懂 A11y 的稀缺人才。

目录
  1. 可视化演示
  2. 模型选型策略
  3. 描述长度控制
  4. 语境补充增强
  5. 人工审核流程
  6. 准确可读平衡
  7. 合规与无障碍
  8. 权衡与落地
  9. AI 应用场景
  10. Python 演示
  11. 常见误区
  12. 面试题

可视化演示

展示AI生成alt文本三大核心:视觉语言模型选型(BLIP 75%/CLIP 65%/GPT-4V 92%准确率速度权衡GPT-4V生产推荐)、描述长度控制(短15字/中50字/长125字三级+语境补充符合WCAG标准)、批量生成管道(图片→VLM→alt→审核四步85%自动通过12%复核3%拒绝质量闭环),三模式切换理解alt生成全貌。

本节配有交互动效(进入视口后自动加载,约 3KB)。

'+C1+'

模型选型策略

假设你管理着一座数字博物馆,要为展品配讲解词。博物馆可以聘请三类讲解员:外聘的顶级专家、常驻的全能讲解员、只会报编号的实习生。专家(闭源多模态大模型)讲得准、讲得生动,但按小时计费;全能讲解员(开源图文模型)勤快又免费,偶尔会说错细节;实习生(纯分类模型)只能告诉你“这是画”,说不出画面里发生了什么。选谁,取决于展品有多重要。

这正是模型选型策略的核心:没有最好的模型,只有最适合场景的模型。在技术层面,我们用四个维度给候选模型打分——准确度(描述与画面事实是否一致)、流畅度(语言是否自然)、延迟(生成耗时)、成本(单次调用费用)。四个维度加权求和,得到一个综合评分。例如一个新闻网站每天要处理十万张配图,对延迟和成本极度敏感,就会倾向开源模型;而医疗科普页面要求绝对准确,宁可多花钱也要调用顶级闭源模型。

回到博物馆的例子:入口处最显眼的名画,你舍得请专家精讲;走廊里几百幅普通画作,交给常驻讲解员就够了。模型选型的本质,就是按图片的重要程度分配讲解资源。

S=w1A+w2F−w3L−w4C\displaystyle S = w_1 A + w_2 F - w_3 L - w_4 C
综合评分等于准确度与流畅度的正贡献,减去延迟与成本的负贡献;四个权重由业务场景决定。
  1. 准确度 A描述内容与图片真实信息的一致程度,是 alt 文本的“事实底线”。
    A=正确识别的关键元素数画面中的关键元素总数\displaystyle A = \frac{\text{正确识别的关键元素数}}{\text{画面中的关键元素总数}}
  2. 流畅度 F生成文本是否符合自然语言习惯,决定读屏软件朗读时是否顺口。
    F=自然合格的句子数生成句子总数\displaystyle F = \frac{\text{自然合格的句子数}}{\text{生成句子总数}}
  3. 延迟 L从发起请求到拿到描述的平均耗时,实时场景通常要求小于 1 秒。
    L=1N∑i=1Nti\displaystyle L = \frac{1}{N}\sum_{i=1}^{N} t_i
  4. 成本 C单张图片的 API 调用费用或算力摊销,决定方案能否大规模铺开。
    C=月总费用月处理图片数\displaystyle C = \frac{\text{月总费用}}{\text{月处理图片数}}

描述长度控制

博物馆给讲解员定了一条规矩:每件展品的讲解词只能讲 1 到 2 句话。道理很简单——游客(屏幕阅读器用户)听太久会走神,漏掉重点;讲太少又像敷衍,听完一头雾水。这条规矩对应的就是 alt 文本的最佳长度区间:25 到 125 个字符。少于 25 个字符往往信息不足,比如“一张照片”说了等于没说;超过 125 个字符,读屏用户要忍受漫长的朗读,体验急剧下降。

在实际流水线中,长度控制通常放在模型输出之后。AI 生成的草稿可能又长又啰嗦,我们需要用程序把它压回区间内。最稳妥的不是硬切字符(可能把一个词拦腰截断),而是在整词边界截断,再补上省略号。更聪明的做法是“摘要式压缩”——识别并保留描述中的关键信息(人物、动作、地点),删掉修饰性铺陈。

就像优秀讲解员懂得“少即是多”,alt 文本的精髓也是用最短的句子传递最完整的信息。把每次生成都过一遍长度闸门,读屏用户听到的就不是一篇催眠论文,而是一句体贴的导览。

Lfinal={Lraw,Lraw≤Lmax⁡Trunc⁡(Lraw,Lmax⁡),Lraw>Lmax⁡\displaystyle L_{\text{final}} =\begin{cases}L_{\text{raw}}, & L_{\text{raw}} \le L_{\max} \\\operatorname{Trunc}(L_{\text{raw}}, L_{\max}), & L_{\text{raw}} > L_{\max}\end{cases}
最终描述的长度:若原始文本未超上限则原样保留,否则执行带词边界保护的截断。
  1. 原始长度 L_raw模型直接输出的文本字符数,是长度控制的输入。
    Lraw=len(caption)\displaystyle L_{\text{raw}} = \text{len}(\text{caption})
  2. 长度上限 L_max业务约定的最大字符数,一般取 125,口语化场景可放宽到 200。
    Lmax⁡=125\displaystyle L_{\max} = 125
  3. 截断函数 Trunc在词边界处截断并补省略号,避免出现“半个词”的残句。
    Trunc⁡(s,m)=head⁡m(s)+…\displaystyle \operatorname{Trunc}(s, m) = \operatorname{head}_m(s) + \text{…}

语境补充增强

同样一幅画,挂在“文艺复兴展厅”和挂在“儿童美术教育区”,讲解词绝对不一样。优秀的讲解员会先环顾展厅,再开口。AI 生成 alt 文本也一样:图片孤零零地进模型,和带着页面语境进模型,产出质量截然不同。

语境补充包含三个动作。第一,识别图片角色:这张图是信息型配图、功能型按钮,还是纯装饰?角色不同,写法完全不同——“购物车”按钮的 alt 要写清动作目的,装饰背景图的 alt 则要留空。第二,融合页面上下文:把所在页面的标题、相邻段落的主题词拼进提示词,让模型“带着背景知识看图”。第三,与正文去重:如果图片下面已经有一段文字描述了同样内容,alt 就不必复述,否则读屏用户会听到两遍一样的句子。

讲解员看展厅,AI 看页面。语境补充让“看图说话”从一句干巴巴的客观描述,升级成一句真正服务于用户当前任务的贴心提示。

alt=Pfx⁡(r)⊕Cap⁡(I)⊕Sfx⁡(c)\displaystyle \text{alt} = \operatorname{Pfx}(r) \oplus \operatorname{Cap}(I) \oplus \operatorname{Sfx}(c)
完整 alt 文本由三部分拼接而成:角色前缀 + AI 画面描述 + 页面语境后缀。
  1. 角色前缀 Pfx(r)根据图片角色生成的前缀,如“数据图表”“操作按钮”“示意图”。
    Pfx⁡(r)=角色词表[r]\displaystyle \operatorname{Pfx}(r) = \text{角色词表}[r]
  2. 画面描述 Cap(I)模型对图片内容的视觉描述,这是 alt 的主体部分。
    Cap⁡(I)=Model⁡(I,prompt)\displaystyle \operatorname{Cap}(I) = \operatorname{Model}(I, \text{prompt})
  3. 语境后缀 Sfx(c)从页面标题和相邻正文抽取的关键语境词,帮助理解图片的用途。
    Sfx⁡(c)=关键语境词(title,body)\displaystyle \operatorname{Sfx}(c) = \text{关键语境词}(title, body)
  4. 拼接运算 ⊕用分隔符把三部分拼成完整句子,并做重复内容去重。
    alt=a⊕b⊕c⇒dedup⁡(alt)\displaystyle \text{alt} = a \oplus b \oplus c \Rightarrow \operatorname{dedup}(\text{alt})

人工审核流程

新讲解员的稿子再漂亮,博物馆也不敢直接录进语音导览——万一他把画里的“苹果”认成“西红柿”呢?所以必须有一位资深讲解员抽查复核。对应到 AI 流水线,就是人工审核:不是每一条都审(那样效率太低),而是按比例抽样,审出问题后把反馈喂回模型,形成闭环。

技术实现上,通常用三个环节保证质量。第一,抽样机制:按 10%~30% 的比例随机抽取 AI 生成的 alt 文本进入人工审核队列,重点页面(如商品主图、新闻头图)则全量必审。第二,错误修正闭环:审核员发现错误后修正文本,修正结果记入“纠错样本库”,定期微调或改进提示词,让同类错误不再复发。第三,质量评分:给每条被审文本打质量分,统计通过率和错误分布,为模型选型和长度策略提供数据支撑。

抽查不是不信任讲解员,而是用最小的成本守住整座博物馆的口碑。AI 负责把产量拉满,人负责把质量兜住——这是 alt 文本流水线里永远不能省的那道闸门。

n=z2⋅p(1−p)e2\displaystyle n = \frac{z^2 \cdot p (1 - p)}{e^2}
抽样审核需要的最小样本量:由置信度 z、预估错误率 p 和允许误差 e 共同决定。
  1. 置信度系数 z统计上对审核结论的把握程度,95% 置信度对应 z=1.96。
    z=1.96\displaystyle z = 1.96
  2. 预估错误率 p根据历史数据估计 AI 生成文本的错误比例,取 0.1 时结果较为稳健。
    p=历史错误条数历史总条数\displaystyle p = \frac{\text{历史错误条数}}{\text{历史总条数}}
  3. 允许误差 e抽样估计允许偏离真实值多少,e 越小需要的样本越多。
    e=0.05\displaystyle e = 0.05
  4. 最小样本量 n达到上述统计要求至少需要人工审核的条数,n 越大审核成本越高。
    n=z2p(1−p)e2\displaystyle n = \frac{z^2 p (1-p)}{e^2}

准确可读平衡

好的讲解词有两个标准:说得对,且听得顺。“说得对”指事实准确——画家是莫奈就不能说成梵高,三个苹果不能数成四个;“听得顺”指语言自然——“一位老人在公园长椅上喂鸽子”优于“包含一个人物与大量鸟类元素的室外场景图”。这两者有时会打架:追求精确会变成干巴巴的流水账,追求流畅又可能为了顺口而歪曲事实。

在 AI 生成的 alt 文本里,最大的风险是“幻觉”——模型一本正经地描述画面里不存在的东西,比如给一只猫凭空加上项圈。防范的核心手段有三层:用更高的温度参数换取准确性、把模型输出与图片标签做交叉校验、以及最重要的——靠人工抽审兜底。实践中常用精确率(P)和召回率(R)来评估质量:精确率衡量“说出来的都对不对”,召回率衡量“该说的说到没有”,两者综合成 F1 分数。

讲解词的魅力在于真实而不生硬。把 F1 作为团队的质量北极星指标,每次模型升级都先用它做体检——准确与可读,从来不是单选题。

F1=2×P×RP+R\displaystyle F_1 = 2 \times \frac{P \times R}{P + R}
F1 分数是精确率与召回率的调和平均,越接近 1 说明 alt 文本既准确又完整。
  1. 精确率 P生成的 alt 文本中被审核判为正确的比例,衡量“说出来的话靠谱程度”。
    P=正确文本条数生成文本总条数\displaystyle P = \frac{\text{正确文本条数}}{\text{生成文本总条数}}
  2. 召回率 R需要补充 alt 的图片中真正被覆盖的比例,衡量“该写的写全没有”。
    R=已覆盖图片数应覆盖图片总数\displaystyle R = \frac{\text{已覆盖图片数}}{\text{应覆盖图片总数}}
  3. 调和平均 F1当 P 和 R 都高时 F1 才高,避免只追求一方面而牺牲另一方面。
    F1=2PRP+R\displaystyle F_1 = \frac{2PR}{P+R}

合规与无障碍

博物馆想开馆迎客,必须通过无障碍验收,没有商量余地。对网页来说,alt 文本不是“加分项”,而是硬性合规要求:WCAG(Web 内容无障碍指南)的 1.1.1 准则明确规定,所有非文本内容必须提供替代文本;美国 ADA(美国残疾人法案)、欧盟《欧洲无障碍法案》等法规也让“没有 alt 文本”变成实打实的法律风险。

合规视角下,alt 文本的写法有一套判定规则。信息型图片(展示内容的照片、图表)必须写有意义的描述;功能型图片(按钮、链接图标)必须描述其功能与目的地;装饰型图片则必须写空字符串 alt="",让读屏软件直接跳过,避免朗读“图片”这种噪声。一个常见错误是给装饰图也写一大堆描述,结果读屏用户被无关信息轰炸,体验反而更差。

合规不是成本,而是入场券。把 WCAG 规则直接写进生成流水线的判定逻辑里,AI 输出的每一句 alt 都天然站在法规这条安全线以内。

alt={desc(I),I 为信息型或功能型"",I 为装饰型\displaystyle \text{alt} =\begin{cases}\text{desc}(I), & I \text{ 为信息型或功能型} \\\text{""}, & I \text{ 为装饰型}\end{cases}
决策规则:有信息价值的图片必须提供描述,纯装饰图片用空 alt 标记。
  1. 信息型判定图片包含用户理解内容所需的信息,则必须提供描述类 alt。
    desc(I)=画面关键信息的有序叙述\displaystyle \text{desc}(I) = \text{画面关键信息的有序叙述}
  2. 功能型判定图片本身是交互控件,alt 必须说明动作与结果。
    desc(I)=功能动词+作用对象\displaystyle \text{desc}(I) = \text{功能动词} + \text{作用对象}
  3. 装饰型判定图片仅为视觉装饰,用空字符串标记让读屏跳过。
    alt=""\displaystyle \text{alt} = \text{""}

权衡与落地

最后,作为博物馆馆长,你要面对最现实的问题:经费有限,时间有限。请顶级专家讲每件展品当然最好,但预算会瞬间爆炸。这就是 alt 文本方案的权衡与落地——在质量、成本、速度之间画出自己的平衡线。

常用的落地策略是“分级混跑”:高价值图片(电商主图、新闻头图)走闭源大模型加全量人工审核;中价值图片走开源模型加抽样审核;低价值或装饰图直接置空。同时区分批量与实时两种通道——存量图片用离线批处理在深夜跑完,用户上传的新图片用轻量模型实时生成。最后,上线不等于结束:要持续监控错误率、审核通过率、读屏用户反馈,把每次 AI 模型升级都当作一次需要重新评测的版本发布。

博物馆的每一分钱都要花在刀刃上。明白了总成本的结构,你就能在“多花点钱请好模型”和“多抽点人做审核”之间做出理性的平衡——效率与质量,最终由清晰的成本模型说了算。

Ctotal=N⋅cm+N⋅s⋅cr+N⋅q⋅cf\displaystyle C_{\text{total}} = N \cdot c_m + N \cdot s \cdot c_r + N \cdot q \cdot c_f
总成本等于每张图片的生成成本、抽样审核成本、返工修正成本三者之和。
  1. 图片总数 N需要生成 alt 的图片总量,是成本的第一乘数。
    N=图片总量\displaystyle N = \text{图片总量}
  2. 单张生成成本 c_m模型调用费用与算力摊销的均值,开源模型可低至接近零。
    cm=月模型费用N\displaystyle c_m = \frac{\text{月模型费用}}{N}
  3. 抽样率 s 与单条审核成本 c_rs 越大审核越充分,但人力成本线性上涨。
    cr=审核员工时费用单条审核耗时\displaystyle c_r = \frac{\text{审核员工时费用}}{\text{单条审核耗时}}
  4. 返工率 q 与修正成本 c_f错误率越高,返工修正花的钱越多,倒逼上游提升质量。
    cf=单条修正的人力与计算消耗\displaystyle c_f = \text{单条修正的人力与计算消耗}

AI 应用场景

电商平台商品图批量补全

阶段:批量生成 + 抽样审核

解决的问题:运营人员逐张手写 alt 文本,一万张商品图要写上一周,还经常遗漏。AI 流水线结合商品名、价格、卖点等结构化数据生成候选描述,一小时内跑完全量图片,运营只需按 10% 比例抽查,效率提升近十倍。

具体案例:某服饰电商上线“无障碍体验月”,三天完成全站 3 万张商品图的 alt 覆盖,描述包含“米白色短袖衬衫、棉麻材质、宽松版型”等准确信息,读屏用户下单转化率提升 6%,同时通过了内部无障碍巡检。

政务网站无障碍合规改造

阶段:存量扫描 + 合规审核

解决的问题:政府网站按法规要求必须达到 WCAG AA 级,但存量页面数百个、图片数万张,人工补写成本极高。AI 先扫描缺失 alt 的图片,生成草稿后自动分类为信息型、功能型、装饰型:装饰图置空,信息图进入人工审核队列。

具体案例:某省级政务服务网改造中,AI 生成 1.2 万条 alt 文本,人工抽审通过率达 96%,整改周期从原计划的 6 个月压缩到 3 周,顺利通过第三方无障碍测评。

CMS 编辑器实时 alt 建议

阶段:实时推理 + 人工选用

解决的问题:内容编辑上传图片时经常忘记填写 alt,发布后产生大量合规欠账。在 CMS 编辑器里嵌入 AI 建议面板,图片一上传就实时生成 2~3 条候选描述,编辑一键选用或微调,从源头杜绝“裸图”上线。

具体案例:某主流资讯平台的创作后台接入该能力后,新增文章的 alt 覆盖率从 41% 提升到 97%,编辑平均每次只需多花 5 秒,稿件合规率显著上升。

Python 演示

python66 行
# -*- coding: utf-8 -*-"""AI 生成图片 alt 文本的轻量流水线演示"""  class AltTextPipeline:    """模拟 alt 文本生成流水线: 生成 -> 长度控制 -> 语境补充 -> 抽查审核"""     def __init__(self, max_len=120, sample_rate=0.3):        self.max_len = max_len        self.sample_rate = sample_rate        self.gen_count = 0        self.review_map = {}        self.role_map = {            'image': '示意图',            'chart': '数据图表',            'button': '操作按钮',            'decorative': '装饰图片',        }     def generate(self, scene, subject):        """模拟多模态模型生成原始画面描述"""        # 真实项目中可替换为 BLIP-2 / Qwen-VL / GPT-4V 的调用        raw = f"{scene}中,{subject}正在进行日常活动,人物表情自然、神态放松"        self.gen_count += 1        return raw     def trim(self, text):        """描述长度控制: 超出上限时在整词边界截断并加省略号"""        if len(text) <= self.max_len:            return text        head = text[:self.max_len]        if ' ' in head:            head = head.rsplit(' ', 1)[0]        return head + '...'     def enrich(self, text, role, heading):        """语境补充: 拼接图片角色前缀与页面主题后缀"""        prefix = self.role_map.get(role, '图片')        return f"{prefix}:{text}(页面主题:{heading})"     def review(self, final_text):        """人工审核: 按采样率判断本条是否进入审核队列"""        interval = max(1, round(1 / self.sample_rate))        if self.gen_count % interval == 0:            self.review_map[self.gen_count] = final_text            return True        return False     def run(self, scene, subject, role, heading):        raw = self.generate(scene, subject)        trimmed = self.trim(raw)        final_text = self.enrich(trimmed, role, heading)        need_review = self.review(final_text)        return final_text, need_review  if __name__ == '__main__':    pipe = AltTextPipeline(max_len=120, sample_rate=0.3)    cases = [        ('城市公园', '一位老人', 'image', '城市生活图鉴'),        ('高铁站', '旅客', 'chart', '出行数据报告'),        ('购物页', '购物车按钮', 'button', '在线商城'),    ]    for scene, subject, role, heading in cases:        text, flag = pipe.run(scene, subject, role, heading)        print((' [抽审] ' if flag else ' [直发] ') + text)
目的:用不到 60 行实现一条完整的 alt 文本生成流水线,包含模拟模型生成、长度截断、语境补充和抽样审核四个环节,可直接作为生产系统的原型骨架。
  1. class AltTextPipeline:定义流水线类,把生成、裁剪、补充、审核四个环节封装成可组合的方法。
  2. raw = f"{scene}中,{subject}正在进行日常活动..."模拟多模态模型的输出,生产环境替换为真实模型调用。
  3. head = head.rsplit(' ', 1)[0]在最后一个空格处截断,保证不把英文单词切出半个残词。
  4. prefix = self.role_map.get(role, '图片')按图片角色返回前缀,让“购物车按钮”这类功能图说出用途。
  5. interval = max(1, round(1 / self.sample_rate))按采样率折算成计数间隔,每 N 条抽 1 条进入审核队列。
  6. self.review_map[self.gen_count] = final_text把被抽中的文本记录进审核字典,等待人工处理。

常见误区

误区我看到代码里 `alt=""` 是空的,那肯定是程序员偷懒漏写了,得补上“这是一张图片”之类的描述才行。

正解alt="" 是空 alt,它代表“这张图片是纯装饰,读屏软件请直接跳过”,是 WCAG 明确认可的合规写法。真正该补的是那些完全没有 alt 属性、或 alt 写成了文件名(如 IMG_001.jpg)的图片。用博物馆类比:空 alt 等于展位前挂“本画无需讲解”的牌子,游客会自然走过;而缺失 alt 等于牌子都没挂,游客以为这里没有展品。

为何常见:因为从视觉效果看,alt="" 和“没写”都表现为空白,初学者很容易把“空”误解为“缺失”。

误区读屏用户看不清图片,我写得越详细,他获得的信息就越多,所以应该把画面里每个细节都写进去。

正解屏幕阅读器会不打断地把整段 alt 读完,两三句话是合理上限,超过 125 个字符就开始让人疲惫。想象游客在博物馆里听讲解,讲解员喋喋不休讲十分钟,游客只会想逃。正确的做法是把最核心的“人物、动作、地点、关键状态”写清楚,细节留给上下文或长描述(如 longdesc 或页面正文)。

为何常见:人们容易从“信息完整性”出发,忽略“信息接收的负担”,把写给眼睛看的内容默认搬到耳朵上。

误区大模型能力这么强,我把它生成的描述直接填进 `alt` 属性就完事了,又快又省人力。

正解多模态模型存在幻觉风险,会一本正经地描述画面里不存在的东西,比如给一只猫凭空加上项圈、把红绿灯数量数错。没有人工抽审兜底,错误描述比没有描述危害更大——它会向视障用户传递错误信息。正确做法是抽样审核 + 纠错闭环,把 AI 当“高效率的草稿员”,而不是“免检的终审者”。

为何常见:因为 AI 生成的内容看起来自然流畅、自信满满,人们容易忽略“流畅”与“真实”之间的鸿沟。

误区既然 alt 是给读屏用户看的描述,那不管什么图片,我都把画面要素一一列出来,肯定不会错。

正解alt 的职责是传达图片在当前页面语境下的信息,而不是穷举画面。同样是“购物车”图标,作为按钮时 alt 应写“查看购物车”,作为装饰时应该留空。如果图片下方正文已经描述了同样内容,alt 还要学会“闭嘴”,避免读屏用户听到两遍重复朗读。判断标准始终是:这个用户在这个页面场景中,需要从这张图里知道什么。

为何常见:因为孤立地看图片,自然会追求“描述全面”;只有把图片放回页面里,才能理解“信息冗余比缺失更烦人”。

误区我给每张图都写了 alt=“图片”,这样总比没有强吧,至少读屏软件能播报“图片”。

正解屏幕阅读器本来就会在遇到图片时自动播报“图片”,alt="图片" 等于让朗读变成“图片,图片”,完全没有传递任何信息,属于典型的无效 alt。这就像广播里说“接下来是图片”,听众什么也没得到。正确的做法是描述内容本体,如“一位老人坐在公园长椅上喂鸽子”;装饰性图片则直接 alt="",连“图片”两个字都不用播报。

为何常见:因为从“有没有写”的角度看,写了总比空着踏实;但无障碍的标准从来不是“写了没有”,而是“读屏用户得到有用信息没有”。

面试题

Q1. WCAG 建议的非装饰性图片 alt 文本最佳长度约为多少?

单选题 · easy

  • A.约 125 个字符← 正确答案
  • B.约 500 个字符
  • C.越长越详细越好
  • D.完全无需限制

答案:A。alt 文本以 1~2 句、25~125 字符为黄金区间,过短信息不足,过长让读屏用户疲惫。500 字符已经超出合理上限,C、D 与无障碍最佳实践完全相悖,因此选 A。

Q2. 页面中一张纯装饰性背景图,正确的 alt 写法是?

单选题 · mid

  • A.alt=“装饰背景图”
  • B.alt=“背景图片”
  • C.alt="" 空字符串← 正确答案
  • D.直接省略 alt 属性

答案:C。装饰型图片必须写空 alt,让读屏软件跳过;写“装饰背景图”之类反而制造朗读噪声。在 HTML5 中,img 的 alt 属性是必需的,不能省略(省略可能导致读屏朗读文件名),因此 C 正确。

Q3. 下列哪种模型最适合直接生成图片 alt 文本?

单选题 · mid

  • A.仅文本处理模型
  • B.多模态大模型← 正确答案
  • C.纯图像分类模型
  • D.语音识别模型

答案:B。alt 生成需要同时理解图像内容并输出自然语言,多模态大模型(如 GPT-4V、Qwen-VL)是首选。纯文本模型看不见图,分类模型只能输出标签,语音模型处理的是声音而非画面,均无法完成任务。

Q4. 某图片 alt 文本为“数据展示”,最可能存在的问题是?

单选题 · hard

  • A.描述过于泛化← 正确答案
  • B.描述完全错误
  • C.描述过于冗长
  • D.包含违禁词汇

答案:A。“数据展示”没有传达任何图表的具体信息——是什么数据、趋势如何、结论是什么,属于典型的高泛化低信息量描述。这就像讲解员说“这里有一幅画”,却没讲画的内容,是长度达标但语境缺失的失败案例。

Q5. 屏幕阅读器遇到 alt="" 的图片时会怎样?

单选题 · easy

  • A.朗读图片文件名
  • B.自动跳过该图片← 正确答案
  • C.朗读“图片”两个字
  • D.报错并停止朗读

答案:B。空 alt 是给读屏软件的“免打扰”标识,遇到它屏幕阅读器会直接跳过,不朗读任何内容。它适用于装饰性图片。而省略 alt 属性在某些情况下会导致读屏朗读文件名,所以不能用省略代替空串。

Q6. 图片按钮“购物车”的正确 alt 文本应侧重什么?

单选题 · mid

  • A.按钮图标的颜色
  • B.按钮的动作与目的← 正确答案
  • C.图片的美学价值
  • D.设计师的创作理念

答案:B。功能型图片的 alt 必须描述功能与目的地,即“点击后发生什么”。“查看购物车”优于“红色购物车图标”。颜色、美学、创作理念都不是读屏用户完成操作所需的信息。

Q7. 进行语境补充时,可以从哪些来源获取信息?

多选题 · mid

  • A.页面语义化标题← 正确答案
  • B.相邻段落正文← 正确答案
  • C.图片在页面中的角色← 正确答案
  • D.浏览器历史记录

答案:ABC。语境补充的三大来源是页面标题、相邻正文和图片角色(信息型/功能型/装饰型),把它们拼进提示词能让模型“带着背景看图”。浏览器历史记录属于用户隐私,与图片内容无关,不应作为输入。

Q8. 描述长度超出上限时,合理的压缩策略包括?

多选题 · hard

  • A.在整词边界截断← 正确答案
  • B.保留关键实词优先← 正确答案
  • C.删除与正文重复的内容← 正确答案
  • D.按字符直接硬截断

答案:ABC。合理的压缩是“语义优先”的:在词边界截断避免残词,优先保留人物、动作、地点等关键信息,并去掉与页面正文重复的表述。直接按字符硬截断会产生“半个词”,破坏可读性,因此 D 错误。

Q9. 为什么 AI 生成的 alt 不能绕过审核直接上线?

单选题 · mid

  • A.因为模型推理太慢
  • B.因为可能产生幻觉← 正确答案
  • C.因为图片通常太小
  • D.因为格式无法解析

答案:B。多模态模型会一本正经地描述画面中不存在的内容(幻觉),错误信息对依赖读屏的用户危害很大。审核不是怀疑模型能力,而是给它配一个“事实守门员”。推理速度、图片大小、格式问题都与“是否要审核”无关。

Q10. 完善的 alt 文本生成方案能带来哪些收益?

多选题 · easy

  • A.提升无障碍体验← 正确答案
  • B.降低合规法律风险← 正确答案
  • C.改善图片搜索流量← 正确答案
  • D.完全替代人工工作

答案:ABC。高质量 alt 让读屏用户获得完整信息,满足 WCAG/ADA 等法规降低被诉风险,同时搜索引擎能更好地理解图片内容带来 SEO 收益。但 AI 生成仍需人工抽审兜底,无法“完全替代”人,因此 D 错误。