• 网络学院
  • IT资讯
  • 操作系统
  • 网络技术
  • 软件应用
  • 办公软件
  • 编程技术
  • 网站架设
  • 数据库类
  • 平面设计
  • 多媒体类
  • 游戏资讯
  • 教学论文
  • 认证考试
主页设计中配色方案的使用(上)
  站点:
  • 首 页
  • 最新软件
  • 文章教程
  • 国内软件
  • 国外软件
  • 绿色软件
  • 源码下载
  • 字体下载
主页设计中配色方案的使用(上)
软件发布 主页设计中配色方案的使用(上)
网络软件 系统工具 应用软件 联络聊天 图形图像 多媒体类 行业软件 游戏娱乐 编程开发 安全相关 教育教学 数码软件 绿软下载
热门软件: QQ 瑞星 pplive e话通 木马克星 千千静听 office2000 五笔字根 Photoshop 视频分割
返回文章教程首页 >> 文章首页 >> 网站架设 >> HTML/CSS >> 主页设计中配色方案的使用(上)

主页设计中配色方案的使用(上)

添加时间: 2005-6-9 5:11:26  作者: 网络收集  阅读次数:49   来源: http://d9soft.com

       

  不论你做什么样的设计,色彩都是一个不容忽视的问题。色彩以一种“隐蔽”的方式传达的各种信息,这些信息会影响观看者的心理和感受,左右他们的判断和选择,色彩对于设计而言实在太重要。这篇文章就要比较系统地介绍一些在网页设计中如何使用色彩的入门知识。

  色彩是设计者的得力助手,前提是应用得当。对于网站设计而言,色彩的重要性尤其突出,不过经常被粗心的站长忽视。我们经常说“第一映像最重要”,于是设计网站时,设计者经常会花很多精力制作一个“富于冲击力”的LOGO或者BANNER,当然,它们很重要。但是,访问者访问网站时的第一映像实际上并不来自这些LOGO或者BANNER,而是——色彩!

  好了,在了解了色彩对于网站设计的重要性之后,我们开始探寻色彩的奥秘。

  色彩入门

  首先让我们熟悉一下色彩的一些基本概念。

  三原色

  一切颜色都来自三原色:红、黄、蓝。

  在这个圆环中,相邻的两个原色相混合可以得到另外三个比较重要的颜色(下文将其称为二级原色):红+黄=橙,红+蓝=紫,蓝+黄=绿

  让我们再深入一步,三原色和三种二级原色可以进一步混合得到更多的颜色,分别是橙红色、紫红色、蓝紫色、蓝绿色、橘黄色和黄绿色。这六种颜色可以称为三级原色。

  按照同样的方式不断进行下去,这个圆环中颜色之间的分隔线就会消失,得到下图所示的“色彩圆环”,在一些绘图程序的调色板中我们可以看到这样的色彩圆环。

  但是这个圆环仍然没有涵盖所有的颜色,对于圆环中的每一种颜色还有饱和度、亮度和灰度等的变化。也就是说,将上述圆环中的任意一种颜色和黑色、白色、灰色按照不同比例混合就可以得到更多的颜色,下面将详细介绍。
