《网站制作基础知识.ppt》由会员分享，可在线阅读，更多相关《网站制作基础知识.ppt（105页珍藏版）》请在三一办公上搜索。
1、,网页设计与制作,多媒体技术基础,姓名：毛典辉联系方式：北京工商大学计算机与信息工程学院,网络应用快速发展,Internet的发展和普及，许多重要的应用电子商务、远程教育、聊天交友等网络应用层出不穷。Web 2.0概念的推出，越来越多的桌面应用转向网络。Web邮箱、Web Office、Web OS无线网络的高速发展创造更多的商机网络是一个创造神话和奇迹的地方！google、youtube、facebook,互联网的发展方向,提供服务：云计算、云服务。创业：Idea创意！（淘宝、团购等）创意、商业模式,静态网页,动态网页,预备知识,HTML,CSS,图像处理,动画制作,Web服务器,程序代码,
2、网站制作技术,数据库,因特网是计算机网络,客户机提供信息服务请求或资源服务请求服务机提供信息服务或资源服务的网络结构，,客户机/服务机体系结构,公众网络上的信号传输设备和线路,网络通信协议,网络数据通信的几个重要协议TCP协议：面向连接的协议 UDP协议：无连接的协议,互联网访问方式,互联网访问的构成要素：IP地址：第一无二的数字标示（IPV4、IPV6）域名：http协议,端口号,端口号:TCP/IP协议为每种服务定义了一个端口。端口号则是一个数字，其值一般在165535之间，其中11023一般保留用在知名的端口号或操作系统保留的，临时使用的端口号可取102465535之间的整数。端口号可以
3、区分一台服务器上同时运行的不同种的服务程序。,URL,URL(Uniform Resource Locator)-统一资源定位器，表示Internet上某一资源的地址。URL组成:协议名和资源名protocol:resourceNameURL举例:http:/,网页文件（html）,HTML（Hypertext Markup Language）设计该语言的目的是为了能把存放在一台电脑中的文本或图形与另一台电脑中的文本或图形方便地联系在一起，形成有机的整体，不受操作系统的限制，人们不用考虑具体信息是在当前电脑上还是在网络的其它电脑上，能独立运行于各种操作系统的平台上。HTML文本是由HTML命令
4、组成的描述性文本，HTML命令可以说明文字、图形、动画、声音、表格、链接等。HTML的结构包括头部（Head）、主体（Body）两大部分，其中头部描述浏览器所需的信息，而主体则包含所要说明的具体内容。,“多媒体”一词源自“Multimedia”,Multiple多重、复合,medium的复数形式media介质、媒介和媒体,教学进程,网络是多媒体信息平台,媒体：承载信息的载体，是信息的表示形式,承载信息的实际载体：纸、磁盘、光盘、半导体芯片表述信息的逻辑载体：文字、图形、图像、音频、视频,网络就是提供一个多媒体信息服务的平台,文字,多媒体,多媒体,多媒体,网页中包含的信息对象,各类文字和符号,教
5、学进程,文字,图形,矢量图形对象,通过计算而描述的矢量图形,教学进程,文字,图形,图像,位图图像对象,用像素点描述的自然影像,教学进程,文字,图形,图像,动画,多画面帧动画,单画面矢量动画,FRAME 01 FRAME 02 FRAME 03 FRAME 04 FRAME 05 FRAME 06 FRAME 07,动画对象,单画面矢量动画、多画面帧动画,教学进程,文字,图形,图像,动画,音频,midi音频 wav音频 mp3压缩音频,音频对象,音频数字信号、压缩音频信号,教学进程,文字,图形,图像,动画,音频,视频,音频+视频Audio Vedio Information,视频对象,END,视
6、频数字信号AVI、压缩视频信号MPG,教学进程,文字,图形,图像,动画,音频,视频,控制,1.概述2.课程演示3.课间音乐4.课堂作业,Button,Menu,控制对象,采用按钮、菜单实现媒体间的控制功能,教学进程,网站开发工具,Macromedia Fireworks Fireworks 业界领先的优化工具可帮助您在直观、可定制的环境中创建和优化用于网页的图像并进行精确控制图像品质和最小压缩大小之间达到平衡。它与 Macromedia Dreamweaver 和 Macromedia Flash 共同构成的集成工作流程，号称“网站三剑客”利用可视化工具，无需学习代码即可创建具有专业品质的网页
7、图形和动画，如变换图像和弹出菜单等。,FlashMacromedia公司出品的平面矢量动画设计软件，也是一个可视化的网页设计和网站管理工具。支持最新的Web技术，包含HTML检查、HTML格式控制、HTML格式化选项、HomeSite/BBEdit捆绑、可视化网页设计、图像编辑、全局查找替换、全FTP 功能、处理Flash和Shockwave等富媒体格式和动态HTML、基于团队的Web创作。在编辑上可以选择可视化方式或者你喜欢的源码编辑方式。,网站开发工具,DreamweaverDreamweaver是美国MACROMEDIA公司开发的集Web页制作和管理网站于一身的所见即所得Web页编辑器，
8、它是第一套针对专业Web页设计师的视觉化Web页开发工具，利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的Web页。,网站开发工具,静态图像处理基础知识,视觉系统对颜色的感知图像的颜色模型图像的基本属性图像的分类常用图像文件格式,一张虎照引起的刑案,视觉系统对颜色的感知,可见光的波长范围为380nm780nm，大多数自然光都是由不同波长的光组合而成。眼睛本质上是一个照相机。人的视网膜(human retina)通过神经元来感知外部世界的颜色，每个神经元或者是一个对颜色敏感的锥体(cone)，或者是一个对颜色不敏感的杆状体(rod)。人的视网膜有对红、绿、蓝颜色敏感程度不同的三
9、种锥体细胞，另外还有一种在光功率极端低的条件下才起作用的杆状体细胞，因此颜色只存在于眼睛和大脑中。颜色是视觉系统对可见光的感知结果。红、绿和蓝三种锥体细胞对不同频率的光的感知程度不同，对不同亮度的感知程度也不同，因此不同组成成分的可见光就呈现出不同的颜色,视觉系统对颜色的感知,视觉系统对颜色和亮度的响应特性曲线（各个波长的光的强度相等）,视觉系统对颜色的感知,上面的颜色响应曲线表明，人类眼睛对蓝光的灵敏度远远低于对红光和绿光的灵敏度。亮度响应曲线表明人眼对波长为550nm左右的黄绿色最为敏感。绝大部分可见光谱对眼睛的刺激效果都可以用红（700nm）、绿（546.1）、蓝（435.8nm）三色光
10、按不同比例和强度的混合来等效表示。（三原色理论）,视觉系统对颜色的感知,匹配任意可见光所需的三原色光比例曲线,发光物体的色彩定义模型,RGB加色法,红蓝品红红绿黄蓝绿青红蓝绿白,理论上绝大部分可见光谱都可用红、绿和蓝(RGB)三色光按不同比例和强度的混合来表示。颜色CR(红色的百分比)G(绿色的百分比)B(蓝色的百分比)RGB模型称为相加混色模型，用于光照、视频和显示器。例如，显示器通过红、绿和蓝荧光粉发射光线产生彩色。,RGB颜色模型,反射物体的色彩定义模型,品红白绿黄白蓝青白红,CMY减色模型,CMYK颜色模型,在理论上，绝大多数颜色都可以用三种基本颜料（青色cyan、品红magenta、
11、和黄色yellow）按一定比例混合得到。理论上，青色、品红和黄色三种基本色素等量混合能得到黑色。但实际上，因为所有打印油墨都会包含一些杂质，这三种油墨混合实际上产生一种土灰色，必须与黑色(K)油墨混合才能产生真正的黑色，所以再加入黑色作为基本色形成CMYK颜色模型。问题：打印机能打印白色的字吗？,人体对颜色的感知模型,从人的主观感觉角度，颜色包含三个要素：1、色调（hue）：色调反映颜色的类别，如红色、绿色、蓝色等。色调大致对应光谱分布中的主波长。,视觉系统对颜色的感知,2、饱和度（Saturation）饱和度是指彩色光所呈现颜色的深浅或纯洁程度。对于同一色调的彩色光，其饱和度越高，颜色就越深
12、，或越纯；而饱和度越小，颜色就越浅，或纯度越低。高饱和度的彩色光可因掺入白光而降低纯度或变浅，变成低饱和度的色光。100%饱和度的色光就代表完全没有混入白光的纯色光。,视觉系统对颜色的感知,3、明亮度（luminance）明亮度是光作用于人眼时引起的明亮程度的感觉。一般来说，彩色光能量大则显得亮，反之则暗。大量试验表明，人的眼睛能分辨128种不同的色调，1030种不同的饱和度，而对亮度非常敏感。人眼大约可以分辨35万种颜色。,HSL颜色模型,在HSL模型中，H定义色调；S定义颜色的深浅程度或饱和度；L定义亮度。RGB模型和CMYK模型主要是面向设备的，而HSL模型更容易被人理解和控制。,设计网
13、站的标准色彩,网站给人的第一印象是来自视觉的冲击，这种冲击首先是颜色。不同的色彩搭配会产生不同的效果，并可能影响到访问者的情绪，因此确定网页的主题颜色非常重要。,什么是网页的标准色彩,“标准色彩”是指最能体现网站站形象和内涵的色彩。例如：IBM的深蓝色，肯得基的红色条型，windows视窗标志上的红蓝黄绿色块，都使我们觉得很贴切，很和谐。,网站色彩实例一,网站色彩实例二,网站色彩实例三,标准色彩总的应用原则应该是“总体协调，局部对比”，也就是说网页的整体色彩效果应该是和谐的，只有局部的、小范围的地方可以有一些强烈色彩的对比但只是作为点缀和衬托，绝不能喧宾夺主。一般来说，一个网站的标准色彩不超过
14、3种，太多则让人眼花缭乱；标准色彩要用于网站的标志，标题，主菜单和主色块，给人以整体统一的感觉；,标准色彩选择的原则（一）,标准色彩选择的原则（二）,色彩是人的视觉中最敏感的信息，网页中色彩处理得好，可以锦上添花，达到事半功倍的效果；可以根据主页内容的需要，分别采用不同的主色调；适合于网页标准色的颜色主要有：蓝色，黄/橙色，黑/白/灰色三大系列色。,标准色彩设计的目标色彩的调和,要求：根据网页的主题确立主色调根据网页的风格特征确定采用单 色 调使用独立颜色调和色调使用相邻色对比色调使用对立色注意色彩重心的平衡,网页色彩搭配的原则（1）,1.使用单色尽管网站设计要避免采用单一色彩，以免产生单调的
15、感觉，但通过调整色彩的饱和度和透明度也可以产生变化，使网站避免单调。2.使用邻近色所谓邻近色，就是在颜色环上相邻近的颜色，例如绿色和蓝色，红色和黄色就互为邻近色。采用邻近色设计网页可以使网页避免色彩杂乱，易于达到页面的和谐统一。,3.使用对比色对比色可以突出重点，产生了强烈的视觉效果，通过合理使用对比色能够使网站特色鲜明、重点突出。在设计时一般以一种颜色为主色调，对比色作为点缀，可以起到画龙点睛的作用。,4.背景色的使用背景色一般采用素淡清雅的色彩，避免采用花纹复杂的图片和纯度很高的色彩作为背景色，同时背景色要与文字的色彩对比强烈一些。,网页色彩搭配的原则（2）,色彩的心理感受,色彩与人的心理
16、感觉和情绪也有一定的关系，利用这一点可以在设计网页时形成自己独特的色彩效果，给浏览者留下深刻的印象。一般情况下，各种色彩给人的感觉是：红色代表热情、活泼、热闹、温暖、幸福、吉祥；橙色代表光明、华丽、兴奋、甜蜜、快乐 橙色较温和，是一种很活泼、辉煌的色彩，富足的、快乐的色彩，稍加黑则较稳重，蓝橙对比时较为生动；黄色代表明朗、愉快、高贵、希望；绿色代表新鲜、平静、和平、柔和、安逸、青春；蓝色代表深远、永恒、沉静、理智、诚实、寒冷；紫色代表优雅、高贵、魅力、自傲；白色代表纯洁、纯真、朴素、神圣、明快；灰色代表忧郁、消极、谦虚、平凡、沉默、中庸、寂寞。色彩中最被动的颜色，受周围的色彩影响极大，靠邻近的
17、色彩获得自己的生命。近冷则暖，近暖则冷，最有平静感（中性），是视觉中最安静的色彩，有很强的调和对比的作用；黑色代表崇高、坚实、严肃、刚健、粗莽；黑与白，非常对立而又有共性，是色彩最后的抽象，能够用来表达富有哲理性的东西。,一、红色的色感温暖，性格刚烈而外向，是一种对人刺激性很强的色。红色容易引起人的注意，也容易使人兴奋、激动、紧张、冲动、还是一种容易造成人视觉疲劳的色。1、在红色中加入少量的黄，会使其热力强盛，趋于躁动、不安。2、在红色中加入少量的蓝，会使其热性减弱，趋于文雅、柔和。3、在红色中加入少量的黑，会使其性格变的沉稳，趋于厚重、朴实。4、在红中加入少量的白，会使其性格变的温柔，趋于含
18、蓄、羞涩、娇嫩。,根据色彩的心理感受选择颜色（1）,二、黄色的性格冷漠、高傲、敏感、具有扩张和不安宁的视觉印象。黄色是各种色彩中，最为娇气的一种色。只要在纯黄色中混入少量的其它色，其色相感和色性格均会发生较大程度的变化。1、在黄色中加入少量的蓝，会使其转化为一种鲜嫩的绿色。其高傲的性格也随之消失，趋于一种平和、潮润的感觉。2、在黄色中加入少量的红，则具有明显的橙色感觉，其性格也会从冷漠、高傲转化为一种有分寸感的热情、温暖。3、在黄色中加入少量的黑，其色感和色性变化最大，成为一种具有明显橄榄绿的复色印象。其色性也变的成熟、随和。4、在黄色中加入少量的白，其色感变的柔和，其性格中的冷漠、高傲被淡化
19、，趋于含蓄，易于接近。,根据色彩的心理感受选择颜色（2）,三、蓝色的色感冷静，性格朴实而内向，是一种有助于人头脑冷静的色。蓝色的朴实、内向性格，常为那些性格活跃、具有较强扩张力的色彩，提供一个深远、广埔、平静的空间，成为衬托活跃色彩的友善而谦虚的朋友。蓝色还是一种在淡化后仍然似能保持较强个性的色。如果在蓝色中分别加入少量的红、黄、黑、橙、白等色，均不会对蓝色的性格构成较明显的影响力。,根据色彩的心理感受选择颜色（3）,四、绿色是具有黄色和蓝色两种成份的色。在绿色中，将黄色的扩张感和蓝色的收缩感相中庸，将黄色的温暖感与蓝色的寒冷感相抵消。这样使得绿色的性格最为平和、安稳。是一种柔顺、恬静、潢足、
20、优美的色。1、在绿色中黄的成份较多时，其性格就趋于活泼、友善，具有幼稚性。2、在绿色中加入少量的黑，其性格就趋于庄重、老练、成熟。3、在绿色中加入少量的白，其性格就趋于洁净、清爽、鲜嫩。,根据色彩的心理感受选择颜色（4）,五、白色的色感光明，性格朴实、纯洁、快乐。白色具有圣洁的不容侵犯性。如果在白色中加入其它任何色，都会影响其纯洁性，使其性格变的含蓄。1、在白色中混入少量的红，就成为淡淡的粉色，鲜嫩而充满诱惑;2、在白色中混入少量的黄，则成为一种乳黄色，给人一种香腻的印象;3、在白色中混入少量的蓝，给人感觉清冷、洁净;4、在白色中混入少量的橙，有一种干燥的气氛;5、在白色中混入少量的绿，给人一
21、种稚嫩、柔和的感觉;6、在白色中混入少量的紫，可诱导人联想到淡淡的芳香。,根据色彩的心理感受选择颜色（5）,5.黑色的使用黑色是一种特殊的颜色，如果使用恰当，设计合理，往往产生很强烈的艺术效果，黑色一般用来作背景色，与其它纯度色彩搭配使用。,根据色彩的心理感受选择颜色（6）,Web安全色,由于同一颜色也许在不同的浏览器上显示了不同的明度或者色相，为了避免这种颜色差异，在制作网页时候尽量采用Web安全色。Web安全色：只眼颜色可以在不同的操作平台上安全、正确的显示出来，在不同的浏览器上几乎没有差异。包括216中颜色：任何由00、33、66、99、CC或者FF组合而成的颜色都是web安全色。,视觉
22、媒体,利用视觉传递信息的媒体位图图像矢量图形动态图像符号,位图图像（一）,位图的概念空间和亮度都已经离散化的图像，图像由可独立赋予颜色和亮度的元素（称之为像素）组成。位图图像主要用于需要精细细节的图像和逼真效果的照片。,图像的基本属性,1、分辨率 显示分辨率：指显示屏上能够显示出的象素数目。同样大小显示屏能够显示的象素越多，说明显示设备的分辨率越高，显示的图像质量也就越高。（640480，1024 768）图像分辨率：指组成一副图像的像素的密度，一般用单位长度上包含像素的个数来衡量。常用单位为DPI（dots per inch），即每英寸多少点。,图像的基本属性,2、像素深度 像素深度是指存储
23、每个像素所用的位数。像素深度决定彩色图像每个像素可能有的颜色数，或者确定灰度图像每个像素可能有的灰度级数。3、调色板 一个彩色图像假如只包含24位真彩色空间中的16个离散的点（16色图），则可以建立一个颜色查找表，表中的每一行记录一组RGB值，实际像素的值用来指定该点颜色在查找表中的索引值，这样就可以大大缩小存储量。这个颜色查找表就叫做调色板。,位图特征,点位图的优点是：（1）显示速度快。（2）真实世界的图像可以通过扫描仪、数码相机、摄像机等设备方便的转化为点位图。点位图的缺点是：（1）存储和传输时数据量比较大。（2）缩放、旋转时算法复杂且容易失真。,位图图像（二）,位图的产生方法用画图程序获
24、得从屏幕上直接抓取用数字化视频或图像获取设备（扫描仪、数码相机、数字摄像机等）使用成品图像库,位图图像（三）,位图处理（1）图像的抓取从显示卡的视频存储器中获取数字位图文件的方法（2）图像的编辑利用图像编辑程序的强大的编辑功能使图像改变形状和颜色从而产生其他特殊的效果。,位图图像（四）,图像压缩图像的数据量很大，为便于存储与传输需要进行压缩，研究图像数据的压缩算法是多媒体技术中的一个核心技术；压缩分为无损压缩和有损压缩两种技术，其中无损压缩的压缩比不高，有损压缩又可能造成图像质量的下降，因此经常采用一些折中的方案；在图像压缩与解压缩过程中都需要时间，为保证实时性的需要通常采用专门的硬件来实现。
25、,位图图像（五）,图像优化对于原始采集的图像，还可以通过对图像的增强、噪声过滤、畸变校正、亮度调整和色度调整等图像优化技术对图像的质量进行调整。,图像的分类（按照色彩）,灰度图,标准单色图 标准灰度图,彩色图,256色标准图像 24位标准图像,位图文件(Bitmap-File，BMP)格式是Windows采用的图像文件存储格式，在Windows环境下运行的所有图像处理软件都支持这种格式。BMP位图文件默认的文件扩展名是bmp。位图文件大小的计算：存储大小行象素列象素24/8(字节）,BMP图像文件格式,GIF（Graphics Interchange Format）格式由CompuServe公
26、司于87年开发，版本号GIF87a，89年扩充后版本号为GIF89a。GIF图像文件以块(block)为单位存储信息。一个GIF文件由表示图形/图像的数据块、数据子块以及显示图形/图像的控制信息块组成，称为GIF数据流(Data Stream)。数据流中的所有控制信息块和数据块都必须在文件头(Header)和文件结束块(Trailer)之间。,GIF图像文件格式,GIF图像文件格式,GIF文件采用了LZW无损压缩算法来存储图像数据。GIF文件允许设置背景的透明属性。GIF文件格式可在一个文件中存放多幅彩色图像并且制作出幻灯片或者动画效果。GIF文件支持图像数据的交叉存储方式，这样一个大的图像可
27、以逐步显示，让用户首先看到图像概貌，然后逐步清晰。GIF文件定义的图像中可以加入文本。,GIF文件格式的特点：,JPEG图像文件格式,JPEG标准委员会没有对JPEG文件格式作出明确的定义，现在被广泛采用的是1992年9月由C-Cube Microsystems公司提出的JPEG文件交换格式（JPEG File Interchange Format，JFIF），版本号为1.02。JFIF文件格式直接使用JPEG标准为应用程序定义的许多标记，因此JFIF格式成了事实上JPEG文件交换格式标准。,矢量图形,简称图形，是一种抽象化的图像；矢量图形使用一组指令集合来描述构成一幅图所包含的直线、矩形、圆
28、弧、曲线等基本图形的形状、位置、颜色等属性和参数；矢量图形在显示时需要相应的软件读取和解释相应的图形指令，并将其转化为屏幕显示需要的形状和颜色；矢量图形由绘图程序产生与编辑，矢量图形可以很方便的转化为位图图像，但其逆过程转换则非常困难。,矢量图与位图的比较,空间矢量图形需要的存储空间要小性能如果图像很复杂，使用矢量图形来表示它，显示时需要占用计算机很多资源，这时采用位图图像要方便的多。,矢量图与位图的比较,矢量图的优点是：（1）缩放、旋转、移动时图像不会失真。（2）存储和传输时数据量较小。矢量图的缺点是：（1）图像显示时花费时间比较长。（2）真实世界的彩色图像难以转化为矢量图。,音频（一）,声
29、音与听觉器官声音是携带信息的极其重要的媒体，是多媒体技术研究中的一个重要内容。声音是通过空气传播的一种连续的波，叫声波。声音的强弱体现在声波压力的大小上，音调的高低体现在声音的频率上。声音用电表示时，声音信号在时间和幅度上都是连续的模拟信号，如下图所示。,声波,音频（二）,人们是否能够听到音频信号，主要取决于个人的年龄和耳朵的特性。人的听觉器官能感知的声音频率大约在2020000 Hz之间，感知的声音幅度大约在0120 dB之间。声音信号的两个基本参数是频率和幅度。信号的频率是指信号每秒钟变化的次数，用 Hz 表示。频率范围为20Hz20kHz 的信号称为音频(Audio)信号；人的发音器官发
30、出的声音频率大约是803400Hz，人说话的信号频率通常为3003000 Hz，人们把在这种频率范围的信号称为话音(speech)信号；高于20kHz的信号称为超音频信号或称超声波。,音频（三）,声波具有波的特性，如反射(reflection)、折射(refraction)和衍射(diffraction)等。对声音信号的分析表明，声音信号由许多频率不同的信号组成，这类信号称为复合信号，而单一频率的信号称为分量信号。声音信号的一个重要参数就是带宽，它用来描述组成复合信号的频率范围。如高保真声音信号(high-fidelity audio)的频率范围为10Hz20000 Hz，它的带宽约为20kH
31、z，而视频信号的带宽是6 MHz。,音频（四）,音频属于听觉类媒体，包括波形声音、语音和音乐。人们能够感知的音频信号称为波形声音，它可包含所有的声音形式；人类发出的声音不仅可以看成是一种波形声音，而且还具有其内在的语言、语言学的内涵，这就是语音，语音可以使用特殊的方法进行提取，它也被视为是一种媒体；音乐是符号化的声音，这种符号就是乐谱，乐谱是转化为符号的声音，MIDI就是其一种形式。,音频（五）,根据声音的频带，通常把声音质量分成5个等级，分别是：电话(telephone)调幅(amplitude modulation，AM)广播调频(frequency modulation，FM)广播激光唱
32、盘(CD-Audio)数字录音带(digital audio tape，DAT)声音。声音信息具有时间上的前后相关性和连续性，因此被称为：连续型时基媒体。,数字音频（一）,声音进入计算机的第一步就是数字化，数字化实际上是对声音信号的采样和量化。连续信号的离散化通过采样来实现，就是每隔相等的一小段时间间隔对信号测量一次，这种采样称为均匀采样(uniform sampling)；对连续幅度声音信号的离散化通过量化(quantization)来实现，就是把信号的强度划分成一小段一小段的，如果幅度的划分是等间隔的，就称为线性量化，否则就称为非线性量化。下图表示了声音信号数字化的概念。,声音的量化,数字
33、音频（二）,1、声音的数字化过程,数字音频（三）,2、声音的采样频率与量化分辨率我们把在时间和幅度上都是连续的信号称为模拟信号。而在某些特定的时刻对这种模拟信号进行的测量叫做采样(sampling)，采样重复的频率称为采样频率，由这些特定时刻采样得到的信号称为离散时间信号。如果把信号幅度取值的数目加以限定，这种由有限个数值组成的信号就称为离散幅度信号。显而易见，反映某一瞬间信号幅度的二进制编码位数越多，其可分辨的模拟信号的幅度就越精细，也就是分辨率越高。,数字音频（四）,常用声音信号数字化时使用的采样速率与分辨率指标如下：,数字音频（五）,3、声音文件将数字化的声音信号保存成计算机文件的形式，
34、这种文件就是声音文件。声音文件的大小与下列因素相关：分辨率 r(BIT)采样速率 R(KHz)声道数声音文件的大小按下式计算S=R*D(r/8)*1(单声道)S=R*D(r/8)*2（立体声）,数字音频（六）,声音文件的存储格式存储声音数据的文件也需要特定的存储格式。目前比较流行的声音文件格式有（文件的扩展名）：.wav(waveform)；.au(audio)；.aiff(Audio Interchangeable File Format)；.snd(sound)。.wav格式主要用在PC上，.au主要用在Unix工作站上，.aiff和snd主要用在苹果机和美国视算科技有限公司(Silico
35、n Graphics，Inc.，SGI)的工作站上。,数字音频（七）,（1）WAV文件又称波形文件，是Microsoft公司的音频文件格式，由采样数据组成，没有经过压缩处理。（2）VOC文件是Creative公司的波形文件格式，由文件头块和音频数据块组成。（3）MIDI文件是英文Musical Instrument Digital Interface的缩写，是一种应用于音乐的技术规范。（4）其它（PCM、AIF等）,乐器数字接口（MIDI）,Musical Instrument Digital Interface的缩写MIDI提供了描述合成音乐的乐谱的协议，规定了各种电子乐器和计算机之间连接的
36、物理接口和数据传输的规程。MIDI文件是记录MIDI信息的标准格式文件，包含音符、定时和16个通道的乐器定义以及键号、通道号、持续时间、音量和击键力度等每个音符的有关信息。MIDI文件使用音序器（一种为MIDI作曲而设计的软件或硬件设备）来进行记录、播放和编辑。MIDI文件保存的是演奏音乐的指令而不是波形数据，因此比波形文件要求的存储空间要小的多。MIDI作品以MIDI文件的形式保存的音乐作品,数字化声音和MIDI的比较,数字化的声音是声音的实际表示，代表了声音的瞬时幅度，与设备无关，每次播放都发出相同的声音；MIDI数据是与设备相关的，产生的声音与用来播放它的特定MIDI设备有关。,MIDI
37、数据优点,文件紧凑，文件大小与回放质量无关；声音的回放质量取决于MIDI回放设备；MIDI数据是完全可编辑的；创建MIDI作品需要较多的音乐理论知识；音序器的使用要简易的多。,MIDI数据缺点,MIDI 数据不是声音的真实描述，只有产生它的设备与回放它的设备一致时，回放的结果才是精确的；MIDI 主要用来处理音乐，语音和直接获取的声音是很难使用的。,如何选择数字化声音或MIDI,（1）选择MIDI没有足够的RAM、硬盘和CPU等资源；具有高质量的声源；能完全控制回放的硬件；没有语音对话的要求（2）选择数字化声音不能完全控制回放的硬件；有足够的资源处理数字文件；有语音对话的需求。,在网页中使用声
38、音,作为背景音乐注意文件格式注意播放条件作为内容注意文件格式注意播放条件作为下载服务,声音的编辑与各式转换,使用声音制作工具软件Adobe Auditioncakewalk pro audio,动画,是指运动的画面，是一种信息交换工具；最初的动画用于电影，采用手工制作；计算机动画产生于20世纪60年代，现今计算机动画已经成为影视作品中不可或缺的重要组成部分与创作手段并且在多媒体作品与网络媒体中被大量应用。,视觉暂留,是人眼的一种生物现象；当人眼观察过物体之后，物体的影像会在人眼的视网膜上保留短暂的时间；此时如果以足够快的速度不断变化，而且每次仅略微改变物体的形状和位置，人的眼睛将感觉到是物体在
39、作连续运动。动画就是利用了人眼的这种视觉暂留现象，把一幅幅略微变化的图画分别录制下来后再连续播放，从而获得动画的效果。,造型动画和帧动画,用计算机实现动画有两种；帧动画由连续的图画组成的图像或图形序列造型动画对每一个活动对象分别进行运动设计，然后由这些对象组成完整的图画并实时转换形成连续的动画过程使用计算机制作动画，需要专门的软件工具，而且仅需要作出关键帧，其它中间画面可由软件内插来完成。,帧动画的基本理论,帧动画的种类帧帧（逐帧）动画过渡（补间）动画运动动画变形动画交互动画动画对象、场景、舞台、帧关键帧图层,动画的技术参数,帧速度单位时间播放的帧画面的数量（常用的帧速度有30帧/秒、25帧/
40、秒）。数据量帧速度乘以单幅图像的数据量就得到动画播放的数据量，它直接决定播放设备的处理能力。图像质量是评价图画质量的技术指标，它直接与数据的压缩倍数有关。,在网页中使用动画,GIF动画FLASH动画其他,文字的表示,文字是人与人之间，人与计算机之间进行信息交换的主要媒体；文字包括多种文种，我们主要使用的是西文和汉字；在计算机中文字使用二进制编码表示，所谓二进制编码就是利用固定位数的二进制数码的不同排列组合形式来表示数据的一种方法。,汉字的编码,包括：GB码、UCS码、Unicode码、GBK码、BIG5码等UCS码：是国际标准通用多八位编码字符集(Universal Code Set)，是一种
41、世界各种文字的统一的编码方案，一个字符占4个字节。Unicode码：另一国际标准，采用双字节编码表示世界上的主要文字，其字符集内容与UCS的BMP相同。GBK码：等同于UCS的中文编码扩展国家标准，2字节表示一个汉字。BIG5码：台湾、香港地区普遍使用的一种繁体汉字的编码标准，包括440个符号，一级汉字5401个、二级汉字7652个，共计13060个汉字。,文字对象的处理,正确选择文字编码英语（ASCII）简体中文（GB2312）繁体中文（BIG5）用正确的方法格式化文本利用CSS样式等格式化文本利用特效格式化文本,汉字的输入编码,数字编码国标区位码，用数字串代表一个汉字输入 字音编码以汉字拼音为基础的输入方法字形编码用汉字的形状（笔划）来进行的编码例如五笔字形混合编码,汉字的表示方法,汉字的输入编码、交换码、汉字内码、字模码是计算机中用于输入、内部处理、交换、输出四种不同用途的编码。,字符代码化（输入）,字模码,汉字的字模码为：16位 16位=32字节,汉字字模点阵及编码,
