旗下网站:海南精英网|天涯门户|天涯数码
网站首页 home网站建设 web Const 系统开发 System Dev微信建站 weixin网站推广 Website SEO网站超市 Website SM客户案例 Client case网站模板 Web template关于我们 About us
 
网站制作教程
建站基础系统
网站超市
网站建设资讯
网站模板
网站套餐
解决方案
经典案例
联系我们
QQ服务群:28519571
工作时间:86-0898-31568080
传真号码:86-31568085
24小时服务:0138-07590485
您的位置:网站建设-网站建设资讯-网站制作教程
阅读次数:3081 
   网站建设知识 | 网站制作教程 | 网站设计分析   
如何用色彩来设计出专业感的网站

要使一个设计看起来协调、井然有序并且具有专业感,这样就要专业的配色技巧.今天我们来看下如何用色彩制造出具有专业感的网站

一、从灰度开始

使用色彩的最好方式就是从无色开始。在担心何种色度的黄绿色用起来更好之前,从设计中去掉色彩可以暴露出那些必须解决的基本问题。如果设计没有在黑白色下感觉正常,那么就需要做改动了。是否每个页面都有明确的目的?设计是否引导读者到页面内容?这些内容是引人入胜的,令人振奋的还是让人大开眼界的?标题是否清晰?连接是否与其他文本形成对比?色彩提供了这些功能,但是排版、字体和内容组织问题的解决,无法由色彩单独完成。要做重新设计,首先应该抽出色彩。冲掉过分饱和的初级目标,这一简单的动作就能显示一个网站的立场

二、对齐你的色相

色彩具有三个参数:色相、饱和度和明度(有时也称为亮度)(*HSV&HSL)。(*注: wikipedia - HSV&HSL)饱和度是指色相的纯度:霓虹灯的色彩饱和度高,而粉笔的色彩饱和低。亮度值表示一个色彩有多亮(即更靠近黑色还是白色)色相指的是色彩位于彩虹的哪个部分,比如红色或是绿色;人们总是对这一特性束手无策。没有哪样会像色相冲突一样对配色方案产生致命影响。即使一个设计使用了同一色相的上百种色度,从低饱和色到高饱和色,还是会看起来整齐划一,但是色相搭配错误的话,配色方案就会变得零散。有一种防止色相搭配冲突的办法就是将他们用第三种颜色分割,用黑色、灰色或是白色缓冲是最安全的,因为灰度的色调是中性的:你可以将彩虹中的任何色彩与黑白灰协调起来。第二种解决办法是对不同色相使用不同的比例。如果一个配色方案有,比如说,紫罗兰色和棕色,那么这个设计可以使用大量不同色度的棕色和一些亮紫罗兰色的高亮。另一个选择是变换明度。纯蓝色和亮青色结合是感觉一般般;但是深蓝色(海军蓝)和浅青色(天红蓝)拥有足够的对比度使得它们相互吸引。红色和紫罗兰色的差色不足以相互冲突,但是也不太容易区分;浅红色(粉色)和深紫罗兰色就有区别了。不幸的是,阻止一种错误的色彩加入和选择一种好的色彩并不是同一件事情。一个配色方案是否成功,不在于你是否感到满意,而在于你的观众是否感到舒适。

三、发现优秀的配色方案

