网页美工设计色彩搭配原则

第一篇：网页美工设计色彩搭配原则

网页美工设计色彩搭配原则

网页设计中：网页美工设计色彩搭配原则

网页美工设计中，最常用的几个颜色为蓝色、绿色、橙色，以及暗红色。

蓝色多与白、橙搭配，蓝为主调。白底，蓝标题栏，橙色按钮或ICON做点缀;蓝天白云，沉静整洁的感觉。

绿色多与白、兰两色搭配，绿为主调。白底，绿标题栏，兰色或橙色按钮或ICON做点缀，绿白相间，雅致而有生气。

橙色多与白、红搭配，橙为主调。白底，橙标题栏，暗红或桔红色按钮或ICON做点缀，橙色活泼热情，标准的商业色调，因此多用于商业网站的网页美工设计。

暗红色显得宁重、严肃、高贵，需要配黑和灰来压制刺激的红色，常以暗红为主调。黑或灰底，暗红标题栏，文字内容背景为浅灰色。

网页美工设计色彩忌讳

尽管三原色的相互搭配创造出了无数颜色，可不是所有的颜色都适用于网页美工设计，不同的颜色在搭配上也有着其中的学问，网页设计就相当于平面设计，网页设计师可以将平面设计中的审美观点套用到这上面来，所以平面设计上的审美的观点在网页设计上非常实用。

在网页美工设计中对于色彩的使用特别忌讳脏、纯、跳、花、粉这几种情形。

忌脏是指背景与文字内容对比不强烈，灰暗的背景令人沮丧!

忌纯是指艳丽的纯色对人的刺激太强烈抗议，缺乏内涵。

忌跳是指再好看的颜色，也不能脱离整体。

忌花是指要有一种主色贯穿其中，主色并不是面积最大的颜色，而是最重要，最能揭示和反映主题的颜色，就象领导者一样，虽然在人数上居少数，但起决定作用。

忌粉是指颜色浅固然显的干净，但如果对比过弱，显得苍白无力了，就象病夫一样无可救药。

另外，蓝色忌纯，绿色忌黄，红色忌艳。

一位网页美工设计的前辈说过：设计师不要“为设计而设计”。再炫酷的页面效果、再丰富的表现形式，如果偏离了以用户为中心的主线，让用户抓不住重点，感悟不到网页本身所需要体现的信息，那么，再好的画面呈现也是败笔。

第二篇：网页制作色彩搭配总结资料

通过上次会议内容，我经过多方面的学习与总结，结合我们公司目前的现状，为提高网站的吸引力，我查阅了一些相关文章以及案例，为我们公司网页宣传提供一些建议，同时也加强自己的专业知识水平。

网络发展得太快，网站设计跟不上时代的发展，互联网上很大一部分企业网站缺乏设计思想，没有个性，并没有体现企业文化。颇具设计思想、富于企业文化信息、令人流连忘返、过目难忘、能够起到营销作用的的网站让人垂涎。

随着网络的发展，网站设计人员的鉴赏力也越来越高，对于网站的设计也越来越在意，我们的网站应该不仅仅是信息的简单罗列，否则就会很容易被淹没在浩如烟海的互联网之中。我们随便在一个搜索引擎上查找某一行业的企业网站，我们都会找到成千上万条信息，试想，在这么多的网站中，没有自己企业特色、平庸无奇的网站是不会令人赶兴趣的，更不用说进入详细浏览了，我们知道，好的衣服能提高一个人的身价，好的网站也会提高一个企业的形象，一个好的网站在结构，导航，用色，内容等各个方面都是很讲究的，她可能很简单，但却给人一种吸引力，让浏览者观赏的同时了解了企业信息。

1.精心设计网页，冲击访问者的眼球

网页设计和网络的发展是建立一个网站的步骤之一。用在您的网站的设计可以决定您网站的可用性。这就是为什么一些业务流程外包公司提供网页设计和网站开发服务。您的网站的设计应该考虑你的网站的访问者，尽可能的增加网页的美感，配合网页的内容，让访问者流连忘返，这应该是一个网站设计者最核心的工作。