常用的色彩术语

  饱和度

  某种颜色的饱和度是指这种颜色所包含的基本颜色的多少。例如RGB值为(0,0,255)的蓝色是纯蓝色,他的饱和度是100%。随着饱和度的降低,颜色会越来越接近灰色。


 
 

  灰度

  基本色彩和黑色进行不同程度的混合可以得到不同的灰度,例如

  亮度

  基本颜色和白色进行不同程度的混合可以得到不同的亮度,例如::

  色调

  基本颜色和灰色进行不同程度的混合可以得到不同的色调,例如:

 

   色彩方案的种类

  不同网站应当使用不同的色彩方案,与站点的主题相吻合的色彩方案决不仅仅可以让网站“更加好看”,更重要的是在访问者心目中建立对这个网站的感性认识。所以,色彩方案的选择决不能草率,而且色彩方案绝对是网站建设的第一个步骤。如果选择色彩方案时过于草率,甚至根本不对网站进行色彩方案的整体规划,你将不可能制作出一个真正优秀的网站。

  例如,一个销售婴儿用品的网站应当使用比较活泼的色彩方案,而一个艺术网站则应当使用比较执重的方案。

  按照色彩方案中色彩使用方式的不同,我们可以将色彩方案划分成多种类型,单色方案、相似色方案、补色方案和三合一色方案。

  单色方案

  单色方案是指在网站设计中终止使用一种基本颜色,为避免单调,我们可以通过调整这种基本颜色的灰度和亮度来得到更多的颜色,由于整个颜色方案中事实上只有一种基色,因此这种方案称为单色方案。例如:

  在Photoshop的色彩选择窗口中,我们可以这样进行建立单色方案。首先调整H(也就是Hue的缩写)后面的值来调整色调。注意,H的单位是度,也就是基本颜色在颜色环上所处位置的角度。

  设置好H的值之后,再调整B后面的数字调整亮度以及S后面的数字调整饱和度。注意,其中B和S的单位是百分比,也就是向基本颜色中添加白色和黑色的百分比。这样就可以得到一个单色方案了。

  下面来看两个使用单色方案的成功实例。

  单色方案实例之一:

  这是一个女性网站,因此其基本颜色为粉红色,并通过调整粉红色的饱和度得到了其余几种颜色。总体颜色趋于淡雅,访问者的注意力会很自然地被吸引到几幅展示其产品的图片上。

  单色方案实例之二:

  这个色彩方案使用的基色颜色较深,并通过修改其亮度获得其他两种颜色,并用最浅的颜色作为主体部分的背景,使其突出出来。

  总的来说,单色方案是一种比较稳重的方案,或者说比较保守的方案。单色方案给人整洁、经典的感觉,最适合于内容比较严肃的网站,比如政府网站,学术网站,企业网站,高雅艺术网站。

  特别值得一提的是,商业网站也比较适合使用此种颜色方案,因为这种方案可以给人一种稳定感,使访问者容易建立对网站的信任感。当然,这种方案也有其灵活的一面,当使用较浅的基色时,这种颜色方案也可以用于时尚类网站,传达简约清雅的观念。

 

上下文章:

 

上一篇文章: 实践用CSS制作框架页效果 下一篇文章: 网页制作小工具大全(下)

相关文章:

  • 使用搜狗音乐盒下载歌曲,快带飚的体验
  • 内外网物理隔离下的集群邮件系统路由方案(三)
  • 内外网物理隔离下的集群邮件系统路由方案(四)
  • 教你如何使用Procmail 过滤mail病毒
  • Qmail系统下防止滥用mail relay方案(二)

相关软件:

  • 胜新通用条形码设计打印系统 6.09
  • 全国计算机等级考试模拟软件(2006年全年使用)二级Visual Basic V9.0
  • 网页配色精灵 5.5
  • 冬莲报表设计器 V1.0
  • HiHand结构设计工具箱 2005 Build 0903
  • 创想家居设计软件 V9.5 普及版

 

快速导航

  • 网络学院
  • 精品汇聚
  • 字体下载
  • 教程下载
  • ASP源码
  • PHP源码
  • Net源码
  • JSP 源码

网站架设分类导航

  • DreamWeaver
  • HTML/CSS
  • Flash
  • Firework
  • FrontPage
  • 建站指南

本类经典文章推荐

  • 总结:CSS在IE与Firefox下的兼容性
  • 经典:CSS应用常见问题大总结
  • 网站设计的标准时代
  • 用层模拟下拉列表框
  • 苏沈小雨样式表中文手册系列
  • 用CSS控制网页总体风格
  • WEB界面设计五种特征
  • 深入透析样式表滤镜(上)
  • HTML的基本元素
  • 网页中多层效果的灵活使用

HTML/CSS阅读排行

  • 用层模拟下拉列表框
  • 突破网页文字无法复制局限
  • 流程图软件Visio作“高难度”网页
  • 苏沈小雨样式表中文手册系列
  • WEB界面设计五种特征
  • 用CSS控制网页总体风格
  • 图片模糊转清晰
  • 制作精美圆角表格两种方法
  • 网页制作小工具大全(下)
  • 网页制作小工具大全(中)

网站架设阅读总排行

  • 用层模拟下拉列表框
  • 教你如何用Dreamweaver制作电子相...
  • 用Dreamweaver插件制作动态下拉菜...
  • 突破网页文字无法复制局限
  • 如何设计首页???(解答)
  • Dreamweaver基础技巧-布局阶段
  • 动态QQ表情DIY Fireworks轻松搞定
  • 流程图软件Visio作“高难度”网页
  • 网页制作隐藏对象巧利用
  • 站点-网页布局设计基础

广告位置

字母检索 A B C D E F G H I J K L M N O P Q R S T U V W X Y Z 回到顶部

关于我们 | 版权声明 | 免责条款 | 广告联系 | 软件发布 | 下载帮助 | 下载排行 | 网站地图 | 特别鸣谢 | 友情连接

copyright; 2005-2008 D9soft.com 第九软件网 版权所有