News & Insights

阿拉伯语页面全部排错,网页前端开发的多语言适配

客户上线阿拉伯语版本,整页排版全部镜像错乱,按钮和文字方向打架。本文讲网页前端开发的多语言适配:RTL不只是左右对调,图标表单时间格式都要跟着翻,文案长度弹性和字体选择也是坑,并给出小语种验收时找母语者把关等方法,让多语言站真正可用。

阿拉伯语页面全部排错,网页前端开发的多语言适配

一位做建材出口的客户上线了阿拉伯语版本,截图发过来一看,整页乱套:文字从右往左排了,图标还停留在左边,表单标签和输入框方向打架,箭头指的全是反方向。网页前端开发做多语言时,阿拉伯语这类RTL语言是最容易翻车的部分,翻车的原因往往不是翻译,是适配没做。

RTL不是把字换成阿拉伯文

RTL是整套阅读方向的翻转:文字从右到左,布局跟着镜像,侧边栏换边,返回箭头朝右指。做对的前提是前端一开始就按逻辑属性写样式,方向相关的间距和对齐不写死左右,切换语言时整页自动翻转。半路补课的项目,翻出各种局部错位,就是老代码里写死了太多方向。表单更是重灾区:输入框内文字方向、电话号码的显示格式、必填标记的位置,都要跟着走。

文字长度是个隐形坑

另一类问题与方向无关,与长度有关:同一段话,德语比中文长三成,阿拉伯语可能更长或更短。按中文长度设计的按钮和标题栏,换语言后要么溢出、要么被截断。应对办法是布局留弹性:按钮宽度跟随内容、标题允许换行、卡片高度不写死。上线前用最长的语言版本测一遍布局,比用最短的测更能暴露问题。字体也要跟上:中文站引的字体不含阿拉伯字形,最终显示的是系统兜底字体,品牌感全无,该补的字体文件要补。

  • 数字和时间格式:中东客户习惯的日期写法和国内不同,别想当然;
  • 货币和单位:汇率切换时别只换数字不换货币符号;
  • 切换入口:语言切换器放显眼位置,用目标语言写名字,别用旗子图标猜。

那位建材客户后来重做了RTL适配,顺带把语言切换器改成目标语言显示,阿拉伯语版三个月内带来了两成的新询盘,这个市场比他想象的大。

验收交给母语者

机器翻译加程序员的检查,撑不起小语种站点的质量。预算允许的话,找一个母语者通读全站,排版问题、用词不地道、文化禁忌,一次全揪出来,费用几千块,比上线后被当地客户笑话强得多。网页前端开发的多语言适配,技术只占一半,另一半是对市场的尊重。

两条建议:有出海多语言计划的项目,立项时就告诉技术方要支持哪些语言,RTL要从第一行代码就预留,后补的代价是数倍;每种语言版本上线前都做一遍完整流程测试,从打开到提交询盘走通才算数。比格网络做过多个中东和欧洲多语言站,RTL适配的坑我们基本都趟过一遍。

分享这篇文章:

准备好开启您的数字化之旅了吗?

让我们一起打造专业、高效、可增长的企业官网

✓ 链接已复制到剪贴板
电话咨询 免费咨询 获取方案
跳转咨询表单 免费获取方案 18942912117 在线咨询