《网页设计与制作》课程PPT教学课件（Fireworks Mx 2004）第九章 Firework图像处理

第九章 Firework图像处理 9)图像基础及色彩应用 92静态图像的制作 9.3动画图像制作 94动态交互图像的制作 网站首页的设计 SEWBBSSSSEEBWESW.K

9.1 图像基础及色彩应用 9.2 静态图像的制作 9.3 动画图像制作 9.4 动态交互图像的制作 第九章 Firework图像处理 9.5 网站首页的设计

本章初步介绍了图像的设计基础以及色彩的应用,详细 介绍了如何利用 Fireworks进行图像处理和页面设计。 【本章学习目的】 在本章中,通过多个实例的介绍,重点讲解了 reworks软件的应用基础和应用技巧,通过本章的学习 读者应了解设计中页面配色方案,掌握利用 Fireworks软 件设计出美观大方的网页

本章初步介绍了图像的设计基础以及色彩的应用，详细 介绍了如何利用Fireworks进行图像处理和页面设计。 【本章学习目的】 在本章中，通过多个实例的介绍，重点讲解了 Fireworks软件的应用基础和应用技巧，通过本章的学习， 读者应了解设计中页面配色方案，掌握利用Fireworks软 件设计出美观大方的网页

9.1图像基础及色彩应用 在进行网页设计之前,首先要掌握色彩的应用 和图像基础。因此本节内容是通过实例围绕这两个 方面展开的

9.1 图像基础及色彩应用 在进行网页设计之前，首先要掌握色彩的应用 和图像基础。因此本节内容是通过实例围绕这两个 方面展开的

9.1.1认识色彩 为了能更好地应用色彩来设计网页,我们还是先来了解 下色彩的一些基本概念。自然界中有很多种色彩,比如玫 瑰是红色的,大海是蓝色的,桔子是橙色的等等,但是最 基本的有三种(红,绿,蓝),其它的色彩都可以由这三 种色彩调和而成,我们称这三种色彩为“三原色”。 现实生活中的色彩可以分为彩色和非彩色。其中黑、白、 灰色属于非彩色系列,其它的色彩都属于彩色,如图所示

9.1.1认识色彩 为了能更好地应用色彩来设计网页，我们还是先来了解一 下色彩的一些基本概念。自然界中有很多种色彩，比如玫 瑰是红色的，大海是蓝色的，桔子是橙色的等等，但是最 基本的有三种（红，绿，蓝），其它的色彩都可以由这三 种色彩调和而成，我们称这三种色彩为“三原色” 。 现实生活中的色彩可以分为彩色和非彩色。其中黑、白、 灰色属于非彩色系列，其它的色彩都属于彩色，如图所示

