图标设计 · 图文专题 · 2026-10-29

图标设计切换阅读方向时哪些要镜像

应先看图标表达的动作,再决定是否镜像。跟随阅读顺序的返回、前进导航需要结合RTL布局调整;媒体快进、倒带等常见符号通常保持原朝向。把整套图标水平翻转,会把不同功能错误地当成同一种方向关系。

适用范围

适用于产品图标向从右到左语言界面适配的设计讨论。RTL指从右到左的文字或界面方向;LTR指从左到右。本文不提供某个框架的自动镜像代码,规则以2026年10月29日核对的Microsoft文档及明确标注的原创示例为依据。

图标设计方向对照:返回上一层箭头随LTR与RTL流程改变,媒体快进符号保持相同朝向
本站原创功能对照。上排表示导航方向,下排表示媒体惯例;不是产品截图或用户测试结果。

先把箭头写成动作句

同一根向左的箭头可能表示“返回上一页”“物体向左移动”或“倒带”。第一项与界面阅读流程相连,第二项描述空间动作,第三项使用媒体播放惯例;仅看轮廓无法判定它们是否应翻转。

制作图标清单时,给每个文件附上动作句、操作后的目标和使用位置。例如把back.svg记成“从详情返回列表”,比只标“左箭头”更能支持后续判断。这里的文件名只是教学示例。

返回箭头随流程,不等于所有图形随布局

Microsoft说明RTL界面需要适配自然的从右到左流程,同时明确指出不是所有图像和图标都应镜像,媒体快进与倒带是保持相同朝向的例子。图中的两行对照仅解释这项区别。

原创任务例:同一资料库的英文界面和阿拉伯文界面都有“返回列表”。设计者应先画出各自列表到详情的阅读路径,再选择与该路径一致的返回方向。不要把导航结论套到封面照片、品牌字标或表示现实方位的示意图上。

用成对状态检查实际含义

把两个语言方向的页面并排,分别标记点击前、动作名称、点击后页面。图标是否镜像只是其中一栏;焦点顺序、文字方向和按钮在界面中的位置需要各自核对。

对于混合文字、数字或图形的图标,优先拆开检查。背景方向改变不意味着文字也应成为镜像字。若无法给一个抽象箭头写出稳定的动作句,应先补充可见标签,而不是反复微调尖角。

交付时保存规则,而不是只交两份图

可交付一张决策表:返回列表—按阅读导航检查;媒体快进—保留媒体符号惯例;地图向西—以真实方向含义检查;品牌标志—按获准的品牌资产使用。后三项不能由第一项批量推导。

最终用有明确任务的界面走查验证,例如“从详情回到目录”和“跳过当前音频段”。本文没有执行用户测试,也不把示意图当作任何产品已通过可用性测试的证据。

操作步骤

  1. 列出图标对应的动作句与使用位置,区分阅读流程、物理方向、媒体操作和品牌内容。
  2. 为同一任务画出LTR与RTL页面路径,再判断导航图标的方向。
  3. 检查混合文字、数字、标志是否被整体翻转;必要时拆成独立元素。
  4. 把镜像决策写入组件说明,并在真实界面核对标签、操作结果与键盘焦点。

常见问答

向右的图标都要变向左吗?

不一定。方向必须结合动作解释,媒体快进与空间方向不能只按箭头外形归类。

可以直接把整页截图水平翻转当作RTL稿吗?

不宜。截图翻转也会翻转字形、照片和标志,不能证明文字方向、交互流程或组件语义正确。

没有箭头的图标就无需检查吗?

仍需检查它在布局中的位置、标签和组合关系;不镜像轮廓不等于无需适配。

图中的媒体快进规则适用于所有自定义播放器吗?

图示采用常见媒体符号惯例。自定义交互仍应明确动作并检查使用者理解,不能用图示替代实际验证。

参考依据

Microsoft:Mirroring · Microsoft · 核对日期 2026-10-29。RTL界面需考虑方向适配,但并非所有图标镜像;常见快进和倒带符号保留相同朝向。