1、网络多媒体信息编辑项目四目录页第 2 页 2 网络图片编辑网络动画编辑网络音视频编辑经典案例过渡页第 3 页网络图片编辑网络动画编辑网络音视频编辑经典案例第 4 页正文 .任务描述随着网络技术的不断发展，图片已经成为媒体传播信息中的一种重要形式。好的图片不但可以为报道增姿添彩，还常常能取得事半功倍的效果。第 5 页正文 . （一）网络图片的类型 （二）网络图片的格式一、网络图片的类型及格式第 6 页正文 .（一）网络图片的类型1照片 照片是网络新闻中最常见的图片类型。照片通常分为新闻照片和非新闻照片两大类。新闻照片就是以新闻事件、新闻人物为拍摄对象，再现新闻现场情景的照片，其可以作为独立的新闻
2、报道出现在版面上，也可以配合文字报道一同编发。第 7 页正文 .（一）网络图片的类型2图示网络新闻中的图示一般可分为两大类：一类是新闻图表，主要有折线图、饼图、柱状图、架构图另一类是新闻图示，多为对事件发生的时间、地点、路线等的描述。第 8 页正文 .（一）网络图片的类型3漫画 漫画是用简单而夸张的手法来描绘生活或时事的一种艺术形式。4图饰 图饰是指仅作为版面装饰的图片，它不传播任何新闻要素信息。第 9 页正文 .1JPEG格式JPEG（Joint Photographic Experts Group）图像是网页中最常用的图像格式，其采用的有损压缩算法能够在提供良好压缩性能的同时，展现十分丰富
3、生动的图像。缺点：对图像压缩越多，信息丢失就越多，从而导致图像变得模糊、朦胧、无法看清。所以在将文件保存为JPEG格式时，需要在压缩率与质量之间有一个平衡。（二）网络图片的格式第 10 页正文 .2GIF格式GIF（Graphics Interchange Format）格式采用无损压缩技术，只要图像不多于256种颜色（8位颜色），就可既减小文件大小，又保持成像质量。GIF格式普遍适用于图表、按钮、剪贴画等只需要少量颜色或相对简单的图像。另外，GIF格式支持透明功能和动画效果。其动画效果的实现是通过在一个GIF文件中保存多幅图像，把存于该文件中的多幅图像数据逐幅读出并显示到屏幕上，即构成一种最
4、简单的动画。（二）网络图片的格式第 11 页正文 .3PNG格式PNG（Portable Network Graphic Format）图像文件格式，其设计目的是试图替代GIF和TIFF文件格式，同时增加一些GIF文件格式所不具备的特性。PNG格式支持24位全彩色，其采用非破坏性压缩，可以完整和精确地保存图像的亮度和彩度，同时提供比GIF和JPEG格式还快的交错格式及更好的透明背景。缺点：其采用无损压缩方式，因此文件通常比JPEG大，但小于GIF格式文件。（二）网络图片的格式第 12 页正文 . （一）网络图片的编排（二）网络图片的原则二、网络图片的编排与应用原则第 13 页正文 .1图片放在
5、页面左上方将图片放在页面左上方符合人们从左到右的视觉和阅读习惯，一般左上方是人们阅读和浏览的视觉起点。许多网站的首页、频道或栏目首页都采用这种方式，如新浪网“新闻”频道便采用了这种编排方式。（一）网络图片的编排第 14 页正文 .2图片放在页面右上方这种编排方式相对于将图片放在页面左上方来说要少一些，所以往往能在视觉和阅读感受上给受众以突破的感觉。Tom新闻中心便采用了这种方式（一）网络图片的编排第 15 页正文 .3采用多个小图纵向或横向排列通过水平、垂直线分割，将多幅图像在页面上整齐有序地排列成块状，这种结构使得页面生动活泼，具有强烈的整体感和秩序美感，如图4-7所示的搜狐网“读书”频道便
6、采用了这种编排方式。（一）网络图片的编排第 16 页正文 .4放置在消息正文的正上方一般在新闻正文的报道页面中，图片放置在正文的正上方；有时也会将图片插入到正文中，从而起到调节版面的作用。（一）网络图片的编排第 17 页正文 .在编辑图片过程中，必须对图片的真实性进行判断，这样才能维护新闻的真实性。同时图片的使用必须恰当，要避免误导受众。真实性思想性是指图片要能突出文章的重点，图文搭配要合理，另外要审核图片有没有脱节或偏离主题的现象。尤其为新闻报道配发的图片，更要注意图片的选用。思想性艺术性好的图片不仅仅能简单地图解文字，还是在报道文章内容的前提下进行的艺术再创作。（二）网络图片的原则实用性在
7、满足真实性、思想性、艺术性原则的基础上，从编辑的角度来讲，图片还应便于排版，这一点对网页的整体美观也是非常重要的。第 18 页正文 . （一）Photoshop的工作界面面 （二）文档的新建、打开及保存三、常用图片编辑软件Photoshop的使用 （三）图像基本操作第 19 页正文 .启动Photoshop CS6，打开文档后进入其工作界面，如图4-8所示。界面最上方是菜单栏和程序窗口控制按钮，下面为工具属性栏，左侧为工具箱，中间为文档窗口，右侧有各种功能面板。（一）Photoshop的工作界面第 20 页正文 .菜单栏和程序窗口控制按钮： Photoshop CS6的菜单栏分为两部分。左边显
8、示了Photoshop程序图标，右击该图标可打开一个快捷菜单；右边是各种菜单，Photoshop的大部分功能、命令分门别类地放在这些菜单中，只要单击某一菜单，便会弹出其下拉菜单。菜单栏的右边是程序窗口控制按钮，分别单击这3个按钮 ，可以最小化、最大化和关闭程序窗口。（一）Photoshop的工作界面第 21 页正文 .工具属性栏：当用户从工具箱中选择某种工具后，在菜单栏下方的工具属性栏中就可以设置相应工具的属性和参数，如图4-11所示。而工具属性栏也会随着所选工具的不同而变化。（一）Photoshop的工作界面第 22 页正文 .工具箱：Photoshop CS6的工具箱中包含70余种工具。这
9、些工具大致可分为选区制作工具、绘画工具、修饰工具、颜色设置工具及显示控制工具等几类，可以使用这些工具方便地编辑图像、绘制图形等。要使用某种工具，单击该工具即可。部分工具的右下角带有黑色小三角。在该按钮上按住鼠标左键不放，可从弹出的工具列表中选择所需工具。（一）Photoshop的工作界面第 23 页正文 .文档窗口：文档窗口是显示和浏览图像文件的区域，也是绘制、编辑和处理图像的区域。文档窗口带有自己的标题栏；当打开多个文档时各个标题栏将并列显示，通过单击标题栏名可在各文档之间切换。单击并拖动某个标题栏可使该文档脱离文档窗口，变为浮动状态，此时也叫图像窗口。（一）Photoshop的工作界面第
10、24 页正文 .1新建文档步骤1 选择“文件”“新建”菜单，弹出“新建”对话框；步骤2 在“新建”对话框中设置文件名称、宽度、高度、分辨率、颜色模式、背景颜色及高级选项等设置。设置完成后，单击“确定”按钮，即可创建一个新文档。（二）文档的新建、打开及保存第 25 页正文 .2打开图像文件步骤1 选择“文件”“打开”菜单，弹出“打开”对话框步骤2 在“打开”对话框的“查找范围”下拉列表中选择文件所在目录，在文件列表中找到要打开的文件并单击选中，然后单击“打开”按钮即可打开文件。（二）文档的新建、打开及保存第 26 页正文 .3保存图像文件步骤1 如果要保存的图像为新建文件，选择“文件”“存储”菜
11、单（或按下【Ctrl+S】组合键）。步骤2 在“保存在”下拉列表中选择文件要存放的位置（磁盘/文件夹），在“文件名”文本框中输入文件的名称，在“格式”下拉列表中选择所需保存的文件格式。步骤3 设置完成后，单击“保存”按钮，即可将文件保存在指定的文件夹中。在编辑图像时，如果不希望对源图像文件进行更改，可选择“文件”“存储为”菜单，或按【Ctrl+Shift+S】组合键，将编辑后的图像文件以其他名称保存。（二）文档的新建、打开及保存第 27 页正文 .1调整图像大小步骤1 打开本书配套素材“素材与实例”“Ph4”文件夹中的“小花.jpg”文件。选择“图像”“图像大小”菜单，打开“图像大小”对话框。
12、步骤2 在对话框中“像素大小”选项区的“宽度”或“高度”文本框中输入值。图像的高度、宽度和分辨率变小的同时，在对话框的上方可看到图像大小也由之前的7.66M，减小到1.23M，单击“确定”按钮，关闭对话框，可调整图像的大小与分辨率。（三）图像基本操作第 28 页正文 .2裁剪图像步骤1 打开本书配套素材“素材与实例”“Ph4”文件夹中的“外国美女.jpg”文件。在工具箱中选择“裁剪工具” ，在图像中按住鼠标左键不放并拖动以绘制裁切区域，释放鼠标后，将出现一个裁剪框，裁剪框外是被裁剪掉的图像区域。步骤2 裁剪框可以移动、缩放、旋转或移动旋转支点。根据需要设置好裁剪框后，按【Enter】键可确认裁
13、切操作。创建裁剪框后，若要取消裁切，可按【Esc】键。（三）图像基本操作第 29 页正文 .（三）图像基本操作 3调整图像颜色 Photoshop CS6中的色彩和色调调整命令都位于“图像”“调整”菜单下，利用它们可以轻而易举地调整出色彩鲜艳绚丽的图像。 步骤1 打开本书配套素材“素材与实”“Ph4”文件夹中的“门.jpg”文件。第 30 页正文 .步骤2 选择“图像”“调整”“色阶”菜单，或按【Ctrl+L】组合键，打开“色阶”对话框。从“色阶”直方图中可以看出，该照片的像素基本上分布在中等亮度和暗部区域，对话框的中间部分称为直方图，其横轴代表亮度范围（从左到右为由全黑过渡到全白），纵轴代表
14、处于某个亮度范围内的像素数量。调整图像的色调就是通过移动“色阶”对话框中“直方图”下方几个滑块的位置，重新为图像设定正确的黑白场和中间亮度值来实现的。（三）图像基本操作第 31 页正文 .步骤3 将“输入色阶”左侧的黑色滑块 稍微向右移动，可以看到照片变暗了。拖动中间的灰色滑块和右侧的白色滑块可看到图像亮度的变化。（三）图像基本操作第 32 页正文 .步骤4 按住【Alt】键，“色阶”对话框中的“取消”按钮变成“复位”按钮，单击“复位”按钮，使各项参数恢复到初始状态。步骤5 将“输入色阶”的灰色滑块稍向左移动提亮部分黑色像素区域。将白色滑块向左移动，确定该点为图像最亮的点，也称为“白场”。将“
15、输入色阶”的黑色滑块稍微向右移动一点，确定该点为图像最暗的点，也称为“黑场”，如图4-24a所示。（三）图像基本操作第 33 页正文 .步骤6 这样，图像有了最暗和最亮的像素，色调就基本正常了。最后单击“确定”按钮，关闭对话框。除自己调整色阶外，还可以使用“图像”菜单下的“自动色调”“自动对比度”等命令，让系统自动调整图像色调和对比度。限于篇幅原因，此处不做详细介绍。（三）图像基本操作第 34 页正文 .4创建选区创建图像选区的工具有许多种，其中“矩形选框工具” 、“椭圆选框工具” 、“单行选框工具” 和“单列选框工具” 主要用来创建规则选区。除规则选区工具外，Photoshop CS6还提供
16、了3种套索工具：“套索工具” 、“多边形套索工具” 和“磁性套索工具” 。利用它们可以非常方便地绘制出各种不规则选区。下面以“套索工具” 为例，介绍创建不规则选区的方法。（三）图像基本操作第 35 页正文 .步骤1 打开本书配套素材“素材与实例”“Ph4”文件夹中的“游船.jpg”文件，选择“套索工具” ，将光标移至图像窗口中木船的左侧，按住鼠标左键不放并沿着木船的轮廓拖动步骤2 当鼠标回到起点时释放鼠标按钮，可得到一个封闭的选区。（三）图像基本操作第 36 页正文 .步骤3 如果直接将选区内的木船图像拖至其他图像窗口中，图像的边缘会非常生硬，此时就需要对选区进行羽化处理。按【Shift+F6
17、】组合键，在弹出的“羽化选区”对话框中设置“羽化半径”为10像素。单击“确定”按钮，关闭对话框。步骤4 打开本书配套素材“素材与实例”“Ph4”文件夹中的“凉亭.jpg”文件，用“移动工具” 将选区内的小木船拖至“凉亭.jpg”图像窗口中，并放置在合适的位置。这么简单的几步就使湖面上多了一只小木船。（三）图像基本操作第 37 页正文 .5图层的基本操作我们可以把“图层”理解为几层透明的玻璃叠加在一起，每层玻璃上都有不同的画面，可以单独对每层玻璃上的图像作处理，而不会影响其他层的图像。改变图层的顺序和属性可以改变图像的最后显示效果。右边图像文件是由“背景”“图层1”“图层2”3个图层组成的。（三
18、）图像基本操作第 38 页正文 .在Photoshop CS6中，利用“图层”面板可以显示和编辑当前图像窗口中的所有图层，如创建图层、删除图层、重命名图层，调整图层顺序，创建图层组和图层蒙版等。（三）图像基本操作第 39 页正文 .（1）选择图层要对某个图层中的图像进行编辑操作，首先要选中该图层。选择图层的方法如下：在“图层”面板中，单击某个图层可选中该图层，将其置为当前图层。要选择多个连续的图层，可在按住【Shift】键的同时单击首尾两个图层。要选择多个不连续的图层，可在按住【Ctrl】键的同时依次单击要选择的图层。注意：按住【Ctrl】键单击时不要单击图层缩览图，否则将载入该图层的选区。要
19、选择所有图层（背景图层除外），可选择“选择”“所有图层”菜单。（三）图像基本操作第 40 页正文 .（2）删除与复制图层要删除不需要的图层，可在“图层”面板中选中要删除的图层，然后单击面板下方的“删除图层”按钮 。要复制图层，可在“图层”面板中选中要复制的图层，然后将其拖至“新建图层”按钮 上。（3）调整图层的叠放顺序调整图层叠放顺序的方法非常简单，在要移动的图层上单击并按住鼠标向上或向下拖动，即可向上或向下移动图层。（三）图像基本操作第 41 页正文 .（4）图层的隐藏与显示当一幅图像有多个图层时，可通过隐藏一些图层以方便查看其他图层上的内容。隐藏图层的方法很简单，只需单击要隐藏图层左侧的眼
20、睛图标 即可关闭该层的显示（三）图像基本操作第 42 页正文 .6文本的基本操作在Photoshop中，系统提供了4种文字工具：“横排文字工具” 、“直排文字工具” 、“横排文字蒙版工具” 和“直排文字蒙版工具”。（1）输入文本普通文本是一个水平或垂直的文本行，选择“横排文字工具” 或“直排文字工具” 后，在图像中单击鼠标左键，然后使用键盘输入文字即可。（三）图像基本操作第 43 页正文 .步骤1 打开本书配套素材“素材与实例”“Ph4”文件夹中的“又见秋叶.jpg”文件，选择工具箱中的“直排文字工具” 步骤2 属性设置好后，在图像中单击，待闪烁光标出现后，即可开始输入文字。此时系统会自动新建
21、一个文字图层。（三）图像基本操作第 44 页正文 .（2）选择文本要编辑文字，首先要选取文字，其操作方法有以下两种:双击文本图层缩览图，可将该层的所有文字选中。选择“横排文字工具” 或“直排文字工具” ，然后将光标移至文字区单击，系统会自动将文字图层设置为当前图层，并进入文字编辑状态，此时即可按住鼠标左键不放拖动选中单个或多个文字。（三）图像基本操作第 45 页正文 .（3）设置文本格式设置文本格式包括设置文本的字体、字号、颜色、字符间距等参数，具体方法为：首先选中要设置的文本，然后在工具属性栏中的相应设置项中进行设置即可。如果工具属性栏中没有需要的设置项（比如字符间距），可以选择“窗口”“字
22、符”菜单，打开“字符”面板进行设置。如要设置段落格式，可选择“窗口”“段落”菜单，打开“段落”面板进行设置。（三）图像基本操作第 46 页正文 .“字符”面板中常用设置项的意义：设置行距 ：用于设置文字行与行之间的距离。设置所选字符的字距 ：可以设置文字之间的距离，值越大，字符之间的距离越大。垂直缩放 ：用于设置字符的缩放高度。水平缩放 ：用于设置字符的缩放宽度。设置基线偏移 ：设置文字基线（下边线）偏移，正值上移，负值下移。单击相应的按钮分别用于设置字体的仿粗体、仿斜体、全部大写字母、小型大写字母、上标、下标、下划线和删除线。（三）图像基本操作过渡页第 47 页网络图片编辑网络动画编辑网络音
23、视频编辑经典案例第 48 页正文 .任务描述动画是通过连续播放一系列画面，在视觉上造成连续变化的图画效果。适当地在网页中应用动画可以使页面更活泼，更有吸引力。第 49 页正文 . （一）SWF动画格式 （二）GIF动画格式一、网络动画格式第 50 页正文 .SWF动画是一种矢量动画格式，具有品质高、体积小、交互性强、可带声音和兼容性好等特点，并且可以在下载的同时进行流畅的播放，完全打破了网络带宽的限制，非常适合在网上传播。SWF文件是由FLA文件在Flash中编辑完成后输出的成品文件，可以由Flash插件来播放，也可以制成单独的可执行文件，无须插件即可播放。（一）SWF动画格式第 51 页正文
24、 .GIF（Graphics Interchange Format）的原义是“图像互换格式”。GIF文件数据是一种基于LZW算法的连续色调的无损压缩格式，其压缩率一般在50%左右。一个GIF文件中可以存储多幅彩色图像。GIF文件不属于任何应用程序，目前几乎所有相关软件都支持它。（二）GIF动画格式第 52 页正文 . （一）Flash的工作界面 （二）Flash动画创作流程二、常用动画编辑软件Flash的使用 （三）Flash文档基本操作第 53 页正文 .启动Flash CS6，会打开其起始页，如图4-48所示。单击“新建”列中的“ActionScript 3.0”或“ActionScrip
25、t 2.0”选项（ActionScript是Flash自带的编程语言，它后面的数字是版本号，本书若无特别说明都是选择ActionScript 3.0）即可新建一个Flash文档，并进入Flash CS6的工作界面（一）Flash的工作界面第 54 页正文 .Flash CS6工作界面特有的各组成元素的作用。文档选项卡：当打开多个文档后，单击由文档名称形成的文档选项卡标签可切换当前编辑的文档，单击文档选项卡右侧的“关闭”按钮 ，可关闭相应的文档。编辑栏：用于选择需要进行编辑的场景、元件及设置舞台显示比例。舞台：舞台是用户创作和编辑动画内容的场所。在工具箱中选择绘图或编辑工具，并在“时间轴”面板中
26、选择需要处理的帧后，便可以在舞台中绘制或编辑该帧的图形。注意，位于舞台外的内容在播放动画时不会被显示。（一）Flash的工作界面第 55 页正文 .工具箱：提供了绘制、编辑和填充图形，以及缩放和平移舞台的工具。 “时间轴”面板：默认情况下，“时间轴”面板位于舞台下方，用于组织和控制动画内容，它主要包括图层和时间帧两部分。（一）Flash的工作界面第 56 页正文 .“属性”面板：“属性”面板默认位于舞台右侧，利用它可以方便地查看和更改当前选定对象的属性。当前选定的对象不同，“属性”面板中的选项也会不同。其他面板：例如，利用“颜色”面板可以设置图形的填充色或线条颜色；利用“库”面板可以保管Fla
27、sh动画中用到的素材，如元件、音乐、视频和位图等素材。（一）Flash的工作界面第 57 页正文 .（1）前期策划：在着手制作动画前，应首先明确动画要达到的效果，然后确定剧情和角色，再根据剧情确定动画风格。（2）准备素材：做好前期策划后，便可以开始根据策划的内容绘制角色造型、背景及使用的道具等对象，并将这些绘制好的对象转换成元件以备使用（声音、图形等动画素材可以自己制作，也可以从网上下载，或购买相关素材）。（3）制作动画：一切准备妥当后便可以开始制作动画了，其中主要包括为角色设计动作、角色与背景的合成、动画与声音的合成等。（二）Flash动画创作流程第 58 页正文 .（4）后期调试：后期调试
28、包括调试动画和测试动画两部分。调试动画主要是针对动画的细节、动画片段的衔接、场景的切换、声音与动画的协调等进行调整，使整个动画显得更加流畅和有节奏感；测试动画是对动画在本地和网上的最终播放效果进行检测，以保证动画能完美地展现在观众面前。（5）发布作品：动画制作完成并调试无误后，便可以将其导出或发布为.swf格式的影片文件，并上传到网络供人们欣赏和下载。（二）Flash动画创作流程第 59 页正文 .1新建文档新建Flash文档的方法主要有以下两种。（1）启动Flash CS6时，在开始页的“新建”设置区单击要创建的文档类型，如单击“ActionScript 3.0”选项。（2）进入Flash
29、CS6工作界面后，选择“文件”“新建”菜单或按快捷键【Ctrl+N】，在打开的“新建文档”对话框中选择要新建的文档类型，单击“确定”按钮，如图4-51所示。（三）Flash文档基本操作第 60 页正文 .1新建文档新建Flash文档的方法主要有以下两种。（1）启动Flash CS6时，在开始页的“新建”设置区单击要创建的文档类型，如单击“ActionScript 3.0”选项。（2）进入Flash CS6工作界面后，选择“文件”“新建”菜单或按快捷键【Ctrl+N】，在打开的“新建文档”对话框中选择要新建的文档类型，单击“确定”按钮。（三）Flash文档基本操作第 61 页正文 .2保存文档在
30、完成对Flash文档的编辑和修改后，需要对其执行保存操作。为此，可选择“文件”“保存”菜单或按快捷键【Ctrl+S】，在打开的“另存为”对话框中选择文档保存路径，输入保存文件名，选择保存类型，然后单击“保存”按钮保存文档。（三）Flash文档基本操作第 62 页正文 .3打开文档若要打开以前保存的文档进行再次编辑，可使用以下几种方法。（1）启动Flash CS6时，在开始页左侧“打开最近的项目”下选择最近保存过的文档。（2）在工作界面中选择“文件”“打开”菜单，或按快捷键【Ctrl+O】，在打开的“打开”对话框中选择要打开的文档，单击“打开”按钮。（3）直接在保存文档的文件夹中双击要打开的Fl
31、ash文档。（三）Flash文档基本操作第 63 页正文 .4预览动画在制作动画过程中，按下【Enter】键，可以测试动画在时间轴上的播放效果；反复按【Enter】键可在暂停测试和继续测试之间切换。若希望测试动画的实际播放效果，可选择“控制”“测试影片”菜单，或按快捷键【Ctrl+Enter】，在Flash Player播放器中预览动画。（三）Flash文档基本操作第 64 页正文 .传统动画和影视都是通过连续播放一组静态画面实现的，每一幅静态画面就是一个帧，Flash动画也是如此。在时间轴的不同帧上放置不同的对象或设置同一对象的不同属性，如位置、形状、大小、颜色、透明度等，当播放头在这些帧之
32、间移动时，便形成了动画。（四）Flash动画制作原理第 65 页正文 .下面通过制作一个心跳的动画来说明Flash动画的制作原理。步骤1 打开本书配套素材“素材与实例”“Ph4”文件夹中的“动画原理心素材.fla”文档，在该文档时间轴的第1帧是一颗红心图形。步骤2 在时间轴面板中单击选中第2帧，然后按【F6】键插入一个关键帧，此时第1帧上的心图形会自动延伸到新建的第2个关键帧上，且第2帧自动成为当前帧。（四）Flash动画制作原理第 66 页正文 .步骤3 单击选中工具箱中的“任意变形工具” ，单击第2帧上的心图形，然后按住【Shift】健，将鼠标指针移至心图形左下角的变形控制柄上，按住鼠标左
33、键并稍微向左下方拖动，适当放大心图形。步骤4 按快捷键【Ctrl+Enter】预览动画，可看到一颗心在跳动。（四）Flash动画制作原理过渡页第 67 页网络图片编辑网络动画编辑网络音视频编辑经典案例第 68 页正文 .任务描述随着电脑的普及，除了用电视、DVD等设备收看影音节目外，使用电脑看影音节目的观象也越来越普遍，同时出现了很多不同的音视频格式，不同格式有不同的播放特点。本任务简单介绍网络音视频的相关知识。第 69 页正文 .流媒体就是指采用流式传输技术在网络上连续实时播放的媒体格式，如音频、视频或多媒体文件。流媒体技术也称流式媒体技术，所谓流媒体技术就是把连续的影像和声音信息经过特殊的
34、压缩方式处理成一个个压缩包后放上网站服务器，再由服务器向用户的计算机顺序或实时地传送各个压缩包。在采用流式传输方式的系统中，用户可以一边下载一边播放流式媒体文件，而不需要像非流式播放那样，等到整个文件下载到自己的计算机上才可以观看。一、流媒体技术第 70 页正文 .流媒体技术先在使用者端的计算机上创建一个缓冲区，在播放前预先下一段数据作为缓冲，在网路实际连线速度小于播放所耗的速度时，播放程序就会取用一小段缓冲区内的数据，这样可以避免播放的中断，也使得播放品质得以保证。流媒体技术在互联网信息服务方面得到了广泛的应用，如多媒体新闻发布、在线直播、网络广告、电子商务、视频点播、远程医疗、网络电台、实
35、时视频会议等。一、流媒体技术第 71 页正文 . （一）音频文件格式 （二）视频文件格式二、网络音视频的格式第 72 页正文 .WAV格式文件具有较好的声音品质，用户可以用CD、磁带、麦克风等获取WAV文件。WAV文件通常体积较大，严格限制了可以在WEB页面上使用的声音剪辑的长度。WAV格式具有文件尺寸小、音质好的特点。最大的优点就是能以较小的比特率、较大的压缩比达到近乎完美的CD音质，可以用MP3格式对WAV格式的音频文件进行压缩。MP3格式MIDI格式该格式一般用于器乐类的音频文件，常被玩音乐的人使用。很多浏览器都支持MIDI格式的文件，不需要安装插件。根据声卡的不同，声音效果也会有所不同
36、。（一）音频文件格式第 73 页正文 . 1AVI格式 AVI是音视频交错（Audio Video Interleaved）的英文缩写，该格式允许视频和音频交错在一起同步播放，支持256色和RLE压缩，但AVI文件并未限定压缩标准。 AVI文件格式只是作为控制界面上的标准，不具有兼容性。AVI文件图像质量好，可以跨多平台使用，但体积过于庞大，而且压缩标准不统一。（二）视频文件格式第 74 页正文 .（二）视频文件格式 2MOV格式 MOV即QuickTime影片格式，它是由苹果公司开发的一种视频文件格式，用于保存音视频信息，具有先进的视频和音频功能。 QuickTime文件格式支持25位彩色，
37、支持领先的集成压缩技术，提供150多种视频效果，并配有提供了200多种MIDI兼容音响和设备的声音装置。QuickTime以其领先的多媒体技术和跨平台特性、较小的存储空间要求、技术细节的独立性及系统的高度开放性得到业界的广泛认可。第 75 页正文 .（二）视频文件格式 3.WMV格式 WMV（Windows Media Video）是微软公司开发的一组数位视频编解码格式的通称，ASF（Advanced Systems Format）是其封装格式。 WMV的优点：本地或网络回放、可扩充的媒体类型、部件下载、可伸缩的媒体类型、多语言支持、环境独立性、丰富的流间关系及扩展性等。第 76 页正文 .（
38、二）视频文件格式 4MPEG格式 MPEG（Moving Picture Experts Group）格式，是一个国际标准组织（ISO）认可的媒体封装形式。 该文件格式采用有损压缩方法减少运动图像中的冗余信息，同时保证每秒30帧的图像动态刷新率. MPEG文件格式的图像和音响的质量非常好。 MPEG采用的压缩方法是将视频信号分段取样，对相邻各帧未变化的画面忽略不计，仅仅记录变化了的内容，压缩比很大。第 77 页正文 .（二）视频文件格式 5RM格式 RM格式是Real Networks公司开发的一种流媒体视频文件格式， RealVideo除了可以以普通的视频文件形式播放之外，还可以与Real
39、Server服务器相配合，在数据传输过程中边下载边播放视频影像。 RM格式主要包括Real Audio，Real Video和Real Flash三类文件。第 78 页正文 . （一）网络音视频的作用 （二）网络音视频的编辑三、网络音视频的编排第 79 页正文 .（一）网络音视频的作用 声音对于文字信息是一个有力的补充。u可以引导受众正确理解影像信息的含义；u可以对影像信息进行补充，传达影像文件无法表现的主观信息；u利用语言的概括性可以简洁而清楚地传达新闻信息。 视频是一种结合了图像和声音两者优点的信息形式；视频中不同的镜头用不同的方式加以组合，可能产生不同的效果。 第 80 页正文 .（二）
40、网络音视频的编辑 1视频的声画字要同步 只有将声音、动画、文字3种信息有机结合才能使新闻看起来更流畅、更容易被人接受。 2视频片段的衔接要合理 视频片段的衔接一方面要符合受众的观看和认知逻辑，另一方面也要符合受众的审美习惯。找到好的视频剪接点，可以使两个画面流畅地连接起来。第 81 页正文 .（二）网络音视频的编辑 3视频的画面选取要合理 在选取新闻画面时必须要合理，如过于刺激和血腥的场面容易引起观看者的反感和恐惧心理，同时也要考虑未成年人的心理。 4注意音频的质量 声音的保真度要高，要达到一定的响度要求，除声源外不能有明显的持续性噪声。 5讲究内容集中 不论视频还是音频，都要讲究内容集中。如
41、果有连续报道，可以以文字形式注明为“连续报道” 。过渡页第 82 页网络图片编辑网络动画编辑网络音视频编辑经典案例第 83 页正文 .本例通过制作一个简单的广告条，进一步了解Photoshop软件及其在实际网页制作中的应用，效果（图像源文件见本书配套素材“素材与实例Ph4example3”目录下的“banner.psd”）。使用Photoshop制作网页广告条第 84 页正文 .步骤1 启动Photoshop CS6后，选择“文件”“新建”菜单，打开“新建”对话框。步骤2 设置“名称”为“banner”，“宽度”和“高度”分别为“760像素”和“100像素”，“分辨率”为“72像素/英寸”，“
42、颜色模式”为“RGB颜色，8位”，“背景内容”为“白色” 。步骤3 单击“确定”按钮，创建一个名为“banner”的文档。使用Photoshop制作网页广告条第 85 页正文 .步骤4 选择“文件”“打开”菜单，打开“打开”对话框。在“查找范围”下拉列表中选择文件所在位置，此处为本书配套素材“素材与实例Ph4example3”；在文件列表中选择要打开的文件，此处为“he.jpg”。步骤5 单击“打开”按钮，打开文档“he.jpg” 。使用Photoshop制作网页广告条第 86 页正文 .步骤6 单击“文档标题栏”中“he.jpg”文档标题，按住鼠标左键向下拖动，待文档窗口脱离文档标题栏后松开
43、鼠标。步骤7 使用“移动工具” 单击“he.jpg”中的图像，按住鼠标左键向上拖动至文档“banner”窗口中，之后松开鼠标。使用Photoshop制作网页广告条第 87 页正文 .步骤8 单击“he.jpg”标签栏中的“关闭”按钮 ，关闭文档。步骤9 选择“窗口”“图层”菜单，打开“图层”调板；首先单击“背景”图层，然后按住【Shift】键的同时单击“图层1”，同时选中两个图层。使用Photoshop制作网页广告条第 88 页正文 .步骤10 选择“图层”“对齐”“垂直居中”菜单，使图像在文档背景上垂直居中对齐使图像垂直居中对齐。步骤11 选择“图层1”，并按键盘上的向右方向键【】，使图像向
44、右移动，直到图像左侧边缘接近上标尺中的“7”处。可以在使用Photoshop制作网页广告条第 89 页正文 .步骤12 在工具箱中选择“横排文字工具” ，在“工具属性栏”中设置字体为“文鼎CS大黑”，文字大小为“20点”，文字颜色为草绿色“#80ba0f”。使用Photoshop制作网页广告条第 90 页正文 .步骤12 在工具箱中选择“横排文字工具” ，在“工具属性栏”中设置字体为“文鼎CS大黑”，文字大小为“20点”，文字颜色为草绿色“#80ba0f”。使用Photoshop制作网页广告条第 91 页正文 .步骤13 在文档窗口中白色背景处单击，输入文本“做最棒的装修”，然后按【Ctrl+Enter】组合键结束输入；在刚输入的文本右下方单击，再次输入文本“让每一位客户满意”，然后按【Ctrl+Enter】组合键结束输入，如图4-80所示。使用Photoshop制作网页广告条第 92 页正文 .步骤14 选择“文件”“存储”菜单，打开“存储为”对话框，在“保存在”下拉列表中选择保存位置，在“文件名”文本框中输入文档名“banner”，在“格式”下拉列表中选择“psd”，然后单击“保存”按钮。步骤15 弹出“Photoshop格式选项”对话框，单击“确定”按钮即可。使用Photoshop制作网页广告条http:/
