外贸独立站的无障碍：客户把字号调到 150% 之后，页面还站得住吗
把浏览器缩放调到 150%，再把鼠标拔掉、只用 Tab 键从首页走到询盘页——一个做了五六年、看上去挺体面的外贸站，十分钟内大概率能露出七八处毛病。这是我们给客户做站时真会走的两步，不花钱，也不用装插件。多数老板第一次跟着走完，反应都是同一句：原来这里也算问题。
提这件事是因为买家那头变了。欧美做采购的经理，四五十岁往上的不在少数，看屏幕时字号早就调大了；一线工程师常在车间用手机查参数，光线差、信号还只有一格；也真有买家用读屏软件、只用键盘操作。欧洲的无障碍法案（EAA，指令 2019/2102）从 2025 年 6 月起在成员国落地，直接约束的是面向消费者的电商和服务，工业类 B2B 站不在它直接管辖的范围内——但大企业和公共采购的供应商问卷上，「网站是否符合 WCAG 2.1 AA」这一栏，这两年确实越来越常见。没被罚过款，不代表没被这一栏筛掉过。这件事在我们这两年的外贸网站建设里，已经不是客户主动提，是我们先问。
先说清楚：无障碍不是给少数人做的附加题
很多人一听无障碍，脑子里就浮现「给盲人做的」，觉得自己卖轴承、卖包装机械，跟这事没关系。这个理解偏得有点远。真正天天受益的是这么几类人：把系统字号调到 125% 的老采购、在阳光直射的办公室看屏幕的、戴耳机在车间看你们产品视频的、手机信号剩一格还想打开参数页的、习惯用语音输入代替打字的。这些人加起来，比「残障用户」这个标签宽得多。对要做外贸独立站的人来说，这一层人就是要接住的询盘来源，不是慈善对象。
国际上的 WCAG 标准把要求归成四条：能感知、能操作、能理解、够健壮。翻成大白话就是——图和视频要有替代说法，鼠标干不掉的活得能用键盘干完，写出来的东西要让人看得懂，代码别乱到读屏软件念不出来。四条里跟你产品页、询盘页关系最紧的是前两条，改起来也没那么玄。
把这件事放回询盘链路看会更明白：一个买家从搜索到产品页、再到下载规格书、填询盘，中间任何一步他觉得费劲，人就走了。无障碍修的是摩擦，不是排场，这也是海外询盘转化里最便宜的一段投入。它是外贸网站建设里最少被写进报价单、却最影响独立站询盘落地的一块。郑州外贸建站的活做下来，这类返工出现的频率比排版问题更高。
看得见：对比度和字号，是最容易被忽略的两处
先说对比度。设计师喜欢浅灰正文——#999 压白底，看上去轻、干净、高级。可这个组合的对比度只有 2.8 比 1 左右，WCAG 对正文的要求是 4.5 比 1。换算到实际感受，就是买家在车间、在窗边、在夜里看手机的时候，那些浅灰字等于没有。改法不复杂：正文用 #333 或 #444，辅助信息也别低于 #666，深色 banner 上的白字要先看底图本身的亮度，图上太亮就加一层半透明遮罩。这些在浏览器开发者工具里都能直接测，不用买软件。对比度跟页面好不好看没关系，它属于外贸网站优化的基础项，改一次管很多年。
字号和行高是另一处。产品参数、条款说明这类内容，正文起步 16px、行高 1.6 是底线。很多老站的正文只有 12px、行高 1.3，页面塞得下更多东西，读起来像在看说明书。放大到 150% 又容易崩：容器写死了宽度、按钮文字被截、参数表横向撑破屏幕。判断标准很朴素——缩放之后页面还在、文字不重叠、按钮点得到，就算过关。外贸独立站的参数页最容易在这一步露馅，因为它天生要塞很多字。
移动端的毛病通常更集中。参数表在电脑上是六列，到手机上挤成一条条 8px 的小字，买家得双指放大再左右拖。这块比什么都要紧，因为海外买家里用手机看站的早就是多数。做法是把表格在窄屏改成卡片式，一项参数一行，标题加粗、数值靠右，翻起来舒服得多。这类改动跟询盘表单的填写体验是同一套逻辑：别让买家为了看懂而付出额外动作。独立站询盘少掉的那一截，多半就丢在这种地方。
点得到：把鼠标拔掉，用 Tab 键走一遍
这一步最能暴露问题，也最不需要技术。拔掉鼠标，从首页开始按 Tab：菜单能不能逐项走进去、产品卡片的链接能不能被选中、询盘表单的每个字段能不能跳进去填、提交按钮最后能不能按到。走不通就说明有人的路被堵了。外贸独立站的导航层级往往做到三四层，这一走最容易在第三层卡住——点进去没有返回，只剩浏览器后退。
常见的三个坑。第一是焦点框被样式抹掉——早年为了好看，很多主题里都写了 outline:none，键盘用户于是完全看不到自己停在哪儿，像在黑暗里摸开关。正确做法是保留焦点框，或者用自己的高亮样式替代。第二是顺序乱走：页面用绝对定位排版，DOM 里的顺序跟眼睛看到的顺序对不上，Tab 会先在页脚转三圈再回到正文。第三是浮层——Cookie 同意条、询盘浮窗、图片放大，弹出之后焦点没锁在里面，按 Tab 能跑到背后的页面上，按 Esc 也关不掉。买家一旦卡在浮层里，浏览器返回就成了唯一出路。这一条在 Google SEO 的报表上看不出来，在询盘数据上却会露头：产品页停留不短，跳出照样高。
Cookie 那条弹窗尤其要注意。欧洲客户对它是敏感的，Cookie 与隐私页那篇讲过合规口径，这里补一句操作层面的：同意条的「拒绝」按钮要和「接受」一样好点，别做成灰色小字；键盘能到达，Esc 能关，关掉之后焦点要回到触发它的位置。同一件事的合规面和可用面，本来就是一体。
念得出：alt 和表单标签，是文案活不是开发活
图片的 alt 现在多数站都有，问题在写的内容。打开源码看一眼，十张产品图里有九张写的是「产品图1」「IMG_2387」「banner」，等于没写。读屏软件念到这里，买家听到的就是一串编号。合格的写法是把型号、关键参数、材质塞进去，比如「不锈钢法兰球阀 DN50 PN16 二片式」。装饰性图片（分割线、背景纹）留空 alt 就行，不用硬凑。这些写法一次定进模板，下一批产品上新就是复制粘贴的事，郑州外贸建站的客户做多品类时，我们一般先给一份写法样例。
图标按钮是另一个盲点。汉堡菜单、搜索、关闭、加号，写成只有图标的按钮却没给名字，读屏念出来是「按钮」两个字。加一句 aria-label 就解决了，成本几乎为零。这一条在手机上更值得查，因为移动端为了省空间，纯图标按钮特别多。做多语言网站的更要注意，图标旁边要是配了字，阿语版一换方向就容易错位。
表单的问题更严重，因为它是外贸独立站询盘的必经之路，也是无障碍毛病最集中的地方。最典型的一种是拿 placeholder 当标签：输入框里淡淡的灰字写着「请输入您的邮箱」，一旦开始输入，提示就没了，买家写到一半忘了这栏要填什么；读屏软件对 placeholder 的支持也不一致。正确做法是每个输入框配一个真的 label，写在框上方，字号小一点但颜色够深。必填项别只标一个星号，直接写「必填」或者加 required 属性；出错时不能只把边框变红，得有一行字说明哪里错了——「邮箱格式不正确，请检查是否缺少 @」。这些细节跟询盘表单优化是同一件事的两面：一面是让人愿意填，一面是让人填得下去。外贸网站建设做到表单这一层，拼的已经不是设计稿，是谁肯把每个字段的说明写清楚。
顺手把 autocomplete 属性填对（email、tel、organization、country），买家手机上的浏览器就能自动带入，少打几行字。这件事在海外询盘转化上很实在——表单每多一个要动手的字段，放弃的人就多一批。自动填充省下的几秒，在独立站询盘这种低频动作里，效果比想象中明显。
听得懂：PDF 规格书、产品视频、参数表
规格书这一块，外贸站的问题特别典型：客户发来的 PDF 是扫描件，一页一张图。站上挂上去，买家搜不到里面的型号，读屏软件念不出一个字，手机上还得放大才看得清。改成文字版 PDF，工作量不小，但收益是双向的——搜索引擎也能读到里面的型号，Google SEO 上等于多了一批可被检索的关键词。文件名顺手规范掉，别再用「说明书最终版2.pdf」。一份能被搜到的规格书，在 Google SEO 上抵得上一篇小文章，因为它带的是买家真在搜的型号。
产品视频没字幕是另一个漏。海外买家在办公室、在展会现场打开视频，多半是静音的，前五秒没字幕就直接关掉。加一版英文字幕，比重新拍一条便宜得多。参数如果只存在于视频和图片里，也建议另做一份 HTML 表格，能被复制、能被搜索、能被读屏念出来。这块跟外贸网站优化本来就是一路活：把买家会搜的词放进能被解析的结构里，而不是锁死在图片像素里。
十分钟自查清单，照这个顺序走
不用等改版，今天就能查一遍，顺序按性价比排。外贸独立站的页面多，先拿流量最高的那三个页面试手，别一上来就全站铺开。
浏览器缩放到 200%，看首页、一个产品页、询盘页有没有错位、有没有内容被切掉；拔掉鼠标按 Tab，从首页走到提交按钮，看焦点是否看得见、是否走得通；关掉图片加载（开发者工具里能模拟），看剩下的文字能不能读懂这页在卖什么；用 Lighthouse 跑一次无障碍项，它会把对比度不足、缺 label、缺 alt 的地方逐条列出来；手机开弱网模式打开产品页，看多长时间能出现可读内容；把 Cookie 弹窗和询盘浮层各点开一次，试 Esc 和 Tab。
这六步走完，你手里会有一张自己的问题清单。不用追求 Lighthouse 满分——那个分数里有相当一部分是给体验锦上添花的项，先修的是挡路的那几类：表单标签、对比度、键盘可达、浮层焦点。剩下的可以排进下次改版的活里。这几类修完，海外询盘转化上未必立刻见变化，但「你们网站打不开」这类邮件会少。
谁来做，做多久
新站做无障碍是顺手的：模板阶段把 label、alt 规则、焦点样式、对比度定下来，后面每加一个页面都自动带着，几乎不增加工期。这也解释了它为什么总和 Google SEO 一起做——两者都要动模板层和内容层。老站是体力活，得逐页翻，产品多的时候尤其费时间，但也是能分批做的——先做导航、产品详情、询盘表单这三类高频页，其余按月排。郑州外贸建站的老客户里，产品线长的那几家就是这么推的，一轮做一类，分几次扫完。
河南卫民信息科技有限公司做外贸独立站建设，技术团队从 2010 年做到现在，办公室在郑州市中原区陇海西路 98 号院 5 号楼 805 室，电话 400-671-2014、18569914411。我们交付外贸站时，无障碍这几项是跟着页面一起过一遍的：表单标签、图片 alt 规则、焦点样式、对比度、字幕位。老客户走年度托管的，改版或上新页面时顺手复查，不会单独收一笔「无障碍改造费」——它本来就在该做的事里。郑州外贸建站的项目做到第三年的几家，这套检查还在用，只是每次都更快了。
多语言网站要多留一道心：德语、西语、阿语版本的 label 和 alt 常常是机器翻的，翻出来的词比英文长一截，按钮直接被撑变形；阿拉伯语是右到左排版，焦点顺序和图标方向都要跟着调。这类问题在英文版上完全看不出来，得挨个语言版本走一遍。语言一多，样式复用和文案长度这两件事最容易互相打架。
最后
无障碍这件事有个特点：做完之后不会有人专门夸你。没有客户会因为你的表单有 label 而下单，也不会因为 alt 写得好而多问一句。但反过来，买家把字号调大、把键盘拿出来、把屏幕亮度调低、在车间里戴着耳机点开视频的时候，你的站是接得住还是散架，他心里有数，只是不会告诉你。海外询盘转化这种东西，从来不是某一处改得多漂亮换来的，是这些地方都没给他添麻烦。
外贸网站优化做到后面，拼的常常不是谁多写了几篇关键词文章，而是这些不出声的地方。Google SEO 能把人带来，独立站询盘能不能落成，往往取决于买家在那些没人留意的瞬间有没有被绊住。多语言网站、字幕、表格、焦点框，听着都不像能带来订单的东西——它们本来就是让订单不掉在地上的东西。外贸网站建设做到第十六年，见得多的一句总结是：把该做的做完，剩下的交给买家判断。