产品出海不是说把APP界面、功能的中文换成英文就完事儿了的，还需要针对国家、语言和用户习惯、行为进行调整，只有经过这样的“本地化”才能引起目标用户的关注。

本文将从布局、动作、字体、图标和数字这五个方面，来分享我们整理的信息和经验，以及有可能遇到的潜在问题及解决方案。

我们来看一张阿拉伯Youtube网站的首页图，从中文到阿拉伯语界面上好像是做了一个镜像翻转，用户的整个引导视线是翻转的“F”。网站导航布局是从右往左，顶部的筛选控件排序也是从右往左，包括图片的标题描述等都是遵循从右向左。这就是我们说的RTL模式。

其中有些元素，例如右上角logo、中英文文字，好像还是原来的样子，只是挪了一个位置，改了一下对齐方式，这个下方会详细解释。

2. RTL原则

通过以上案例，基本就了解了阿拉伯语的一个简单原则。阿拉伯语用户进入到一个网站，首先是从页面的右上角开始，扫描顶部，然后换行再从右侧开始扫描。

从导航进入到二级页面后，后退/前进的箭头也都是需要被镜像的。

3.3. 进度条

进度条这类受时间影响的组件，它也同样遵循RTL原则，受阅读方向的改变，所以进度条、加载动画等也是同样需要镜像的。但注意，表示进度、容量等的连续数字不需要镜像翻转，如图中的“40%”。

3.5. 骨架屏

骨架屏，一种内容加载器，也是需要做RTL布局更改的，因为它的内容条是真实的阅读方向，在内容生成前会起到视觉引导的作用。

3.7. 富文本编辑器

内容编辑文档，也需要将段落的输入调整成从右往左，其中编辑器的工具栏也需要作镜像改变。注意，撤销（上一步）、重做（下一步）按钮的位置，也是需要镜像的。

3.9. 界面对齐

排版布局中，RTL需要保持一致的右对齐方式，比如表格、表单、图表等，就像我们浏览日常网站一样，一致的阅读起始线，能给用户舒适的阅读体验。

2. 跑马灯方向

因为面积有限，跑马灯是一个很好节省空间的组件。在RTL原则下，因为人的阅读方向是从右侧开始的，所以隐藏的文字需要左侧露出，其滚动方向就是从左往右的。

三、字体

1. 汉字的差异

一般情况下，阿拉伯字体比汉字高度小一点，在水平方向上会更宽一点，字体上也会更简单一点，所以占用屏幕空间多一点。

在一些普通的文本中，我们可以直接沿用原来字号的大小。但是一些按钮、标题、标签等需要强调的展示上，为了保证整个视觉的平衡，可以将字体稍微增大2磅，因为直接翻译后的阿拉伯语在视觉上会显得稍小，稍微增大能够有效弥补带来的视觉差异。

3. 不要放大字间距

阿拉伯语字词之间是相互连接起来的，不要随意增加它们的间距，否则会把一些字母断开，从而带来一些语言上的歧义。

指向性箭头图标需要镜像。这类比较简单，它在原本LTR界面就有方向性，在RTL布局中，受整个界面阅读的方向改变，也是需要作翻转的。

2. 模拟现实的普通图标无需镜像

这类图标主要是模拟现实物体的，它不受阅读方向这个因素影响，比如一些生活用品图标，阿拉伯语人和我们看到的是一样的，不过也有一些图标会引起误解，下面着重说明。

2.1. 右手图标

无论文本方向如何改变，阿拉伯人也是习惯用右手，常见的有钢笔、放大镜、杯子等。

2.3. 媒体播放图标

这类图标一般指视频、音频的播放，包括进度条都不需要镜像的，因为这里的进度及指向性代表播放和进度的方向，而不是阅读方向。

3. 反斜线无需镜像

表示禁止的反斜线不需要翻转，因为这是社会约定俗成的规定，它表示禁止含义。常见的有静音、禁飞等图标。但是注意斜线下喇叭这类有方向感的图标，还是建议进行镜像。

2. 分离的数字需要镜像处理

这类数字其在信息传达上其实和文本是一样的，需要遵循RTL原则，例如步骤条，评分等控件，这种带有数字的控件需要作出调整，以匹配整个方向的阅读体验。

2. 建议选择5个测试样本数量

因为这个数量的测试样例，至少能够发现系统中80%以上的问题，有兴趣的同学可以去查看《用户体验度量》这本书有详细介绍，当然样本更多会更好，只不过它的边际收益会逐渐降低。

总结

以上就是阿拉伯语界面设计所要遵守的RTL原则，遵守这些准则可以帮助大家避免一些错误，并给本地用户带来更好的使用体验。此外在本土化的设计过程当中，需要有保持一种宽容友好的态度，而不是一种傲慢，因为我们所提供的产品和服务，是理应要尊重当地人文和风俗习惯的。

参考文献

《Apple Design》Right to left | Apple Developer Documentation

《Apple Design for Arabic》Design for Arabic – WWDC22 – Videos – Apple Developer

《Material Design》https://m2.material.io/design/usability/bidirectionality.html

《Right-to-Left Development: Tips and Tricks》Right-to-Left Development: Tips and Tricks

专栏作家

小高杂谈，人人都是产品经理专栏作家。10年+专注在To B产品设计，擅长SaaS产品从0到1、1到N产品规划及体验设计，关注电商零售、供应链及新领域AI探索。

本文原创发布于人人都是产品经理，未经许可，禁止转载

题图来自 Unsplash，基于CC0协议

该文观点仅代表作者本人，人人都是产品经理平台仅提供信息存储空间服务。