网页设计由许多不同的元素组成,每个元素都有不同的重要程度和一些特殊的要求。一些元素是共享的,而另一些是不相关的。难点在于能够传达视觉美感和效果。这就是网页设计中的比较原则。
差异来自于两个或两个以上的元素,设计师可以直接创造视觉趣味让用户关注。但是想象一下,如果网页上的所有元素都具有相同的样式和外观比例。没有架构,没有等级和主从之分。网站的内容在阅读中几乎很难消化。这是网页设计的一个重要组成部分,归功于对比原则。
在这篇文章中,我们将看到如何通过比较来实现颜色、大小和对齐这三个差异所导致的设计。
色对比度
从原理上讲,颜色并不局限于对比色,它可以极大地帮助用户从网页元素中区分彼此。
几乎所有的网页设计都有一个页眉、一个内容区和一个页脚。这是三个完全不同的区域,应该有明显的视觉区隔。在背景中使用对比色是实现这一目标的好方法。
在这里你会看到教会传媒集团的网站就是一个很好的例子。并且页眉页脚的背景颜色是深色,而内容方面是白色。这清楚地显示了不同的内容,甚至比其他更重要的领域。如果再看另一个层次衬托的内容区,“特色项目”区的背景是浅蓝色的。即使这方面的对比和下面有点出入,但还是感觉两者有联系。
下方另一个网站,有独特的布局和特殊的配色方。他用一金黄色的对比色,创造垂直选单,其余的主要是棕色的设计。
下面另一个网站,布局独特,配色特别。他用金色的对比色创造了一个垂直的菜单,其余的主要是棕色的设计。
颜色也可以用来在文章上的对比。 下方案例创造出以不同的颜色来区分层次的标题、副标题和段落内文。对于部落格的风格编排,建立对比后标题和正文是非常重要的。它可以帮助浏览者在向下捲动的页面中很容易地看到文章开始和结束。
颜色也可以用于文章中的对比。以下案例用不同的颜色创建标题、副标题和段落文本,以区分不同的级别。对于博客的风格安排来说,在标题和正文之间建立对比是非常重要的。它可以帮助访问者在向下滚动的页面中轻松地看到文章的开头和结尾。
对比度大小
另一种方法是使用不同大小的元素来设计网页。
当网页设计不依赖于颜色时,建立大小和尺寸的对比就变得非常重要。下面的网站有最小的配色方案和大量的排版。因此,为了在层次结构中建立三列,设计者使用了更大的宽度,中间一列& # 8211;左右的两倍多。这清楚地表明这个专栏是这个页面上最重要的一个。
正如颜色对比可应用于印刷标题的建立,所以可大可小,大标题是可以以一个极大的方式来建立层次结构。下方的网站,使用的大标题来抓住浏览者的注意力,吸引他们继续阅读更多较小的下文。
就像色彩对比可以应用于印刷标题的建立一样,它可以是大的,也可以是小的,标题可以很好地用来建立层次结构。下面的网站使用标题来吸引访问者的注意力,吸引他们继续阅读下面更多更小的文章。
对比
制作一个高质量的网页,精心设计的对齐是重要的一环,有序的排列会让它看起来很好看。这就是为什么使用不同的排列方式可以创造视觉对比感的小技巧,但也需要慎用。如果运用得当,可以营造出极佳的块差感。
在下面网站的左下角使用一个带有大标题内容块的框。与大尺寸的标题,这创造了一个很好的对比。如果要用这个对齐差,一定要做成大块。否则,这看起来像是一个设计不当的错误。
中间段落有一篇很大的纯文本文章,使得文本难以阅读。但是,不要害怕在左对齐的段落中间混合标题。这是另一种通过使用不同的对齐方式来创造对比的好方法。结合好的衬线字体,也能让你的版面看起来很经典。
下面的网站使用的是居中的标题,每段的内容框左对齐。因为标题的字体大小并不比段落大多少,这有助于设置标题分隔。
下面的网站是另一个很好的例子,把标题放在段落的左边。
现在和过去不一样。
在设计中学习和创造适当的数量对比是一种掌握任何其他原则的设计。有才华的设计师需要练习并花时间学习,看看他们如何在设计中使用对比。记住,对比是发散的。如果两个元素性质不同,就要确认自己做出的视觉差异非常明显。
本文来自投稿,不代表重蔚自留地立场,如若转载,请注明出处https://www.cwhello.com/85542.html
如有侵犯您的合法权益请发邮件951076433@qq.com联系删除