优秀的配色方案来自哪里?在上百种色彩和上千种组合中,你该如何选择?来自小型静态站点的设计者们会从内容中选取颜色。通常是指照片。在刚完成的一个八页网站设计中,我搭配了一个精心制作的金属支架来协调靛青色的天空。设置PS的取色工具的取样大小设置在5x5平均,我取出了天空里最暗和最亮的部分,然后将这几个差不多的色度分给了边栏、连接、标题以及页脚。当客户向我们询问我们如何能将网站设计的又好又快时,我们的回应是:“这是我们的本职(This is what we do——或者你不会喜欢的:这是我们应该做的)。”但其实,色彩已经在那里了,我需要做的只是把它寻找出来。相对存储的相片能用于解决快速设计的站点来说,大型动态网站的设计者们则需要从寻找他们的浏览者那里寻找灵感。浏览者的日常服装将是吸引他们的一个非常棒的指示。了解访问者平时穿什么,然后你就会知道怎样的色彩让他们感到舒服。如果你的网站是关于,比如说联赛,就该了解人们穿什么去看比赛而不是他们在工作中穿什么。如果你很幸运地弄到了目标人群的照片,那就将他们看成一体;你需要一个人群的平均。但是如果没有照片,那么去商店购物吧。能够持续经营的服装设计师们通常拥有对每一种情绪和生活方式都很棒的色彩感。不过你不需要跑到第五大道高级时装公司去,只要用google搜索下“野营用品商店”、“婴儿服装”、 “滑雪和泳装”以及“休闲生活”就能够得到很多非常不错的色彩搭配人们根据他们的品位穿着衣服。如果你使用了他们喜欢的色彩,那么他们浏览时会感到更舒适。

四、使用纹理

色相、饱和度和明度的轻微的抖动形成了纹理。单色纹理(就是只有一种色相的纹理)和图案给大多数网站提供了一个微妙的维度而不产生冲突。特别是,简单的纹理背景非常容易制作:

  • 对内墙,或者是其他什么光秃而粗糙的东西拍照
  • 在PS里打开它
  • 复制背景图层,然后将它命名为“纹理1”
  • 给背景图层填充你的配色方案中的色彩
  • 将“纹理1”图层的混合方式设为“柔光”透明度设为30%
  • 在你的网站上试用下,如果看起来不太正常,调整下图层的透明度。

图层的名字不是随便选的,你可能需要尝试不只一张照片,最好别给你的图层类似“墙壁纹路”或者“纸张纹路”,你需要专注于它在网站上的效果,而不是它来自哪里

五、创建一个良好的配色方案

一套良好的配色方案有既定的特点。要将它看成是让设计保持一贯统一的一个框架或者是一套准则。一套配色方案应当:

  • 列出2~5种能共存的色相
  • 描述设计可以从这些色相中变幻出多少
  • 确定每种色相的色度
  • 与黑色和白色能够共处。

六、使用即有框架以后的图形

、照片和图标是否能跟现在的配色方案协调?这个网站六天、周或者六个月后会需要一张怎么样的图片?这很难确定,但是内容确实是你的网站配色方案中的一部分。你可以通过制作根据配色方案制作图片或者是让你的配色系统跟着图片走来解决这个问题。要让你的配色方案生效,同时也对照片生效,一个非常好的办法是让所有页面看起来一致。最简单的解决方式是找到符合配色方案的照片。要记住配色方案具有一定的回旋余地:只要一张图片的主要色相与配色方案吻合,就可以使用。很多存储照片的网站允许你通过色彩搜索图片(我的意思是色相:通常主要是像红色、绿色和蓝色之类)。如果一张图片不符合你的配色方案,那就对它染色

七、具有专业感

  • 没有任何一组色彩是“专业感的”或者是它本身。确切的说你得根据某个工序让它们有一种协调的井然有序的感觉。不管网站是关于什么的,浏览者都会知道它对待自己要做的事是认真的。

 

 

海南网站建设|海南网站设计|海南网络公司|海南网站制作|三亚网络公司|海口网络公司|海口做网站公司|
网站地图合作伙伴企业发展企业文化联系我们返回首页
海口世纪华联 2011版权所有 24小时服务热线:13807590485   欢迎来电咨询
地址:海南省.海口市.海甸二东路环惠大厦6楼(南宝路明都大厦107#) 公司电话:0898-31568080 31568060 QQ:85398489
全国合作联盟分布:海南海口 四川成都 湖北武汉 湖南长沙 安徽合肥 广东深圳 山西太原 西藏拉萨
技术服务: E_mail:server@ngrx.com 服务订购:E_mail:web@ngrx.net
推广关键字:  海南网站建设  海南网站制作  海南网站设计  中立科技 备案/经营许可号:琼ICP备07000778