接入的无障碍检测插件在首页报了一条 frame-title,指向内嵌的地图 iframe,读屏走到那里只念一句框架,页面上有三块 iframe 时完全分不清。乍看像缓存或者权限的锅,追下去往往不是。

<iframe src='map.html' title='上海门店位置地图'
        width='600' height='400' loading='lazy'></iframe>

追下去是这么回事:iframe 没有 title 属性,可访问名称为空,读屏只能用通用词代替。页面里 iframe 一多,用户无法判断当前进入的是地图、视频还是支付表单。

碰到「iframe 标题」这类问题,我习惯先把当前配置原样备份一份,改坏了立刻换回来,不用现场推。接口问题先分清是没发出去、发出去了没收到,还是收到了处理失败。

偶发问题先统计频率,一小时几次和一天一次,查法完全不同。改完顺手把文档补一句,省得下次自己重新推一遍。

具体做法是,给每个 iframe 补 title,写清里面是什么内容,别写成 iframe 或框架;同一页面多个 iframe 的标题要有区分,比如门店地图和预约表单;装饰性极强的空 iframe 直接删掉,不要留着占位。

验收就看一点,检测工具里 frame-title 这条违规消失,读屏进入 iframe 前先报出门店位置地图。

作者 9823189