怎么在网页规划中树立杰出的视觉层次结构?

发布时间 2018年09月05日 17:55    编辑:landyliao    来源:柳州蜂锐科技 嘉人网 » 潮流

视觉层次结构关于杰出的网站规划至关重要。这是使你的网站有用地完成你的方针的要害准则之一。

视觉层次结构背面有许多理论。这是十分重要的,许多的研讨和尽力都被投入到了解它的运作办法和原因。有用地了解它能够协助你更好地运用它。

一、规划是一种沟通办法

规划是视觉传达的一种办法。它是经过视觉前言将主意传达给别人。这适用于一切办法的规划。特别关于像网页规划,以及信息产业的规划学院来说更是如此。

巨大的信息块不能很好地沟通,由于人们实际上是视觉考虑者。咱们不只仅处理数据。人们不只仅看到事物。相反,人类依据“视觉联络”来安排他们所看到的事物。

二、视觉层级结构的上升

为什么咱们在联络上看到的是一项研讨。人类学家认为,这是打猎-收集前史的遗址,协助咱们的远古先人生计下来。

一种有用的,不那么学术性的办法是,它仅仅咱们大脑了解信息的办法。咱们将相似的元素组合在一起,并将它们安排成咱们能够简略运用的有含义的形式。

不论你怎么看待人类大脑所运用的视觉层次结构,它是咱们怎么安排信息和运用它传达信息的一种十分有用的办法。

三、视觉层次的东西

现在你了解了视觉层次结构是一个有用的信息沟通东西,作为网页规划师,你怎么创立它?

关于视觉层次的东西很简略,也很容易学。你所需求做的就是弄清楚怎么运用它们。

四、巨细

更大的物体实质存在的含义是期望得到更多的留意。他们要求人们更多地重视他们。在视觉层次上,观众的眼睛天然会被招引到更大的物体上。

这是你能够用于视觉安排的最强壮的东西之一。相关巨细与重要性。你最大的元素一般是你最重要的,而最小的元素一般是最不重要的。

五、颜色

颜色既是一种安排东西,也是一种为你的网页规划增加特性的办法。斗胆和对比色需求招引受众的留意力以及焦点。

这是用于按钮和超链接的最好办法。作为一种增加特性的东西,颜色能够用更凌乱的办法运用。

风趣的是,艳丽的颜色能够使页面变得令人兴奋,而偏冷色系的颜色能发明一种舒缓的感觉。因而,颜色是十分重要的。它能够传达一个品牌(如百事可乐的蓝色、麦当劳的黄色),或许能够作为象征含义(比方,赤色给人的感觉是充溢热情)。你乃至能够将颜色作为一种办法,来对视觉层次中的信息进行分类。

六、字体

在创立视觉层次结构时,挑选适宜的字体是十分重要的。不只仅是字体自身重要,而是你怎么运用它。你运用的字重、风格以及你放置的地址相同重要。

要安排重要的作业,测验运用各种字体的巨细和字重。斜体字在某些情况下也能起到必定的效果。

你能够在你的站点上创立一个字体层次结构,它有各种巨细、权重和距离的文本。你在网站上运用单一字体并不重要。

经过运用它的巨细和字重的改变,你不只要把留意力招引到更重要的元素上,并且要发明出一种全体的构图,以便于访问者阅览和了解。

七、留白

在一切这些细心运用视觉层次结构的过程中,保证有留白。你需求给你的内容空间“呼吸”。

负空间是视觉规划的一个重要组成部分,它的界说和对空间的活跃运用相同重要。

留白空间一般被界说为“页面之间的空间”,尽管如此,这个额定的空间并不总是白色的,这导致了更多的人把它称为“负空间”。

留白空间实质上让你决议了你正在构建的网站的哪些特定功用应该锋芒毕露。由于这种欢迎类型的布局,访客将更有可能在网站上逗留更长的时刻。

留白一起也为眼睛供给了歇息,突出了重要的元素。太多的拥堵和凌乱会让访客脱离,由于他们无法了解什么是真实重要的。

八、人类的眼睛及扫描形式

人类的眼睛以可猜测的办法作业。他们会主动被招引到特定的爱好点。其间一些依赖于个人,但大多数人都遵从特定的、可猜测的趋势看待一切事物,包含网站。

1.“F”形式

这是大多数人在像博客这样的重文本网站上运用的扫描形式。

读者首要扫描页面左边的竖线,在阶段的前几句中寻觅要害词或其他爱好点。

一旦读者发现了风趣的东西,他或她就会开端在水平线上阅览文本。全体形式相似于字母“F”(或“E”)。

2.“Z”形式

这种扫描形式用于不以文本为中心的页面。读者首要在页面顶部扫描一条水平线。这一般是由于菜单栏,但它也是从左到右阅览的习气。

一旦眼睛抵达水平线的结尾,它就会向下移动,向左移动,另一个从左到右阅览习气,然后重新开端。图画相似于字母“Z”。

这是运用站点的可视化层次结构的一个有用的形式。它处理了许多根本的站点规划要求:行为呼唤,视觉层次以及品牌。

在这种情况下,简略是一个首要的优先级,而行为呼唤是页面的首要意图。它给更简略的网站带来了一种次序感。但是,凌乱的内容并不能很好地处理“Z”形式,而“F”形式可能是更好的挑选。

以下是一些最佳实践:

将你的布景分隔,以便查看器的视觉保持在视觉形式结构内。网站logo在左上角看起来很好,在它们能够当即看到的当地。在“Z”形式下,一个颜色丰厚的二次CTA能够为用户供给一个有用的导游。页面中心的图片滑块协助以“Z”形式视觉途径的顶部和底部分隔。在页面的左边增加图标,引导人们进行行为呼唤。视觉形式应该在你的首要的行为呼唤中完毕。

了解视觉形式和人类眼睛的天然运动能够协助你把网站以最佳优势进行规划。当你知道用户会寻觅什么,你能够安排信息,这样它就能招引他们的留意力,引导他们去你想去的当地。

结语

视觉层次结构是网页规划的重要组成部分。了解它是怎么作业的,能够让你尽可能有用地创立一个站点。

它供给了安排内容的指导方针。回想下你看过的一些好的网站规划,看看他们是怎么用视觉层次结构来有用地传达他们的信息的。

「这10篇经历干货能让你的规划称心如意!」

01. 超全面总结!常见的11个查找框规划过错

02. 怎么规划出优异的网站?这7个技巧能帮到你

03. 高手怎么做,才干规划出高转化率的CTA按钮?

04. 怎么驱动和变换网站流量?这儿有份超具体的攻略

05. 点评网站规划好坏的7个规范,网页规划师都该学学!

06. 怎么规划出招引访客的网站主页?看这篇文章就知道!

07. 怎么做好转化率优化(CRO)测验?把握这6个有用技巧

08. 10个要害点,通知你怎么进行简略规划及快速进步转化率

09. 一个专业的网站导航是怎么规划出来的?这份总结超全面!

10. 怎么树立一个值得信任的电子商务网站?超具体的实战总结!

版权声明:本文系蜂锐网络科技有限公司原创,如需转载,请联络咱们。未经授权,转载必究。

视觉 层次 这是
最流行的:一周精选导览
最新Trends News
热点MOST POPULAR
lv