在网页设计里的排版和配色技巧

在网页设计中，如何配色，有的时候很难去定位，那么我们到底要怎么做才能做的更好呢，那么就看下下面的一些分析，相信你会找到你所需要的。

1、根据页面风格以及产品本身的诉求确定主色；2、根据主色找配色；3、调整色彩在页面中的比例。

首先说说找主色调，关于找主色调，我个人一直觉得颜色是有一定心理暗示的，最出名的例子就是麦当劳、肯德基这类快餐店不约而同的选择了红色作为主基调，因为红色有增进食欲的效果。：红色代表热情、革命和危险；绿色代表希望、春天和环保；橙色代表活跃和快乐；紫色代表华丽、妖艳、神秘……如果有兴趣的同学，可以去找一些色彩心理学的资料稍微研究下，这里稍微提一些，仅供参考。

由于色彩本身心理暗示的作用，很多行业都有其行业色，比如商务/工业蓝、环保绿之类的，当做到某些特定行业时候，使用行业色作为主色调会是一个很保险的选择。

当然，在选择主色调的时候还有其他一些因素要考虑，比如整个站点的美术效果、需要传达的氛围/感觉以及用户观感。说到观感，有一个很多设计师都不注意的问题：通常来说，颜色纯度的颜色，从广告效果上是好的，能够一瞬间把用户的眼睛吸引过来。但是不适合长时间浏览，长时间浏览纯色的页面，会产生视觉疲劳(有人说绿色是保护眼睛的颜色，但是事实上纯绿色对眼睛的刺激也不小)；颜色灰度偏高的颜色，虽然不是很醒目，但是有利于长时间的浏览，不容易产生视觉疲劳。高调页面（整个页面调性偏白的那种），虽然看起来会有一种简约干净的感觉，但是由于显示器不同，所以在部分电脑里，亮部容易没有层次而显得单薄；而以黑色深色为主的页面，虽然整体把握比较容易，但是同样的问题，暗部可能会损失层次，另外深沉的颜色使用不好会使页面显得沉闷。所以说，多从用户的角度去考虑观感的问题，被“飞机”的概率才会降低。

确定好主色之后就是配色。配色的话，个人感觉不宜过多，对于初学者，最好别超过3种，实际情况是颜色太多不利于把握主调性，容易花。关于配色，很多时候靠经验的积累，但是也不是完全没有技巧：最简单的方法是使用LOGO上本身的颜色搭配或者VI设计时候设定的标准色，这样的颜色搭配大多应用在公司宣传性网站，属于比较偷懒的方法；第二种方法是挑选两个色相色性相近的颜色（主要颜色），再选择一个色相色性相对的颜色（辅助颜色），这样的搭配大多数情况下属于是比较合适；第三种是搭配消色。

所谓的消色，就是指黑白灰（也有说是黑白金银灰），这类颜色由于本身没有色性，所以可以说是万用搭配色。当然，说是说万用搭配色，但是也是有一些需要注意的地方：首先，由于本身没有色性，他们必须和色性比较强的颜色搭配会比较出效果；其次，消色与其他颜色搭配的时候，比例一定要控制好，尤其是灰色，灰色是一种很“高档”的颜色，但是问题是使用的过多，会使得页面灰蒙蒙没有质感。

配色确定之后，就是调配颜色比例了，关于颜色比例方面，我觉得没有什么特别好的规律，最好的方法就是做色彩小稿看效果。当然，你足够自信的话，胸有成竹也是可以的。

此外，还有一些特殊的颜色搭配：说到纯色之间的搭配，有很多人会想到“红配绿，大傻X”但是农民画当中大量的使用红配绿。却非常的有感觉，为什么呢？关于这个问题，我个人是这么感觉的（仅为个人见解），使用四至五种纯色进行搭配的时候，基本上不用考虑颜色搭配的问题，如果略微有一些压不住，用一点消色压一下就OK了。类似情况的还有粉色和灰粉色，这类颜色由于本身含有消色，且调性都比较高，所以搭配起来会显得非常的清爽。当然，只要色相、纯度、明度三个属性中有一个属性是基本相同或者接近，搭配起来基本上都不会觉得太牵强，只是相对而言之前提到的那几种搭配是比较常见的而已。