（一）选择合适的背景图案

对于一个网站，要争取给访问者留下美好的第一印象。而精美的背景图片便是第一印象的核心元素。而国内的网站往往交传统，死板，缺乏新意和美感，仅仅靠内容吸引顾客。但殊不知，一个好的网站有一个好的外表应该是基本要求，正如人要穿着得体一样。而访问者进入一个网站的第一印象便是背景，因此，选择一个好的背景应该是网站设计的第一步。

（二）合理搭配网站的颜色

研究人员发现，颜色将是一个很久以前的人类精神的巨大影响，通过不同的配色方案的网站，可以观察用户是否获得吸引力，尤其是新用户或在用户离开网站。而更重要的是，该网站往往是潜意识的颜色效果。按颜色可让使用者产生烦躁，幸福，快乐，苦闷等情绪。

因此，如何能通过网站的配色方案使网站更具魄力，下面是我收索寻找的一些颜色的建议：

1、使网络安全的颜色使用，即色彩，在自然界存在的，而不是非天然彩色显示屏的合成。

2、网页背景颜色和文字的对比，背景颜色为白色一般煊往往选择的字体，当然，不是绝对的，如深蓝色，灰色，是常用的网页字体的颜色。

3、避免蓝色和红色，蓝色和黄色，绿色/蓝色和红色的在同一时间抛出了这些类别的色彩。由于这是很容易让人们感到视觉疲劳

4、使用的颜色总是有团结，研究表明，5种颜色是网站的限制，一般不超过5种颜色。

5、尽量减少小字体或蓝色形式的使用。

6、色彩有些本身就是很无聊，喜欢灰色的，但与橙色或鲜艳的色彩会产生一些完全不同的感觉，你可以尝试下一个。

7、可以使用空格来平衡刺激色彩的网站

8、始终保持相同的颜色，这是一个网站的可读性的重要方面。

2.网页配色方案的选择和色彩使用技巧

要说色彩的运用，还是先谈谈黑白灰色彩的应用吧，因为黑白灰色彩是万能色，可以跟任意一种色彩搭配。当你为某种色彩的搭配苦恼的时候，不防试试用黑白灰。当你觉得两种色彩的搭配不协调，试试加入黑色，或者灰色，或许会有意想不到的效果哦。

对一些明度较高的网站，配以黑色，可以适当地降低其明度。白色是网站用的最普遍的一种颜色。很多网站甚至留出大块的白色空间，作为网站的一个组成部分。这就是留白艺术。很多设计性网站较多运用留白艺术。留白，给人一个遐想的空间，恰当的留白对于协调页面的均衡起到相当大的作用。

确定网站的主题色，一个网站不可能单一的运用一种颜色，让人感觉单调，乏味；但是也不可能将所有的颜色都运用到网站中，让人感觉轻浮，花哨。一个网站必须有一种或两种主题色，不至于让客户迷失方向，也不到于单调，乏味。所以确定网站的主题色也是设计者必须考虑的问题之一。

一个页面尽量不要超过4种色彩，用太多的色彩让人没有方向，没有侧重。当主题色确定好以后，考虑其它配色时，一定要考虑其它配色与主题色的关系，要体现什么样的效果。另外哪种因素占主要地位，是明度，纯度还是色相。避免只有蓝色产生冷冷清清的感觉，整体显得很整洁很和谐，和谐就是恰到好处。

3.网站风格的确立

一个人拥有自己独特的风格是一般人所没有的，这个叫做个性，如果有特殊的需要，甚至可以变成另类，呵呵，总之就是会让人注意到那种特别，若那个人的个性风格是正面的积极的，甚至会引起别人的羡慕与注意或是赞赏。就如同一个网站，拥有别的网站所没有的风格，就会让浏览者愿意多停留些时间，细细品尝该站的内容，甚至该站会得到多人的鼓励与注目，粗略的说，网站风格可以从以下几个方向来探讨，而每一项都是有关联性的：

