下面小编给大家整理的《写给大家看的设计书》阅读笔记之对比原则网页设计(共含5篇),欢迎阅读!同时,但愿您也能像本文投稿人“漳州包子”一样,积极向本站投稿分享好文章。
假如一个页面中的文本采用的都是同样的字体、同样的字号、同样的颜色,做为读者的你能轻易的区分出哪里是标题,哪里是正文内容吗?所以通常情况下,设计师会对标题采用加大字号、加粗字体、改变字体、更换颜色等方式进行处理以使其区别于正文内容,
这就是对比原则的一个表现。
没有对比的页面,在读者的眼里就像是平静的海面,视线可及之处没有一个焦点;当出现了对比,突出了视觉重点,也即意义着平静的海面上有个小岛之类的可以吸引住视觉焦点。
对比要强烈!这是书中一直强调的一个观点,其本意应该是通过视觉上的强烈差异化来增强页面的效果,以及强调元素之间的差异性,
可是这个强烈依然涉及到一个度的问题,过于强烈的对比,很有可能导致读者对于在页面中处于对比弱的那些元素的忽视。
纸面及网页这两种载体有着各自的局限性,在对比的处理上,网页所受到的局限性会更大。比如在字体的对比上,这一点尤其是在中文网页上,利用字体进行对比处理的局限性相当之大,因为系统默认带有的中文字体不多,所以很多时候在中文网页上对于文本的对比处理依然是在字号、加粗以及颜色上面。
对比元素可以做为重复元素来使用,而与亲密性原则对元素的归类组织类似,对比原则除了可以增强视觉效果外,同样有助于信息的组织。
亲密性、对齐、重复、对比,这是四个相辅相成的设计原则,单一的处理方式并不能给设计带来多大的改观,但当同时应用这四个原则的时候,虽然不可能说让设计变得非常精美,起码也可以让读者在扫视后快速正确的获取到设计中所想表达的内容。
本文来自:www.prower.cn/interaction/1516
如果说亲密性原则是对元素的归类组合,是将元素之间逻辑理解上的差异在视觉上表现出来,是属于信息分类的话,那么对齐原则即是在视觉上串起这些差异化元素组合之间的那根线,即是保证元素之间的统一性,
虽然亲密性原则说的是在逻辑理解上没有关系的元素组合之间应该以更远的距离表现出来,但对于同一个页面内的元素组合而言,它们都是围绕着同一个主题核心的,它们的差异性在逻辑上只是同一个主题的不同属性而已,所以需要一种方式,让页面中的所有元素看上去统一、有联系而且彼此相关,将这些不同元素之间的关联在视觉上表达出来。
这种方式,即是对齐。
对齐的方式可分为左对齐、右对齐、居中对齐以及两端对齐。虽然对齐的方式有多种,但并不意味着可以在一个页面中使用多种对齐方式,那样只会让页面中的元素显得凌乱,而在页面中只使用一种对齐方式将会使页面统一而有条理,
在这四种对齐方式里,左对齐或是右对齐是最经常被使用到的,而对于有一定行长的文本而言,两端对齐也是一个好的方式,而居中对齐则是四种对齐方式中最不推荐使用的对齐方式。因为对于读者而言,居中对齐可能导致视线的跳跃性太大,尤其是当页面中存在大量文本,那简直就是一种灾难。
在明白对齐的规则之后,可以试着有意识的去打破这个规则,然而即使是打破对齐规则的设计,在更大的范围之内依然是遵循着对齐原则的。
从上面这个图中可以看出,那一小段引用的文本,虽然在页面的元素之间是打破了对齐规则的,但是其仍然与标题是左对齐的。
对于打破对齐规则的设计的好坏,关键在于其在对齐性上所针对的范围。
购买链接:写给大家看的设计书(第3版)
本文来自:www.prower.cn/interaction/1508
也许光从字面上来说,版式设计中的“亲密性”似乎不太好理解,正常的情况下,我们都会把“亲密性”理解为人与人之间的关系的一种表现,事实上在版式设计中的“亲密性”的确也有类似人与人之间的关系的意思,
也正是印证了那句话——物以类聚,人以群分!
“亲密性”的原则即是将逻辑上存在关联的元素排列组合在一起,使其被看作是一个密切相关的整体,而不是一堆杂乱无章的元素。
从书中所给的例子,可以看出版式设计中的“亲密性”实际上是对信息的分类整理。即是通过这个“亲密性”原则,对页面中出现的杂乱无章的元素重新组合,使其有一个清晰明了的结构,可以让读者在最短的时间内获取页面中的正确的内容,
进行“亲密性”原则设计的第一步,即是对元素的归类组合,将页面中所需要出现的元素按照某种逻辑进行归类划分,对于同一组合内的元素在物理位置上赋予其更近的距离,而不同组合之间的物理位置显然要更远。
这也是页面留白设计的一个核心。
然而对于一个页面的设计来说,仅仅只是依靠“亲密性”原则并不能解决问题,除了“亲密性”之外,在页面的设计中还需要使用到对齐、对比、重复等原则,“亲密性”只是版式设计的第一步,更多的意义是在于对元素的组织性上。
购买链接:写给大家看的设计书(第3版)
本文来自:www.prower.cn/interaction/1502
做设计的时候,如何配色是经常让人头痛的问题,尽管很多时候,很多人都说对于色彩的掌握更多的是靠感觉,但是不得不说,感觉也是要有依据的,所以颜色色轮表实及家中必备的设计良药!
友情提醒:此图压缩后颜色值有误差,只为演示用,请勿以此为准!
首先需要了解是关于颜色的一些基本知识,当然本日志讲的也尽是这些基本知识,高深的等我学会了再告诉你们!
图片中的标注为“A”的即是三原色,也即是红色、黄色、蓝色,这三种颜色是无法通过其他颜色的混合来创建的。而使用这三种颜色的任意两种等量混合则可以创建出三间色(B),比如红色与蓝色的混合得到紫色、黄色与红色的混合得到橙色、蓝色与黄色的混合得到绿色。任一三原色与其相临的三间色的组合成创建出第三色(C)。
在色轮表上,相对的两个颜色即组成互补色,由于互补色中的两个颜色是对立的,所以使用其中的一种为主色,另一种颜色则用来做为强调色,可以形成比较鲜明的对比。
而在色轮表上,彼此等距的三种颜色则形成三色组,比如三原色形成的三色组称之为基色三色组,而三间色形成的三色组则称之为间色三色组,
而另一种形式的分裂互补三色组则是由某个颜色与其互补色两边的颜色组成的。
色轮表上彼此相临的颜色组成类似色,不管这些相临的颜色是两种还是两种以上,他们都有相同的基础色。
对于一个设计中的颜色来说,仅仅是依靠这些基本的色调是不行的,设计中有明暗的表现,所以也就有了亮色与暗色。亮色即是向色调中增加白色,同理暗色即是向色调中增加黑色。如色轮表上所显示的,暗色的最终即为黑色,而亮色最后即是白色。
由一种色调及其相应的多种暗色与亮色的组合即称为单色组合。
在单色组合中,如果暗色或是亮色过于接近的话,就会导致画面的模糊不清晰,比如在浅灰色的背景上写上白色的字时,字体会变得模糊不清。其实这不仅是在单色组合中才会出现,这是由于色质太过于接近导致对比过于微弱而引起的。色质即是指某种颜色的特定明暗度、深浅度或是色调。
就像人类有男人跟女人之分一样,颜色也有暖色与冷色之分。暖色即意味着其中包含红色或是黄色,冷色则是其中包含蓝色。对于同等程度的强调意义来说,暖色只需要一点即可达到,而冷色则往往需要更大面积的展示。这在一定程度上与暖色是趋进型的,而冷色是后退型的相关。
本文来自:www.prower.cn/interaction/1531
《写给大家看的设计书》是一本普及性的设计入门书籍,它非常适合非设计专业的人员来阅读,书中没有晦涩难懂的术语,读起来很舒畅,所举的例子也很简单明了,能够非常贴切地说明了问题,
有些东西,对于我这样自学的人来说,虽然也知道应用,可是总是一个经验使然,而对原理不甚了解。看过此书,算是对自己这许多年摸索的一个总结。
这本书不是为网页设计而做,而是针对平面设计,但是设计理念是相通的,基本知识是不会过时的。
在此我摘录出书中的要点,作为笔记,如果条件允许,还是买一本来看,书里的插图很值得一看。价钱也不算贵,原价39,人邮翻译出版。
以下是对基本设计原则的概述,每一个优秀的设计中都应用了这些设计原则,它们是互相关联的,只应用某一个原则的情况很少。
对比(Contrast)
在页面上增加对比能吸引人的眼球。
对比的基本思想是——要避免页面上的元素太过相似。如果元素(字体、颜色、大小、线宽、形状、空间等)不相同,那就干脆让它们截然不同。要让页面引人注目,对比通常是最重要的一个因素,正是它能使读者首先看这个页面。
要增加有意思的对比,最容易的方法就是实现字体对比,不过不要忘记,还可以利用线、颜色、元素之间的间隔、材质等形成对比。
对比的根本目的有两方面,这两方面相辅相成,无法分开。
一个目的是增强页面的效果,另一个目的是有助于信息的组织。
对比元素不能让读者很混淆,也不能错误地强调重点(即本不该是重点的元素)。
重复(Repetition)
让设计中的视觉要素在整个作品中重复出现。可以重复颜色、形状、材质、空间关系、线宽、字体、大小和图片,等等。这样一来,既能增加条理性,还可以加强统一性。例如,所有标题都设置为相同的大小和粗细。
重复的目的就是统一,并增强视觉效果,
重复有助于组织信息。这可以帮助读者浏览各个页面:它有利于将设计中单独的部分统一起来。即使在一个只有一页的文档中,重复元素也可以建立一种连续性,将文档“整个捆在一起”。
有时重复的项并不一定完全相同,而只是存在明确关联的紧密相关的对象。
重复还会为你的作品带来一种专业性和权威性。它会使读者感觉有人在负责,因为重复显然是一种经过深思熟虑的设计决策。
要避免太多地重复一个元素,重复太多会让人讨厌。要注意对比的价值。
对齐(Alignment)
任何东西都不能在页面上随意安放。每个元素都应当与页面上的另一个元素有某种视觉联系。这样能建立一种清晰、精巧而且清爽的外观。
如果页面上的一些项是对齐的,这会得到一个更内聚的单元。即使对齐的元素物理位置是彼此分离的,但在你眼里(以及在你的心里),它们之间也会有一条看不见的线把它们连在一起。
在页面上放其他项时,一定要确保每一项都与页面上的其他项存在某种对齐。如果文本行水平摆放,则按其基线对齐。如果有多个单独的文本块,则对齐其左边界或右边界。如果有图片元素,将其边界与页面的其他边界对齐。
绝对不要在页面上任意摆放元素。
在设计中,统一性是一个重要的概念。要让页面上的所有元素看上去统一、有联系而且彼此相关,需要在各个单独的元素之间存在某种视觉纽带。
对齐的根本目的是使页面统一而且有条理。
要避免在页面上混合使用多种文本对齐方式。
亲密性(Proximity)
彼此相关的项应当靠近,归组在一起。如果多个项相互之间存在很近的亲密性,它们就会成为一个视觉单元,而不是多个孤立的元素。这有助于组织信息,减少混乱,为读者提供清晰的结构。
亲密性的思想并不是说所有一切都要更靠近,其真正的含义是:如果某些元素在理解上存在关联,或者相互之间存在某种关系,那么这些元素在视觉上也应当有关联。除此之外,其他孤立的元素或元素组则不应存在亲密性。位置是否靠近可以体现出元素之间是否存在关系。
要有意识地注意您是怎样阅读的,你的视线怎样移动;从哪里开始;沿着怎样的路径;到哪里结束;读完之后,接下来看哪里?整个过程应当是一个合理的过程,有确定的开始,而且要有确定的结束。
不要仅仅因为有空白就把元素放在角落或中央。
避免一个页面上有太多孤立的元素。
本文来自:www.ddcat.net/blog/?p=1142
★ 网页设计论文
★ 网页设计心得体会
★ 网页设计求职信
★ 网页设计心得体会
★ 笔试网页设计
★ 网页设计个人心得