1. 首页

设计太乱?“对齐”原则肯定没学会!

什么是对齐原则对齐原则是指:「任何元素都不能在页面上随意安放,每一项都应当与页面上的某个内容存在某种视觉联系」。在四大原则中,对齐应当是最容易理解的了,因为在我们的生活中对齐几乎就是无处不在。大多数情况下,设计做得不美观,很大的原因就是在排版方面过于随意,尤其是很难或者没有意识做到对齐。

重复、对比、对齐或者亲密性是版式设计中的四大原则,各种排版方式与规则都是基于这四大原则衍生而来,而掌握这种带有指导性的设计方法,能够帮助我们在短时间内,更快更好地达成设计目标。本期给你们讲解四大原则之对齐方法。

什么是对齐原则

对齐方法是指:「任何元素都不能在页面上轻易安放,每一项都必须与页面上的某个内容存在某些视觉联系」。

在四大原则中,对齐应当是最易于理解的了,因为在我们的生活中对齐几乎就是无处不在。

设计太乱?“对齐”原则肯定没学会!

不管哪个样的环境,只要有诸多各样的事物存在,它就必须一个秩序,人类的环境极其,设计元素的环境照样那么。左图示设计元素参差不齐,画面变得杂乱无章,没有美感,影响阅读;而右下图运用合理的对齐可以带给秩序感,看上去非常细致、专业,信息传达效果更好。

设计太乱?“对齐”原则肯定没学会!

为什么要对齐?不只是是对客户视觉浏览习惯的审视,还是对页面中信息组织的界定。一方面运用对齐,符合用户的视觉惯性,降低用户阅读负担;另一方面运用不同的对齐方式,能有效组织信息,让页面规整有序、严谨美观。

文字编排对齐方式

文字编排常用的对齐方法有:左对齐、两端对齐末行左对齐、右对齐、居中对齐、两端对齐、顶对齐和底对齐等。在进行设计时要按照构图手段选择合理的对齐方法,每种对齐方式所传达的触觉体验也不一样。(对齐名称也是为了方便讲解和记忆,不一定与软件中的名称一致)

设计太乱?“对齐”原则肯定没学会!

1.左对齐

因为我们的阅读顺序大多是从左向右,所以左对齐是阅读效率最高的对齐方法,也作为了排版中最常用的一种对齐方法。

设计太乱?“对齐”原则肯定没学会!

左对齐的特点是易于导致右端留白过多,整体视觉缺失。但是这些对齐方法不破坏文字原本的起伏和韵律,能确保较好的阅读感受。还可以减少中文因短语所包括的字符数目不等而不利于左右对齐的编排问题。

设计太乱?“对齐”原则肯定没学会!

2.两端对齐末行左对齐

在进行大段的文字编排时,常会遭遇这么的状况,无论你如何拉动文本框,文字的两端都能够对齐。

设计太乱?“对齐”原则肯定没学会!

此时可以强行左右两端都对齐,最后一行右侧对齐。这是最常见的词句性文字编排方式,多借助于期刊、画册、报纸等多文字信息内容的编排。使句子文字朴实工整,让版面清晰有序而有条理,提高阅读效率。

设计太乱?“对齐”原则肯定没学会!

3.居中对齐

多用于居中对称式的版面,给人朴实、肃穆、经典的觉得。因为大段的居中对齐文字会导致分行和阅读困难的难题,所以常见在标题、导语和长篇文字编排中。

设计太乱?“对齐”原则肯定没学会!

4.右对齐

右对齐的编排模式与人的视野移动方向相反,而且每一行起始部分的不规则增加了阅读的时间和精力,这种格式只适用于少量的文字。

设计太乱?“对齐”原则肯定没学会!

右对齐使用的频率不太高,往往会与图形、照片建立某些视觉联系,获得排版上的平衡。使用右对齐会给人一种人为干预的觉得,因此这些对齐方法会变得非常个性。

设计太乱?“对齐”原则肯定没学会!

5.两端对齐

两端对齐是指将文字通过微调间距的方法并且两端完全对齐,强制处理成四方形,这样可以达成工整细致的效果。

设计太乱?“对齐”原则肯定没学会!

6.顶对齐

顶对齐是横向排版才能用到的对齐方法,起源于近代的书简,因此采取纵向排版其实不便于阅读,但是可以构建出古典的文化气息,有着浓厚的中国味。

设计太乱?“对齐”原则肯定没学会!

7.底对齐

