图片与文字如何搭配得漂亮（收集整理）

图片与文字如何搭配得漂亮

 

在设计时往往会出现设计过度的现象。更好的方式就是象一个懒人的思维一样，图片放在这里，文字放在那里，搞定！

关键是让每一个元素都简单清晰，让两者的互相影响减至最低。

 

如下例子：

                                               

这是一家室内家居专业摄影工作室的册子封面，修改前的设计是一种吃力的设计。

设计师选择了毫不相关的字体及颜色，然后又加上背景及线条，希望使其成为一个有机的整体。

其实，设计没必要搞得这么复杂！

修改后的设计，文字内容并没有改变，但整个版面分成两个区域，图片及文字各占据一个，出来的效果就是漂亮、干净、整洁。

 

吃力的设计：

每一步似乎都有理有据，设计师也将协调、对比、风格一致这些理论紧记于心，但老实说，出来的效果并不理想，从视觉上说也不吸引。

为什么？因为设计师是事先想好了某种风格，然后强加在版面上，但偏偏主题元素又与这种设想的风格不一致，强加未遂。
      我们再来总结一下这个设计：

在这个设计中，设计师主要采用了Round Bauhaus Demi字体，这种字体是一种有趣新奇的字体——处处呈现一种圆弧的感觉。

然而，为了展现这种字体圆形的特点，我们需要将字体显得比较大，字母间距紧密，并且是要小写字母（上图），但问题是，设计师在设定介绍文字时，将其全部设为大写——这个时候，字体的直线感压抑了圆弧感，而且下面的文字尺寸又很小，其文字块边缘呈现向两边发散的直线视觉感（见上图箭头线段），这样的文字排版削弱了字体特有的风格，圆弧不见了，我们感觉到的只是凌乱的字体元素。

设计师深明在风格中细节必须呼应的重要性，所以他将一些地方设为圆角来呼应字体的特点（上图）。

问题是，它还是不够圆，出来的效果仍然是直线占支配地位。特别是上图所示的，我们可以观察到，这里显得非常局促，读者在观看时，看得的并不是一个整体，而是还得仔细区别你这细小的区域——竟然有4个步骤让读者去练眼力！毫无必要的设计。

好的设计思路：

修改后的设计，图片异常抢眼，元素与版面风格配合，名称的文字同样醒目张扬，出来的效果漂亮清晰，为什么这种简简单单的设计手法却更能发挥作用？

通过大小及色值来区分：

精心设计的文字包含了四个视觉引导。

从位置来说，呈现由上至下的引导；

从字体尺寸来说，是由大至小的引导；

从字体样式来说，是由粗至细的引导；

从颜色明暗来说，是由暗到亮的引导。

这种特点在这个设计中发挥重要的作用，你的眼睛很自然的由一个元素去到下一个元素，毫无阻碍。

 

介绍文字采用全大写，字母间距及行距都设得非常紧密（小写字母很难呈现这种紧缩的排列），形成了很短的文字行。

文字整体呈现一种精细、垂直的视觉特点。文字放在左边，使右边留出较大的白色区域，这个区域呈现视觉张力，让人的眼睛不由自主地移到文字上来。
  变化：
懒人就算面对一个系列的设计，也是气定神闲，以不变应万变，谈笑间就能出色完成任务！

 

论上下左右，怎么放都让人满意。因为图片及元素都自成一体，互不干扰，文字放在上面， 效果与放在下面一样出色。

水平放置，同样显得优雅精美。其

实这是颜色的功劳，不同的图片要用不同的颜色，文字颜色取自于图片中，这样文字与图片既分离，但又有联系，整体总是显得和谐一致。   

当然，还要记住视觉引导：

名称要重点强调，而其它的字体则低调处理。

上面几个修改后的字体及颜色是我们自由选择的，如果客户就认定最初的那种字体及绿色他最喜欢，认为最能体现室内装修的风格，非得要用回原来的那种字体及绿色。怎么办？不用一头撞墙，认为自己如果不是有其它的人生际遇否则一早就成为一个艺术家的客户大有人在，反正我们一样应付自如：

仍然保留简洁的构图，版面仍然是图片及文字各就各位；
·我们采用原来的字体，但正如我们在上面所分析的，我们会采用小写字母（就算是第一个字母也是小写），并且采用细体，这样的修整，能使包豪斯的字体风格得到最大程度的体现，文字呈现更丰富的特色。
    保留字体引导的特性：

仍然采用上至下，大至小，暗到亮。在这个设计中，字母不需要粗细变化。

保留对齐特性：包豪斯这种字体结构决定了你很难将它们的字母紧缩排列，所以也意味着我们很难象上面一样，将文字整体设置成一个具有强烈视觉效果的列状区域。

我们需要随机应变：调整成右对齐，将名称的尺寸尽量拉大，然后将字母g突出右边的空白区域，起到强调的作用。

作用是让文字整体搭配得更密切（想象一下，如果g不突出来，名称与下方的文字会显得很松散），当然，也使版面更活。
·加深绿色：加深绿色的作用是减少与红色形成过于强烈的对比，现在红色及绿色的份量大概平等，起到恰当的互补关系，而没有出现谁要控制谁的现象。