网页艺术设计课件(第三章).pdf

高等教育电子音像出版社 高等教育电子音像出版社 第三章 网页设计的视听元素 【内容提要】 网页的视听元素属于网页的形态要素，主要由文字、图形 图像、动画、音频、视频、交互元素等组成。能够根据网页的 主题合理安排各视听元素的设计、组织和应用，是网页设计师 的应具备的基本素质。 【关键词】 网页文字 网页图形图像 网页动画 网页音、视频 网页 交互元素 网页设计包括多种视听元素，如文字、图形、动画、视频、声 音等，这些元素在艺术上都具有相对独立性，其中有些视听元素本 身就是一门艺术。 老蒋Flash作品《新长征路上的摇滚》 第一节 文字 一、文本文字 所谓文本，是指在网页编辑软件中可以编辑和更改内容的字 符，它具有字体、字号、色彩等的基本属性。 使用CSS具有以下主要优点： 1.丰富了文本的表现形式。 2.简化了文本的控制方式。 3.兼容性强。 二、图形文字 图形文字是指内容不可编辑、已经图形化的各种文字。 三、网页文字的设计准则 1.文字的风格和编排符合网页主题。 2.保持文字的可读性。 3.保持文字设计的整体性。 4.大量的文字适合使用文本文字，文本文字应选用常用的系统字体。 5.图形文字要注意控制文件的大小。 第二节 图形图像 一、矢量图和位图 1.矢量图 矢量图也称为向量图，矢量图是通过数学方法计算对象的轮廓 线和填充属性来描述图形的。 目前，能够在网页中直接应用的矢量图形只有FLASH动画，其 它格式的矢量图形只有转换为FLASH格式才能在网页中应用。 矢量图放大 位图放大 敦煌图案矢量图 2.位图 位图也称为点阵图或 像素图，它由网格上的点 组成，这些点称为像素。 位图是连续色调图像 （如 照片或数字绘画）最常用 的电子媒介，因为它可以 表现阴影和颜色的细微层 次。 Pierre Mendell创作的招贴 3.矢量图和位图相互转化 二、网页中常用的图形图像格式 （一）GIF图像格式 GIF是Graphic Interchange Format （图像交换格式）的缩 写，以.gif作为扩展名。 优点： 1.跨平台显示能力。 2.无损压缩。 2.支持透明底图。 3.支持隔行（Interlaced）显示模式。 4.可制成动画。 缺点： 只支持256种颜色。无法用它来表现超过256色的图像色彩效果。 只适合表现图标、按钮等颜色单纯的图像。 （二）JPEG图像格式 JPEG是Joint Picture Expert Group （联合图像专家组）的缩 写。由于它支持全彩色模式，所以很适合用来优化颜色丰富的图 像。 优点： 1.JPEG可以跨平台操作和显示。 2.支持全彩色模式高倍率有损压缩。 3.支持逐行（non-interlaced）显示模式。 缺点： 1.不适合优化颜色单纯的图像，容易使图像模糊。 2.不支持透明底图。 3.不能做成动画。 （三）PNG图像格式： PNG是Portable Networt Graphics （可移植网络图像）的缩 写，