1、色系：网页的底色、文字字型、图片的色系、颜色等等，更详细的色板可参考网页配色方案的选择和色彩使用技巧。

2、排版：表格、框架的应用、文字缩排、段落等等，特别要注意错别字。

3、窗口：窗口效果，例如：全屏幕窗口、特效窗口等。

4、程序：网页互动程序，例如：ASP.PHP.XML.CGI等等。

5、特效：让网页看起来灵动活泼的各种应用，如：Flash.Java script.Java applets.DHTML等等。

6、架构：目录规划、层次浅显易懂、选单应用等等原则就是适于浏览和阅读。

7、内容：网站主题、整体实用性、文件关联性、内容切合度、是否有不必要的或不相关的档案等等。

8、走向：对于网站的未来规划、网站整体内容走向等。

以上这些是我通过网络、书籍整理了这些资料。

附：Google官方的网页设计建议

Google官方对于此问题的阐述原文如下：

Make a site with a clear hierarchy and text links.Every page should be reachable from at least one static text link.Offer a site map to your users with links that point to the important parts of your site.If the site map is larger than 100 or so links, you may want to break the site map into separate pages.Create a useful, information-rich site and write pages that clearly and accurately describe your content.Think about the words users would type to find your pages, and make sure that your site actually includes those words within it.Try to use text instead of images to display important names, content, or links.The Google crawler doesn't recognize text contained in images.Make sure that your TITLE and ALT tags are descriptive and accurate.Check for broken links and correct HTML.If you decide to use dynamic pages(i.e., the URL contains a '?' character), be aware that not every search engine spider crawls dynamic pages as well as static pages.It helps to keep the parameters short and the number of them small.Keep the links on a given page to a reasonable number(fewer than 100).翻译过来就是：

使网站有清晰的结构和文本链接，每一个页面至少要有一个静态文本链接入口。

为用户提供一个站点地图：转向网站的重要部分。如果站点地图页面超过100个链接，则需要将页面分成多个页面。

创建有用的，信息量丰富的站点，清晰并正确的描述你的信息。

想像用户可能用来找到你的关键词，并保证这些关键词在网站中出现。

尽可能使用文本，而不是图片显示重要的名称，内容和链接。GOOGLE的机器人不能识别图片中的文字。

保证页面的TITLE和ALT标记正确的精确描述

检查死链接并修正这些HTML错误。

如果你打算使用动态页面，链接中包含“?”，必须了解：并非所有的搜索引擎的机器人能象对待静态页面一样对待动态页面，保持动态页面的参数尽可能的少会很有帮助。

保持一个页面中的链接数少于100个。

第三篇：武汉网页美工设计培训

网页美工设计专业班课程

武汉新思维，网页美工设计专业班课程

网页美工设计专业班

招生对象：在校大中专学生、在职转行学员、初入门的设计爱好者

上课形式：周一到周六每天三小时，分上午班或下午班

学习内容：

课程一：photoshop

学习目的及效果：

Photoshop是著名的图像处理软件，具有超强的特效制作功能和照片处理合成功能。是设计师必须掌握和精通的软件。本课程采用案例式教学方法，通过对大量有针对性的教学案例，使学习者掌握Photoshop的图像处理、图像合成、图像创意效果等技术。

课程二：网页界面及网站美工设计

学习目的及效果：

网页美工及界面设计，是指网页设计者根据网页所要表达的主题，将大量信息通过归纳、整理、美化设计，使页面视觉漂亮、网页信息有条理，从而提高网页的阅读效率和信息搜索率。网页设计者不仅要掌握基本的网页制作技术，还需要掌握网站的风格、配色等网页美术设计原理，依照项目设计的目的和需求，自觉地对网页的构成元素进行艺术构思，是一种创造性思维活动，以创造出艺术化、人性化的网站页面为目的。

