zoukankan      html  css  js  c++  java
  • 最近发现自己做网页配出来的颜色很差

       首先我做出来的网页,给人视觉上是一种模糊的感觉,分辨率我调的是72,用的也是RGB模式的颜色,8位/通道。就是不明白我为什么调的和别人一样的模式,做出来就是给人一种很不清楚的感觉,甚至觉得很模糊,后来我发现和配色有很大的原因。还有一些其他的原因我还在努力找着,不知道设计上的技术朋友们,会不会也发现过这样的问题。

      现在给自己下的定义就是我配色上需要提升,以下是我给自己收集整理的配色方法: 艺术修养主要靠长期的环境熏陶,与长期努力是分不开的 :这句话说的很有道理,所以我打算从现在开始,大胆的用色,不断的尝试新的配色,而不是总徘徊在三原色和相近的颜色之类的,只有不断地尝试,才会有新的突破。每个礼拜抽时间给自己安排一次户外的写生,因为我是半路出道,没有经过专业的培训,但又不想放弃。我想尝试一段这样的锻炼,希望能有所进步。

      学习一些配色的技巧:

      色彩的调和:

      是求得视觉统一,达到人们心理平衡的重要手段。两种或两种以上的色彩合理搭配,产生统一谐调的效果,称为色彩调和。

      网页配色一般分为:主色调、辅色调、点睛色、背景色。

      同种色的调和
      相同色相、不同明度和纯度的色彩调和。使之产生秩序的渐进,在明度、纯度的变化上,弥补同种色相的单调感。

      同种色的调和分析:
      同种色给人的感觉是相当协调的。它们通常在同一个色相里,通过明度的黑白灰或者纯度的不同来稍微加以区别的,产生了及其微妙的韵律美。为了不至于让整个页面呈现过于单调平淡,有些页面则是加入极其小的其他颜色做点缀。该页面使用了同种色的黄色系,淡黄、柠檬黄、中黄、通过明度、纯度的微妙变化产生缓和的节奏美感。
      结论:
      同种色被称为最稳妥的色彩搭配方法。(我一般就用这种方法配色,很保守,但是很少有突破)

      类似色的调和
      在色环中,色相越靠近越调和。主要靠类似色之间的共同色来产生作用。

     类似色的调和分析:
      类似色相较于同类色色彩之间的可搭配度要大些,颜色丰富、富于变化。
      以上页面主要取的是色环中的黄色、绿色、蓝色通过明度、纯度、面积上的不同实现变化和统一的。虽然主色调的米黄色在页面中使用面积最大,但是我们看到由于它的明度非常高,饱和度就降低了,因此在页面中处在不明显的角色。而绿色的纯度最高,且使用面积次之,页面显示较显眼,因此用于次级导航位置上。整个页面主次的视觉引导分明。
      结论:
      不是每种主色调都是极其显眼的位置,通常多扮演着用于突出主体的辅助性配角。而重要角色往往在页面中用的份量极少,却又起到突出主体的作用。

    对比色的调和
      调和方法有:
      1、提高或降低对比色的纯度;
      2、在对比色之间插入分割色(金、银、黑、白、灰等);
      3、采用双方面积大小不同的处理方法;
      4、对比色之间加入相近的类似色。

    对比色的调和分析
      基本上可以说是黄色和紫色的对比色做页面的主要色调。黄色紫色组合在网页中使用率较低,原因是这组颜色适用范围相对其他两组对比色要小很多,配色难度也较两组大。
      这里黄色加入了红色呈中黄色,紫色加入了红色,偏玫瑰色,所以这组颜色不是严格意义上的对比色,也因此使这组颜色看起来协调、舒服。这个页面都调低了亮度使整体降低了纯度,缓和视觉刺激。白色是这组对比色里加入的协调色。

      结论:
      从上面的分析我们可以知道,通过上面的这些色值调配--当需要使用这组对比色配色时候该如何达到协调的目的。
      不是对比色为主色调的页面就一定会有不舒服的感觉的,主要可以通过调低亮度、降低饱和度、加入少许白色来调和。

    渐变色的调和
      渐变色实际是一种调和方法的运用。是颜色按层次逐渐变化的现象。色彩渐变就像两种颜色间的混色,可以有规律地在多种颜色中进行。暗色和亮色之间的渐变会产生远近感和三维的视觉效果。

    渐变色的调和分析
      该页面背景使用了渐变的效果,增加了视觉空间感。在导航栏、广告区域、产品技术的大标题块,都使用了渐变的技术手法来表达,产生三维的视觉效果,统一了整个页面的设计语言,也是区别于其他网站页面的个性体现,达到让人印象深刻的目的。
      结论:
      渐变色能够柔和视觉,增强空间感,体现节奏和韵律美感,统一整个页面的目的。
      除了统一当然也可以起到变化页面视觉形式的作用。该设计语言可做需要的时候适当的使用。 
      
      小结:
      本节主要对色彩的对比与调和做了实例分析。例如当页面平淡单调,需要用对比手法做些变化来丰富页面的色彩设计;当页面变化过多,显得刺眼、凌乱,可以通过以上介绍的调和方法进行调整,使得页面看起来更统一协调。
      ● 主要是通过面积大小、冷暖对比来表达体现页面的主次关系、中心思想。
      ● 颜色平淡可加入适当类似色对比色来使页面产生变化。颜色凌乱可以适当加入同类色或者类似色、白色、黑色、灰色做到统一调配的目的。
      ● 对比色的搭配并不是就是说是绝对值的红或者绿,蓝或橙、黄或紫。对比色的第一视觉倾向越明显配色难度就越大,也就是说越难调和;反之,倾向越不明显的对比色越容易调和。
      ● 不是一种色彩面积用得越多或者越少、纯度、明度越高就是能突出主体的主角色,主要是根据色彩相互之间的搭配关系来体现的。
      ● 一个页面中单纯绝对的使用某种颜色或是使用绝对非常多种颜色搭配,容易产生个性效果,那叫玩色彩了,限于色彩运用得非常熟练的朋友,但不推荐初学者使用。(看到这里我还需要多多练习)


     颜色的明度变化、纯度变化:纯度,指色彩的鲜艳程度,纯度高的色彩纯,鲜亮。纯度底的色彩暗淡,含灰色。

     


     相近色:色环中相邻的三种颜色。如图2中的黄绿色,黄色和桔黄色。相近色的搭配给人的视觉效果很舒适,很自然。所以相近色在网站设计中极为常用。
    相近色 

    图2 相近色

    互补色

    图3 互补色

     互补色:色环中相对的两种色彩。如图3中的亮绿色跟紫色,另外如红色跟绿色,蓝色和橙色等。对互补色,调整一下补色的亮度,有时候是一种很好的搭配。就拿蓝色跟橙色来打个比方吧,看图6,调整了蓝色的亮度以后其搭配效果是不是更好呢?补色在网站设计中用得也极为普遍。

    补色亮度调节

    图4 补色亮度调节
    暖色,如图5中的黄色,橙色,红色,紫色等都属于暖色系列。暖色跟黑色调和可以达到很好的效果。暖色一般应用于购物类网站,电子商务网站,儿童类网站等等,用以体现商品的琳琅满目,儿童类网站的活泼,温馨等等效果。
    冷色,如图6中的绿色,蓝色,蓝紫色等等都属于冷色系列。冷色一般跟白色调和可以达到一种很好的效果。冷色一般应用于一些高科技,游戏类网站,主要表达严肃,稳重等效果。
    图5 暖色

    暖色 

    图6 冷色

    冷色 

    色彩均衡,网页让人看上去舒适,协调,除了文字,图片等内容的合理排版,色彩的均衡也是相当重要的一个部分。比如一个网站不可能单一的运用一种颜色,所以色彩的均衡问题是设计者必须要考虑的问题。色彩的均衡,包括色彩的位置,每种色彩所占的比例,面积等等。比如鲜艳明亮的色彩面积应小一点,让人感觉舒适,不刺眼。这就是一种均衡的色彩搭配。

    <色彩设计基础知识摘自:第7大道设计网  >

     

  • 相关阅读:
    Java 7的javax.net.ssl.SSLHandshakeException
    Oracle数据泵导出数据库
    ORA-00054: 资源正忙 --锁表的解决方法
    Linux学习私人笔记-Shell基础
    Linux学习私人笔记-目录和文件的基本命令
    Linux学习私人笔记-文件基本命令
    Linux学习私人笔记-账号管理
    Linux学习私人笔记-Vim
    form提交表单时本地下载
    SQL Servel 中分页解决
  • 原文地址:https://www.cnblogs.com/suixin/p/2045604.html
Copyright © 2011-2022 走看看