超实用的版式设计技巧全方位总结

另外，不要用图片将文字切断，这样会损坏文字的可读性。如果在整段的文字中插入图片，那么阅读的视线就会被打断，用户往往不知应该从什么地方继续下 去。而对于图片中插入的文字，选用容易辨识的颜色是很重要的。通常最好的选择是白色或黑色。如果选用与图片同色系的颜色，就会不易辨识。同时，应该尽量将 文字放置在不影响图片效果的位置上（见图12）。

图12 图片和文字互不影响效果

文字的目的是使内容能够被读懂。在文字的排版中，易读性是需要重点考虑的问题。为了明确表现出不同内容之间的差别，最基本的处理方式就是改变文字的 字号或者颜色。对于需要重点展示的文字，可进行单独的视觉化处理。例如，在图13中，图片下方的两行文字为正文采访内容的重点导读，不仅变化了颜色，还对 其进行了斜体处理，让用户在阅读之前就能预估一下正文是不是自己感兴趣的内容，从而决定是否阅读全文。

图13 对于需要重点展示的文字进行单独的视觉化处理

如图14所示的问答形式则以icon引领，再次遵循之前提到的节奏法则，用户可以直观地了解到要阅读文章的时间成本，层级关系也一目了然。

图14 以问答形式呈现文字

而如图15所示的引号的运用，也达到了突出重点内容的效果，且增强了整体氛围的代入感。

图15 运用引号突出重点文字

即便是传递相同的信息，单纯的文字表现方式与夹杂了视觉要素的表现方式也会带给用户不同的印象。如果通过单纯的文字表现无法让读者迅速理解信息，则 可以通过视觉化的处理使内容变得易于把握。那些用文字方式表现时显得冗长的说明，一旦换成视觉化的表现方式就会马上清晰明了。图解起到了凝缩信息内容、增 加图像比重的作用。

如图16所示，将数据分别用不同的颜色以量化形式呈现，能够便于读者直观地理解其中的内容。图中对复杂的内容进行了合理整合，按照大类别逐个进行了 分析。并且运用了圆饼图、长条图、曲线图的变形，来实现其视觉传达的目的。对于通过颜色区分各部分的应用，需采用对比鲜明、同色系或对比色系的处理，以颜 色的明暗来区分其中的差别。

图16 对数据的图形化处理

如图17所示是对黑眼圈的专题描述，如果单纯用文字描述，则用户将很难理解氛围和场景。用熊猫拟人化体现，在增加了趣味性的同时，还让用户在轻松愉快的氛围中了解了所表述的内容。

图17黑眼圈专题

“DIOR迷醉东京”案例分析：一场樱花飞舞的视觉盛宴

该项目的最初需求是要有日本气息的DIOR潮流感。承载的内容为迪奥精神-2015东京大秀的独家专访，以及现场图片推送，其中包括访谈、点评、图片信息展示的功能。

了解了情境之后，如何用科学的方法进行设计呢？首先就是主题的突出，由于秀场位于日本东京，所以日式的元素必不可少。由此进行发散，提炼出关键词樱 花、折扇、禅意。因此封面气氛以大面积樱花铺底营造，主题仅对文字进行排列，以衬线体的英文与中文组合，放大所要重点突出的内容“迷醉东京”及 “DIOR”，并在保证英文识别度的基础上，对其进行切割，运用距离与节奏的方法，体现主题的主次关系。线描樱花的处理则是基于禅意对于圆满的追求，运用 点、线、面的基本组合原理，搭建视觉中心的完整性。两侧日文“DIOR”的点缀，在细节处强调日式东方的气息，不抢镜也加分。引导进度条以折扇的形状作为 引导，运用之前谈到的时间轴的引导方法，保证用户在浏览的过程中掌握阅读的进度，对自己的浏览有心理预估（见图18）。

图18 封面设计

（编辑：佛山站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!