杭州UI设计学习|定义文字间距
文字是UI规划中非常重要的信息元素,尽管大多数规划师对文字的特点比较了解,但在真实规划中总会因其他信息的搅扰不能合理运用,与上线后的视觉效果预期相差甚大。文字的各种距离处理看似简单,但实践上有许多因素要考虑,例如字距离、行高、阶段等,下面带大家一起了解。
1.字符距离
字符距离一般都是规划工具的默认数值,无需调整。当碰到多行文字需求避开头尾的标点符号时,运用工具中的避头尾功用即可自动调整字距离,如无此功用,则需手动调整,这儿并没有所谓的技巧与办法,头尾避开标点符号即可。
另外,在规划卡片、瓷片区的标题时,有时需求通过调整字符距离来提高界面的舒适度,距离数值自行界说,但相同层级的内容标题字距离必定要保持一致。
2.文字行高
行高是指上边框+下边框+字号的高度之和,这儿首要针对多行文本。在平面规划中,行高没有必定的标准,如无特别需求,运用体系默认的行高即可。
在UI规划中,文字会有5~6个不同的等级,为便于用户阅读,一般会设定行高标准,尤其是新闻资讯类型的应用本身就以文字内容为主,不同的行高对文字的易读性会发生较大的影响。

文字行高一般会设定为字号的1.2~1.5倍,详细值跟字号有很大联系,文字越小,行高就越大。例如,我们能够设定字号32px为中间值(非绝对),小于或等于32的字体、行高为字号的1.5倍,大于32的为1.2倍。另外,也能够直接将一切行高固定在字号的1.5倍,不难发现,字体越大其折行的概率就越低,试想一下,假如将48px的文字折成几行,界面还能剩余多少空间?
3.文字阶段
文本阶段距离的重要性在移动UI界面中并不明显,更多体现在网页规划中。需求侧重纠正一点的是,部分规划师在设置段距离时习气性的多敲一次回车键,这种方法并不可取,会造成距离过大、内容脱节。
如有需求,必定要手动设置段距离,这儿没有固定的数值和规律,视觉舒适即可。笔者习气将段距离设定为字号的0.5倍,例如字号为30、段距离为15,字号为40、段距离为20,仅供参考。