排版对齐,这5招让你的元素更有亲密感

在工作学习中,我们许多地方都需要用到排版,一个好的排版页面就像井然有序的队伍一样让人看上去舒服。如果版面看上去差强人意,可能就是没对齐好,有序的事物,可以给人平静、安全的感觉。我们来看看这5招。

 1.让元素更亲密 

我们平常只知道对齐可以使页面看起来更舒服,其实对齐的意义是为了将页面中的相关元素更加有亲密性,彼此联系起来。

比如以上图片,元素杂乱无章摆放的话,我们很难一眼捕捉到想要的元素,但是当他们在同一条基线上对齐的时候,我们便能迅速的找到想要获取的信息。

 2.体现出对齐的力度

说起如何排版,许多人只知道页面排版的时候都会用到对齐中的「居中」、「左对齐」、「右对齐」,而如何正确地使用这三个工具使排版元素更加具有亲密性,相信有些人心中没有一个具体的定义。

比如以上的图,当我们把文字都居中对齐后,尽管这是正确的对齐方式,但每行文字元素的长短消弱了「对齐线」的强度。当我们把文案都左对齐后,却可以看出边界,尽管「对齐线」是看不出的,但这种布局明显比居中更有力度。

 3.巧用线框对齐 

当文案较少的时候,我们很多人都喜欢用边框居中文案,使页面看上去不会那么空,但边框却束缚了整个页面,给人一种受束缚的感觉,不如勇敢一些把边框改为线条,实线改为虚线,使页面变得更开放。

 4.只使用一种对齐方式 

左图:上部分使用左对齐,下部分使用居中对齐,两个元素如果没有使用同一种对齐方式,他们之间就不存在任何联系。

右图:也许有人会问这个也是使用左对齐和右对齐两种对齐方式,但其实仔细看不难发现上部分和下部分是右届对齐,这就用一条看不见的线把上下部分链接起来了。

 5.缩进的误区不要踩 

很多人在写文章的时候,为了突出小标题,喜欢把小标题居中,并且喜欢在段开头宽度缩进,但没有一条强有力的对齐线使其联系起来,咋一看,居中的小标题更像悬挂,显得非常杂乱。

不如用左对齐,使元素更有亲密感,当我们用一条对齐线,并坚持以它为基准,文案元素看起来就更加有联系感了。

总结

以上经验分享到此结束,如果对此内容感兴趣的同学可以阅读这本书籍《写给大家看的设计书》,总结的好灵感来自于这本书,总结的不好仅仅是我个人的能力有限,与此书无关。

但行好事,莫问前程,看完点个赞,谢谢大家!

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,456评论 5 477
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,370评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,337评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,583评论 1 273
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,596评论 5 365
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,572评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,936评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,595评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,850评论 1 297
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,601评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,685评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,371评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,951评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,934评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,167评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 43,636评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,411评论 2 342

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,725评论 1 92
  • HTML 5 HTML5概述 因特网上的信息是以网页的形式展示给用户的,因此网页是网络信息传递的载体。网页文件是用...
    阿啊阿吖丁阅读 3,828评论 0 0
  • 概述 在网易云课堂学习李南江老师的《从零玩转HTML5前端+跨平台开发》时,所整理的笔记。笔记内容为根据个人需求所...
    墨荀阅读 2,327评论 0 7
  • 事难人杂,不要强求! 今生是前世的果报,今生也是后世的因缘。既然一切都处在因果循环中,那何不顺其自然,随缘生活? ...
    晴致生活馆阅读 226评论 0 0
  • 我记得15年美拍刚出来没多久那会儿,我觉得新鲜就下载app拍了几个短视频,还可以在视频里添加滤镜,显得特别的小清新...
    老刘刘胖子阅读 488评论 0 0