文字排版设计:应用技巧及基本元素,你了解多少?
文字版式规划不只是挑选网页或应用界面的字体,文本的层级安排、字号大小、留白空间、色彩反差及其他视觉表现手法,也能传递品牌的独特内涵。卓越的文字版式规划必须明确有效传递信息,始终将内容的易读性作为首要考量因素。现在就为大家系统讲解文字版式规划的应用要点和实用方法。
1. 文字排版中的基本元素
在深入研究文字排版之前,我们先了解下文字排版中有哪些元素。
1.1 字体
文字的版式设计里,字体是最基础的构成部分,除了我们常用的中文和英文字形,还包括了字重、笔画粗细、形态变化等多种细节设定。
1.2 字号/字重
字体因字号而异其尺寸,因字重而异其笔画粗细。以思源黑体为例,它有六种不同字重的形态,一般标题会采用较大字号与较重字重,而正文则常配以中等字号和常规字重。
1.3 字间距/行间距
涉及的是邻近字符的间隔,段落间隔是指文本行与行之间的距离。通常情况下,标题的间隔会设置得更宽,以便于人们阅读。
2. 文字排版的设计技巧
文字排版不仅考验设计师的设计功底,还考验设计师的审美。
2.1 选择合适的字体
各种字体风格迥异,带给人的体验也千差万别。譬如黑体显得庄重,幼圆显得俏皮,毛笔字显得恢弘。因此挑选与页面设计氛围相契合的字体十分关键,通常在界面设计中常见的字体包括思源黑体、苹方字体等。
2.2 不要使用过多的字体
页面上的字体种类不宜过于繁杂,通常选用2-3种即可。字体数量过多会让页面显得过于杂乱,容易分散浏览者的注意力。需要突出显示的部分,可以在同一种字体内部调整字重,比如思源黑体就可以使用其提供的粗体或者特粗样式来强调。
2.3 预留字体的呼吸空间
文字的布局要有适当的距离,太紧凑会让人感到压抑,过于松散又会显得空洞,唯有适中的行距才能让人舒适阅读。
2.4 留白空间
空白区域称作负空间,是版面中的空白部分。文字旁边要有充分的空白,这样版面更易阅读。空白与文字的比例要恰当,空白太多会让人觉得版面空旷。
2.5 文字空间
文字间的留白涉及行与行之间以及字与字之间的距离。若行距太窄,文字会显得杂乱无章,阅读起来很吃力。调整好行距,能够显著增强文字的辨识度。
2.6 文字对齐很重要
文字排版中的对齐分为三大类型:左对齐、右对齐、居中对齐。
对齐方式有时也区分为实体对齐和表象对齐,当实体对齐导致表象上看来未对齐,这种情形下需要将其调整为表象对齐。
2.7 清晰的视觉层次
文字布局中的视觉秩序能协助读者迅速识别所需内容,这种视觉秩序的建立主要通过改变字体大小、间距和色彩的反差来完成。
2.8 字号对比
字号大小可以分为主标题、副标题、正文等等。
2.9 空间对比
文字周围的空白区域因字体而异,能增强视觉效果。在较宽敞的地方,文字更醒目,因此标题和正文常隔开距离,以强化标题的醒目程度。
2.10 颜色对比
文字的色调亦是增强视觉效果层次的关键手段,借助色彩的反差能够使书写信息更为醒目。通常主体文章的用色会稍显浅淡,以此突出主要章节。
运用前述十项方法,大体上就能实现一页文字的布局规划。布局规划完成之后,文字的可读性显著增强,借助字体色彩的区分,文章中的关键内容极易辨识,从而有效压缩了阅读者的浏览时长。
3. 文字排版的设计原则
文字布局是界面美化不可或缺的部分,必须依照界面美化的基本规范,不过它又具备自身的特点。接下来归纳了五项文字布局的规范要求。
3.1 合理的视觉对比
恰当的视觉反差能够令界面布局更为明晰宜人,并且使呈现效果更为醒目。这种视觉反差涵盖了诸多类型,例如尺寸差异、色彩差异、线条粗细差异等等。
3.2 保持标题文字简洁
不论网页的视觉呈现是追求简约还是其他风格,文字类标题都必须保持简洁明了。标题文字越是精炼,信息传递就越清晰,受众就越容易记住。设计领域流传着这样一句至理名言:绝不能让浏览者产生困惑。
3.3 文字的亲密原则
让文字的组团,关联紧密的靠在一起,关联不紧的拉开距离。
3.4 排版可扩展
网站通常会分别制作电脑版和手机版两个版本,苹果和安卓设备的屏幕清晰度不一样,文字布局必须依据不同的屏幕清晰度进行灵活调整,这样才能获得最理想的浏览体验。
3.5 排版保持一致性
完成合适的文字布局之后,必须确保所有页面的文字布局保持统一。这涉及到文字的尺寸、字体种类、色彩以及行与行之间的距离等要素,均需维持一致。这种统一性有助于提升用户的留存度,同时也有助于塑造良好的品牌形象。
4. 选择优秀的文字排版设计工具
文字排版的规范并非孤立存在,能够相互配合应用,恰当运用文字排版的设计规范,有助于改善界面效果。此外,选用一个出色的工作软件能够提升排版效率,这就是新一代设计合作平台Pixso,它提供原型、设计、交互及实现等功能,能全面提升数字化团队的合作水平。
4.1 Pixso功能超全的文字属性面板
Pixso的文字编辑选项十分完备,涉及字体类型、字符尺寸、色彩搭配、排列方式、段落距离、装饰效果、字母形态等众多细节。这些功能有助于创作者充分展现自身的艺术构思。
4.2 Pixso超多字体库
Pixso的字体库里备有大量常用字体,样式各异,门类繁多,关键在于这些文字都没有版权限制,设计师们可以安心选用。
推荐使用新一代协作设计工具Pixso
处理一个繁难的设计任务时,可以联络同僚们参与,借助云端平台开展同步设计,即时更新字体大小、轮廓样式、色彩搭配等各项参数。
常规物件,多数需要多种手段配合才能达到理想状态。Pixso内含构件替代方案、自动排布等高级设计功能,能够辅助进行界面与体验设计,并实现原型展示,从而完整达成高保真度设计目标。
在构思阶段可以预先感知用户感受,运用图像化手段和智能技术,能够增加界面互动元素,并且演示模型运行情形,复现产品整体面貌,有助于集体防止徒劳功夫,迅速增强商品主要效益。
Pixso拥有从原型到交付的全流程设计能力,上游团队通过链接即可完成发送,下游成员借助浏览器就能进行查看。它支持图片的快速提取,设计说明和编码能够在线制作并传输。