关于配色的就说这么多。最后说一下，对于配色软件之类，的确有可取之处，只是个人不建议用。配色软件是死的，人是活的，习惯使用配色软件之后，人就会产生惰性，设计也就变死了。以上说的一些东西，只是我的一些个人经验，不完全正确，仅供参考。关于配色，感觉依然还是最关键的东西，同时多看好的作品，多关注生活中的设计才是正途。

配色说完了说下排版，网页设计的排版同平面印刷的排版是一脉相承的，所以对于网页面设计排版的学习可以从平面媒体的排版设计开始，我最初接触的排版方面的专业性书籍是《英国版式设计教程【高级版】》，很多理论对我后来有深远的影响，建议想多排版有所了解的同学去看一下。当然，虽然说，平面媒体的排版经验对于网页设计的排版有所借鉴，但是由于载体的兴致不同，所以还是有一些区别的，希望大家在学习之余有自己的思考。

网页设计首先是要说整体的感觉，整个页面的风格气氛需要自上而下一脉相承。不少人做页面时候头重脚轻，头部做的很花哨，尾部就随意的来一下，虽说从实际说的确页面的头部比较重要而尾部是不是那么重要，但是作为一个作品，这样的观念还是不大可取的。所以，作为设计者，心中必须确立这样一个观点，出现在页面上的信息，都是有用的，都是有人看的，关注的人再少也不能马虎，这是对自己的设计负责，也是对观看页面的用户负责。

页面的整体感觉需要重视，但是同时网页受限于浏览器，是通过自上而下滚动浏览的。所以呈现在用户眼中的绝大多数是页面的局部。不少设计师很注意考虑页面的整体效果，却比较少考虑滚动浏览时候每个浏览器截取片段的效果。网页的排版同平面媒体的排版一样，需要注意图片文字标题等元素在页面上呈现的效果的平衡，但是网页排版更需要注意的是一个动态的平衡，即无论页面滚动到何位置，在浏览器中呈现出来的效果应该都是至少让人在视觉上“舒服”的。

网页设计排版与平面媒体排版大的区别在于：网页设计排版有很多交互性的功能和动态效果。所以排版的时候要考虑到更多的功能性需求以及动态的视觉效果。由于这么多的元素要排列在页面上，所以页面在排版的时候需要考虑的情况也多了，对页面元素排列的逻辑性要求也相对高了不少。这个时候，最简单的处理方法的就是假设：假设用户是你，你希望这个导航条在什么地方？通过什么样的方式（静态/动态？）展现你会觉得使用方便？假设你是后台的管理者，你在实际操作后台之后，会产生什么样的问题？有什么好的解决方案？……这个在用户体验当中叫做“假想用户”，是比较常用的方法。

最后要说的是，关于排版（无论是平面设计排版还是网页设计排版），最核心的成功元素是什么？是通过页面的美术效果，引导用户浏览信息，引导用户进入页面想带给用户的氛围。所以最好的设计，应该是“无设计”——请注意，“无设计”不是说没有设计，而是整个设计浑然一体让人感觉不到设计的痕迹。这样的设计不会影响用户对于信息的浏览，而且良好的排版层次会让页面的逻辑性更加明确，让用户产生良好的体验，甚至可以通过设计中的一些技巧引导用户主动去浏览页面最主要想呈现给用户的信息，只有做到这个程度才算是成功的排版。虽然说设计师最主要的工作是把页面做的漂亮，但是希望大家不要忘记自己的设计最原始的用处是什么。

本文来源于成都网站建设公司与成都网站设计制作公司-创新互联成都公司！

名称栏目：在网页设计里的排版和配色技巧
文章源于：https://www.cdcxhl.com/news37/309437.html

成都网站建设公司_创新互联，为您提供网站内链、软件开发、移动网站建设、企业建站、网站排名、外贸网站建设

广告

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联