山东大学《网站设计与建设》课件第4章 多媒体与Web设计

第第4章章 多媒体与多媒体与Web设计设计第一部分 Web基础知识41多媒体Web设计原则n多媒体技术不是各种信息媒体的简单组合，它是一种把文本、图形、图像、动画和声音等形式的信息结合在一起，并通过计算机进行综合处理和控制，能支持完成一系列交互式操作的信息技术。n特性：交互性和非线性。网站使用多媒体应遵守的一般设计原则：n根据网站主题选择多媒体n重视网络带宽，慎用视频n网页应避免使用背景音频n避免网页使用零乱的动画n网页中避免使用滚动文本n网站中避免使用特别插件例如Flash，MediaPlayer，QuickTime、RealPlay和Shockwave插件等。n网站拒绝最新最耀眼技术。n避免网站设计的版权侵害n珍惜珍惜WebWeb用户时间用户时间- -时刻吸引用户时刻吸引用户42动画与Web设计nWeb动画从简单的动画GIF图像到3D动画以及虚拟环境n合理使用动画可以达到事半功倍的效果n在设计中切不可滥用n动画：动画：利用人的视觉暂留特性，快速播放一系列连续运动变化的图形图像，也包括画面的缩放、旋转、变换、淡入淡出等特殊效果。n动画是由一系列静态画面连续地播放形成的，每个动画页面称为帧(Frame)，一秒钟动画所包含的帧数称为帧速率(fps)，计算机上的动画一般达到15fps时，播放就已经很流畅了。(DVD帧速率：30fps；电影帧速率：24fps)最常使用的基本动画类型nGIF动画有多幅静态GIF图片组合而成，它制作简单，并得到了浏览器的广泛支持。其原理类似于播放幻灯片。动画GIF一般用于条幅广告、口号或同一类多幅图片的展示。但是它的缺点同样突出：没有声音，不能停止播放。GIF动画的制作工具有Photoshop，UleadGIFAnimator和GIFMovieGear等。nJavaScript或VBScript创建动画可以使用DOM+CSS改变元素的外观，而通过每隔一段时间调用一次改变元素外观的函数，实现类似Flash的渐类动画。n翻转动画(Rollovers)翻转动画主要用于按扭、图像或者网页上的其他指定区域，当用户鼠标滑过时触发动作，翻转动画通常用于导航元素，它们给用户创建交互事件，也可以是一个超级链接。nFlash动画Flash功能强大并且被很多网站使用需要下载Flash插件。AdobeFlash现在已是Web动画的事实工业标准，因此WebFlash动画应采用AdobeFlash。2005年Adobe公司并购了Mediamedia公司，AdobeFlashCS3Professional是MacromediaFlash的后继产品。ImageReadyn可以将Photoshop的图像操作最优化，在图像质量不明显削弱的前提下，尽可能地减少文件的体积。n可以通过分割图像自动制作HTML文档虽然在Photoshop中也可以进行一些基本的切片操作，但无法组合、对齐或分布切片。ImageReady具备专业的切片面板和菜单，其切片编辑功能要比Photoshop更强大n可以制作简单的GIF动画。n但ImageReady不支持CMYK色彩模式，无法进行与印刷相关的图像操作，n它是专门的网络图像处理工具。例子常见的动画设计效果主要有：n条幅信息循环水平滚动播出n新闻通知等标示图标色彩图案交替显示(跳动与闪动)n纵向滚动新闻通知的标题超链接信息n沿某一定轨迹运动的悬浮通知n多幅新闻照片或风光照片的循环切换n某些元素的色彩循环动画n元素的缓慢旋转，旋转结束标示网页或图片等下载完成n元素的闪烁、淡入、淡出、爆炸与组合n图像之间的过渡与变形n子导航的弹出以及与主题相关的Flash动画43视频与Web设计nWeb视频一般分辨率低、像素少、帧速率低、尺寸小n自动播放/用户启动nn点击播放1.5MBAVIVideo视频文件的几个主要格式：nAVI格式(.avi)音频视频交错(AudioVideoInterleaved)是计算机上最常见的音频和视频数据格式Microsoft公司开发的,媒体播放器AVI格式允许视频和音频交错在一起同步播放，支持256色和RLE压缩nAVI文件并未限定压缩标准，因此，AVI文件格式只是作为控制界面上的标准，兼容性差，文件比较大，n用不同压缩算法生成的AVI文件，必须使用相应的解压缩算法才能播放出来。AVI文件目前主要应用在多媒体光盘上，用来保存电影、电视等各种影像信息，不适宜Web视频，但有时也出现在Internet上，供用户下载、欣赏新影片的精彩片断。n自动播放.avi格式的注释：注释：dynsrc属性不是标准的HTML或XHTML元素。仅有InternetExplorer支持该属性。nInternetExplorer和Netscape都支持元素W3C推荐使用元素来代替它nnQuickTime格式(.mov、.qt)QuickTime是Apple计算机公司开发的一种音频、视频文件格式，QuickTime文件格式支持25位彩色，支持RLE、JPEG等领先的集成压缩技术，提供150多种视频效果，并配有提供了200多种MIDI兼容音响和设备的声音装置。新版的QuickTime进一步扩展了原有功能，包含了基于Internet应用的关键特性，能够通过Internet提供实时的数字化信息流、工作流与文件回放功能，QuickTime还采用了一种称为QuickTimeVR(简作QTVR)技术的虚拟现实(VirtualReality，VR)技术，用户通过鼠标或键盘的交互式控制，可以观察某一地点周围360度的景像，或者从空间任何角度观察某一物体。拥有称为H.264的先进视频压缩技术下载插件n在因特网上，QuickTime是一种普遍的格式，但是如果没有额外的组件（免费），QuickTime电影无法在非Windows的计算机上播放。n通过object元素，可轻松将播放QuickTime影片的代码添加到网页中。如果用户计算机中未安装QuickTime播放器，则可将object设置为自动安装QuickTime播放器。nMPEG格式(.MPEG/.MPG/.DAT)MPEG的全名为MovingPicturesExpertsGroup/MotinPicturesExpertsGroup，中文译名是动态图像专家组MPEG文件格式是运动图像压缩算法的国际标准，它包括MPEG-1，MPEG-7MPEG标准包括MPEG视频、MPEG音频和MPEG系统(视频、音频同步)三个部分，nMP3音频文件就是MPEG音频的一个典型应用n利用MPEGAudioLayer3的技术，将音乐以1:10甚至1:12的压缩率，压缩成容量较小的文件，而对于大多数用户来说重放的音质与最初的不压缩音频相比没有明显的下降nH.264，同时也是MPEG-4第十部分，高度压缩数字视频编解码器标准nRealVideo格式(.RA/.RM/.RMVB)流式传输由RealNetworks公司开发的RealVideonRealProducerG2和RealEncoder编码器n转换其它格式的视频文件来实现，这种技术为视频的网上出版展示了美好的前景。RMVB影片格式比原先的RM多了VB两字，在这里VB是VBR（VariableBitRate-可变比特率）的缩写RealMedia是目前Internet上最流行的跨平台的客户/服务器结构多媒体应用标准，其采用音频/视频流和同步回放技术实现了网上全带宽的多媒体回放。在RealMedia规范中主要包括三类文件：RealAudio（用以传输接近CD音质的音频数据）、RealVideo（用来传输连续视频数据）和RealFlash（RealNetworks公司与Macromedia公司合作推出的新一代高压缩比动画格式）。播放框：http:/;width=356height=285nASF格式(.ASF)Microsoft公司推出的AdvancedStreamingFormat(ASF，高级流格式)是一个在Internet上实时传播多媒体的技术标准，ASF是存储同步多媒体数据的可扩展文件格式，它支持通过各种网络和协议传送数据。Microsoft公司希望用ASF取代QuickTime之类的技术标准。ASF的主要优点包括：本地或网络回放、可扩充的媒体类型、部件下载以及扩展性等。ASF应用的主要部件是NetShow服务器和NetShow播放器。有独立的编码器将媒体信息编译成ASF流，然后发送到NetShow服务器，再由NetShow服务器将ASF流发送给网络上的所有NetShow播放器，从而实现单路广播或多路广播。这和Real系统的实时转播则是大同小异。ASF文件能够被深度压缩，同时能够以连续的数据流进行传输（在线电视和广播）。该格式的文件可以是任何大小，同时能够被压缩以适应不同的带宽（连接速度）。RM和ASF格式可以说各有千秋，通常RM视频更柔和一些，而ASF视频则相对清晰一些nWMV格式(.WMV)WMV又是一种独立于编码方式的在Internet上实时传播多媒体的技术标准，Microsoft公司希望用其取代QuickTime之类的技术标准以及WAV、AVI之类的文件扩展名。WMV的主要优点包括：本地或网络回放、可扩充的媒体类型、部件下载、可伸缩的媒体类型、流的优先级化、多语言支持、环境独立性、丰富的流间关系以及扩展性等。WMV的设计目标是处理各种类型的视频内容。该格式的文件能够被深度压缩，且能够传输连续的数据流（在线广播）。WMA文件可以是任何大小，同时能够被压缩以适应不同的带宽（连接速度）。WMV格式与ASF格式类似。WMV-HD的数据压缩率与H.264一样，两者的应用领域也极其相似，一般采用.wmv为后缀的HDTV文件就是采用的WMV-HD压缩的。44音频与Web设计nWeb音频主要有内嵌音频和可下载音频n内嵌音频在网页设计中一般是拒绝背景音频的。内嵌音频一般主要用于视频、Flash动画的伴音orn可下载音频音频文件完全下载到用户客户端后，使用WindowsMediaPlayer或RealOnePlayer等媒体播放器进行播放，用户可以对音频完全控制：回放、暂停、停止、音量n1)midiMusialInstrumentDigitalInterface(乐器的数字化接口)的缩写，用于在音乐器材、合成器和计算机之间交换音乐信息的标准协议。n在现代音乐制作上，MIDI的地位已不可取代，不论是影视音乐还是广告音乐，MIDI部分事实上占了主要地位，而真实乐器是表现旋律的载体。MIDI的最大特点是文件长度很小，但声音机械，一般用于背景音乐，不适合网上广播。MusicMasterWorks是一款MIDI制作软件WhenwouldIuseMIDImusic?Page381n2)ra/.rm/.ramRealNetworks格式的文件扩展名有RA、RM、RAM，RA、RM文件是真正存储数据的文件；RA、RM格式的文件既有音频，也有视频；RAM文件通常应用在网页中，它是一个文本文件，其中包含RA或RM文件的路径，点击其链接后会启动RealPlayer来播放RA或RM文件。n3).mp3此标准也是从早期的MPEG工作的基础上发展而来的。它是一种音频压缩技术，是MPEG-1和MPEG-2规范的一部分。保真度MP4，全称MPEG-4 Part 14，是一种使用MPEG-4的多媒体电脑档案格式，副档名为.mp4，以储存数码音讯及数码视讯为主n音频音频MP4格式：格式：AAC。n4).wavWindows使用“波形音频”(WAV)文件格式将声音存储为波形。一分钟的使用“脉冲编码调制”(PCM)编码的声音可以占用少则644KB或多达27MB的存储空间。这一存储空间大小取决于采样频率、声音的类型（单声道或立体声）和用于采样的位数。n5).swfn6).mov/.qtn7).auUnix音频(.au)文件是使用UNIX生成的声音文件。n8).wma2910.多媒体网站设计考虑的主要因素网站主题客户群用户感受网络带宽下载时间浏览器分辨率慎用插件页面协调慎用视频背景音乐 慎用视频慎用视频