移动端文字与排版的六大原则.docx
50墨值下载
移动端文字与排版的六大原则
在印刷与桌面端
这些传统领域，我们已经有了很成熟的文字排版经验。随着移
动时代的到来，
的界面设计，加上网站越来越多地转身为响应式设计以适应多种显示
设备，这些经验很多依然有效，但因为显示设备与使用环境发生了变化，也给文字排版带
来了变化。接下来，我们就来看看由网易
设计师钟峰大大带来的有关移动端文字和排版
的原则。
大小反差
在桌面端我们可能会采用字号差异较大的文字组合，移动端屏幕较小，容纳的文字也
较少，同等的字号差异在小屏幕上的感受会被放大。
原因是我们在使用这两种设备时的观看距离不同，桌面端我们的眼睛离屏幕较远，而
在移动端则相反，因此我们应该在移动端使用较小的字号反差。
字重
不要使用
中的文本加粗，它不仅破坏字体本身的美感，还改变了文字原本的字宽
而 影响段落内文 字的 对 齐 。 合 理的 方 式 是 使 用字 体 本 身 的 字重 来 控 制 ， 比如 苹 方 、
、
等字体本身提供
、
、
等两三种甚至更
多的字重选择。
字间距
不要轻易改变字体默认的字间距，字体设计师已经充分考虑了这款字体所适合的字间
距，如果不满意可以更换字体。
颜色反差
移动设备使用环境复杂多变而不局限在室内，可能在室外，甚至暴露在强烈的阳光下
应确保文字在背景中不会识别困难，即使是色弱者也可以正常阅读。
中建议的
两者颜色反差比应该高于
!"#$
（
级），才能确保更多人及环境都可以轻松阅读 。
%
中有一个插件
&&&'(')(
可以方便的检测这个比值，你可以使用
在线检测工具
&&&'(%
。
栅格系统
小屏幕上，一些桌面端无关大雅的间距不等问题会变得突出。
&*
是网易一款精品优雅的
++
，但其文章正文界面却略有瑕疵：段落右侧与卡片
的间距明显大于左侧。造成这个问题的原因是设计时对文本框的宽度与文字大小之间在关
系考虑不周全，导致文字并不能完美地填充满文本框。
of 4
50墨值下载
【版权声明】本文为墨天轮用户原创内容，转载时必须标注文档的来源（墨天轮），文档链接，文档作者等基本信息，否则作者和墨天轮有权追究责任。如果您发现墨天轮中有涉嫌抄袭或者侵权的内容，欢迎发送邮件至：contact@modb.pro进行举报，并提供相关证据，一经查实，墨天轮将立刻删除相关内容。
下载排行榜
评论