底对齐也使用在横向排版,每一行起始部分的不规则增加了阅读的时间和精力,是最不合适阅读的对齐方法,一般只适于少量文字或成为装饰性元素使用。

设计太乱?“对齐”原则肯定没学会!

其他对齐方式

设计太乱?“对齐”原则肯定没学会!

1.非横向和纵向对齐

排版不一定只有横向和竖向的视觉模式,也会有其它的方法,在这种视觉方向上,也要借助对齐的方法来规整设计元素。

2.倾斜对齐

设计太乱?“对齐”原则肯定没学会!

3.分散对齐

在设计经常会按照构图和空间分割使用多种对齐方法的编排组合,如下图版面中每个信息群组使用的对齐方法也不一样,可以让信息层级更清晰,信息传达效果更好。

设计太乱?“对齐”原则肯定没学会!

4.自由对齐

打破秩序,没有确立的对齐线,是提倡随性,自由灵动,具有唯美、感性的排列形式,为版面设计提供无限的或许性。

设计太乱?“对齐”原则肯定没学会!

示例操作

为了让你们加深对对齐方法的理解,提取本期文章的主要内容作为原始资料,运用对齐方法进行设计示范。

设计太乱?“对齐”原则肯定没学会!

设计太乱?“对齐”原则肯定没学会!

根据亲密性方法总结起来的规律,把版面中的文字信息进行分组,使他们各自打造一个视觉单元,建立起条理性和组织性。并根据「字间距<行间距<段间距<组间距」的规则进行亲密性修改,保证各个长度组合之间的相对性比例。

设计太乱?“对齐”原则肯定没学会!

把「标题」、「对齐原则简介」、「对齐方法」,三组信息分别进行对齐设置。

「标题」按照两端对齐的方式,调整文字宽度使得两端完全对齐,强制处理成四方形,这样可以达成工整细致的效果。并把图标改为思源宋体,与正文的思源黑体增加字体对比:

设计太乱?“对齐”原则肯定没学会!

「对齐方法简介」文字运用左对齐格式,可以保持文字原本的起伏和韵律,还能确保较好的阅读感受。另外文字较多的一段,可以采取两端对齐末行左对齐格式。使句子文字朴实工整,让版面清晰有序而有条理,提高阅读效率。

设计太乱?“对齐”原则肯定没学会!

「对齐方法」信息组使用右对齐形式,增加对齐方法的多样性。虽然每一行起始部分的不规则增加了阅读的时间和精力,但是也提高了排版的节奏感。

设计太乱?“对齐”原则肯定没学会!

把修改好的文字信息放置到版面中,并使用网格进行完善和辅助对齐,使用网格可以迅速分割版面以及抓住对齐关系,辅助我们的设计更严谨。

设计太乱?“对齐”原则肯定没学会!

设计太乱?“对齐”原则肯定没学会!

采用上期使用的孟菲斯风格元素丰富画面。给各个信息组加入伪立体效果的外框,让信息分割更确立,加入外框后画面也要依照对齐方法。

设计太乱?“对齐”原则肯定没学会!

加入小圆点只是背景肌理,并降低各类几何形状来丰富画面。增加活泼感和创意性。方案一设计完成:

设计太乱?“对齐”原则肯定没学会!

尝试使用其它对齐方法和构图方式设计另一个方案:

设计太乱?“对齐”原则肯定没学会!

加入孟菲斯风格元素丰富画面,遵循对齐方法进行排版,方案二设计完成:

设计太乱?“对齐”原则肯定没学会!

总结

视觉规范最基础的规定就是:整齐、规范、有条理。大多数状况下,设计做得不简洁,很大的缘由就是在排版方面更加轻易,尤其是很难甚至没有观念做到对齐。

无论版面的信息多少、位置如何变化,只要遵守对齐方法,保证元素间的对齐关系,就无法使版面统一、简洁、更有简练,还可以引导视觉流向,有助于信息更好传达,当然也更简洁。在进行设计时需要先把握最基本的程序化的美,才可以升华到最「随意」的原始美。

原文:艺海拾贝Design

设计太乱?“对齐”原则肯定没学会!

原创文章,作者:设计网,如若转载,请注明出处:http://www.shejiwz.com/?p=978

发表评论

邮箱地址不会被公开。 必填项已用*标注

联系我们

181-3885-0759

在线咨询:点击这里给我发消息

邮件:295310592@qq.com

工作时间:周一至周五,9:30-18:30,节假日休息