下面介绍两种常用的色彩模式。 1. HSB 任何一种彩色具备三个特征:鱼相(H)纯度 S)和明度(B),把这三个要素做成立体坐标,就 构成色立体,其中菲来色只有萌度属 2. RGB RGB色彩模式是工业界的一种颜色标准,表示红色、 绿色、蓝色,又称为三原色光,英文为R(Red G(Green)、B(Bue 它行箱乏间的雪加采得到 各种颜色 通常情况下,RGB各有256级亮度 至255共256级。接囊 字表 从0 56 RGB色彩总共能组合出约1678万种色 56×256×256=16777216,通常也被简称为 1600万色或干万色,也称为24位色(2的24次方)

下面介绍两种常用的色彩模式。 1. HSB 任何一种彩色具备三个特征：色相（H），纯度 （S）和明度(B)，把这三个要素做成立体坐标，就 构成色立体，其中非彩色只有明度属性。 2. RGB RGB色彩模式是工业界的一种颜色标准，表示红色、 绿色、蓝色，又称为三原色光，英文为R(Red)、 G(Green)、B(Blue)，它们相互之间的叠加来得到 各种颜色。 通常情况下，RGB各有256级亮度，用数字表示为 从0、1、2至255，共256级。按照计算，256级的 RGB色彩总共能组合出约1678万种色彩，即 256×256×256＝16777216，通常也被简称为 1600万色或千万色，也称为24位色(2的24次方)

发奖要要赢色第警售次国 这种颜色不 RGB三种 度最强 G和B都 因此 色的数值是255,00。同 理,最绿色就是02550:而最蓝色就是00255。黄色较特 殊,是由红色加绿色而得就是255,255,0 RGB号层正是的的这就意味着无在软 件中国RGB方式出 就

对于单独的R或G或B而言，当数值为0时，代表这种颜色不 发光；如果为255，则该颜色为最高亮度。因此当RGB三种 色光都发到最强的亮度，纯白的RGB值就为255,255,255。 屏幕上黑的RGB值是0,0,0。R，意味着只有红色存在，且亮 度最强，G和B都不发光。因此最红色的数值是255,0,0。同 理，最绿色就是0,255,0；而最蓝色就是0,0,255。黄色较特 殊，是由红色加绿色而得就是255，255，0。 RGB模式是显示器的物理色彩模式。这就意味着无论在软 件中使用何种色彩模式，只要是在显示器上显示的，图像最 终就是以RGB方式出现

9.1.2色彩的作用 情感,生 星猜奇的累生活的个方高人们的表住用光果与径发 色彩使字宙万物充 色彩的冷暖 红橙、黄等颜色使用联想到阳光、裂火,故称为“暧色”,绿、青、蓝 等颜色与黑夜、寒 连,故称为“冷色” 色彩的轻重 意种金人的轻更感不同A色得到的重量感,是质感与色感的复合 感觉 色彩的前进与后退 如果等距离地观察两种 籠 可以给人不同的远近感。暖色比冷色更富 的特性。两色之间,亮度偏高的色彩呈前进性,饱和度偏高的色彩 呈前进 色彩的艳丽与素雅 如果是单色,饱和度越高则色彩越 除了饱和 是的关系。不 么额型度境 高时,即更饱箱度 低也给人艳南的宽

9.1.2 色彩的作用 色彩使宇宙万物充满情感，生机勃勃。色彩作为一种最普遍的审美形式， 存在于人们日常生活的各个方面，人们的衣、食、住、行、用无不与色彩发 生着密切的关系。 色彩的冷暖 红、橙、黄等颜色使用联想到阳光、烈火，故称为“暖色”，绿、青、蓝 等颜色与黑夜、寒冷相连，故称为“冷色” 。 色彩的轻重 各种色彩给人的轻重感不同，从色彩得到的重量感，是质感与色感的复合 感觉。浅色密度小，给人质量轻的感觉；深色密度大，给人分量重的感觉。 色彩的前进与后退 如果等距离地观察两种颜色，可以给人不同的远近感。暖色比冷色更富有 前进的特性。两色之间，亮度偏高的色彩呈前进性，饱和度偏高的色彩的也 呈前进性。 色彩的艳丽与素雅 如果是单色，饱和度越高，则色彩越艳丽。饱和度越低，则色彩越素雅。 除了饱和度，亮度也有一定的关系。不论什么颜色，亮度高时，即使饱和度 低也给人艳丽的感觉

9.1.3色彩的配色应用方案实例 红色让人联想到玫瑰,联想到喜庆,联想到兴奋。 白色联想到纯洁,干净,简洁;紫色象征着女性化, 高雅,浪漫;蓝色象征高科技,稳重,理智;橙色 代表了欢快,甜美,收获;绿色代表了充满青春的 活力,舒适,希望等等。当然不是说某种色彩一定 代表了什么含义。在特定的场合下,同种色彩可以 代表不同的含义。更多的色彩知识可参考专业的色 彩理论与应用书籍,这里仅介绍几种常用的网页色 彩配色实例

9.1.3 色彩的配色应用方案实例 红色让人联想到玫瑰，联想到喜庆，联想到兴奋。 白色联想到纯洁，干净，简洁；紫色象征着女性化， 高雅，浪漫；蓝色象征高科技，稳重，理智；橙色 代表了欢快，甜美，收获；绿色代表了充满青春的 活力，舒适，希望等等。当然不是说某种色彩一定 代表了什么含义。在特定的场合下，同种色彩可以 代表不同的含义。更多的色彩知识可参考专业的色 彩理论与应用书籍，这里仅介绍几种常用的网页色 彩配色实例

1.红色色系 令红色是最鲜明生动的、最热烈的颜色,因此红色也 是代表热情的情感之色。鲜明红色极容易吸引人们的 目光。在主要由红色成分构成的色彩中,粉红色象征 了浪漫、温馨,暗红色象征了神秘、深沉,桃红色象 征了时尚、明亮,下面研究的是红色的配色规律。 高亮度的红色通过与灰色、黑色等非彩色搭配使用, 可以得到现代且激进的感觉。 低亮度的红色具有冷静沉重的感觉,可以营造古典 的氛围。 红色如果与亮度、饱和度较强的冷色(如蓝色、绿 色)相配,中间最好能有一些过渡性的颜色,如纯红 与纯蓝相配时,中间插入面积适中的白色,大红与大 绿相配时,中间可以用棕色或黑色间隔,如图所示

1.红色色系 ❖ 红色是最鲜明生动的、最热烈的颜色，因此红色也 是代表热情的情感之色。鲜明红色极容易吸引人们的 目光。在主要由红色成分构成的色彩中，粉红色象征 了浪漫、温馨，暗红色象征了神秘、深沉，桃红色象 征了时尚、明亮，下面研究的是红色的配色规律。 高亮度的红色通过与灰色、黑色等非彩色搭配使用， 可以得到现代且激进的感觉。 低亮度的红色具有冷静沉重的感觉，可以营造古典 的氛围。 红色如果与亮度、饱和度较强的冷色（如蓝色、绿 色）相配，中间最好能有一些过渡性的颜色，如纯红 与纯蓝相配时，中间插入面积适中的白色，大红与大 绿相配时，中间可以用棕色或黑色间隔，如图所示