本课程旨在提高学员的审美能力、让学员能熟练操作PS软件进行各类风格类型的静态页面设计。

课程三：Dreamweaver

课程四：Fireworks

课程五：Flash

课程六：网页设计及综合案例

第四篇：网页美工设计制作岗位职责

1.负责网站整体版式设计。

2.负责网站各种活动推广页面设计工作。

3.熟练运用各种不同类型的设计表现形式，准确传达信息。

4.本着以用户为核心的设计理念，对页面进行优化，使用户操作更趋于人性化。

第五篇：【网页设计-最新经典技术文档】网站设计风格和色彩搭配经验谈

【网页设计-最新经典技术文档】网站设计风格和色彩搭配经验谈.txt懂得放手的人找到轻松，懂得遗忘的人找到自由，懂得关怀的人找到幸福！女人的聪明在于能欣赏男人的聪明。生活是灯，工作是油，若要灯亮，就要加油！相爱时，飞到天边都觉得踏实，因为有你的牵挂；分手后，坐在家里都觉得失重，因为没有了方向。在一般人眼中，“网站”几乎就代表着“互联网”。网站本身的价值正在被人们不断的发现，不断的认可。“如何设计一个成功的网站？”已成为越来越多的网页设计师所思考、关注的问题。本人从事商业网站建设已经有两年以上的经验，在此只想抛砖引玉，提出自己的一些想法，欢迎高手指点！设计网站需要考虑的因素非常之多，从前期网站开始时的定位、设定网站框架、整理资料，到具体制作中的设计环节，再到最后的调试、发布、宣传。这是一个环环相扣的过程。在此我们仅仅从设计师的角度来整体把握我们这次想讨论的主题——如何设计成功的网站！由于篇幅有限，我们仅仅讨论设计网站时重要的两大部分：整体风格和色彩搭配。

一、确定网站的整体风格

网站的整体风格及其创意设计是最难以学习的。难就难在没有一个固定的模式可以参照和模仿。给你一个主题，任何两人都不可能设计出完全一样的网站。

风格(style)是抽象的。是指站点的整体形象给浏览者的综合感受。这个“整体形象”包括站点的CI（标志、色彩、字体、标语）、版面布局、浏览方式、交互性、文字、语气、内容价值、存在意义、站点荣誉等等诸多因素。举个例子：我们觉得网易是平易近人的，迪斯尼是生动活泼的，IBM是专业严肃的。这些都是网站给人们留下的不同感受。在这里，我提供给大家一些参考经验：

1．将你的标志logo，尽可能的放在每个页面上最突出的位置。

2．突出你的标准色彩。

3．总结一句能反映贵站精髓的宣传标语！

4．相同类型的图像采用相同效果，比如说标题字都采用阴影效果，那么在网站中出现的所有标题字的阴影效果的设置应该是完全一致的！

二、网页色彩的搭配

无论是平面设计，还是网页设计，色彩永远是最重要的一环。当我们距离显示屏较远的时候，我们看到的不是优美的版式或者是美丽的图片，而是网页的色彩。

关于色彩的原理有许多，在此我们不可能一一阐述，大家可以看看相关设计书籍，有利于系统地理解。在此我们仅仅想告诉大家一些网页配色时的小技巧。

1．用一种色彩。这里是指先选定一种色彩，然后调整透明度或者饱和度，产生新的色彩，用于网页。这样的页面看起来色彩统一，有层次感。

2．用两种色彩。先选定一种色彩，然后选择它的对比色。

3．用一个色系。简单的说就是用一个感觉的色彩，例如淡蓝，淡黄，淡绿；或者土黄，土灰，土蓝。

在网页配色中，还要切记一些误区：

1．不要将所有颜色都用到，尽量控制在三种色彩以内。

2．背景和前文的对比尽量要大，(绝对不要用花纹繁复的ＱＱ291911320图案作背景)，以便突出主要文字内容。