网络课件的地址_图片_流媒体

网络课件的地址_图片_流媒体 马凤溪邓毅王 进曹晓东 ( ) 第三军医大学教育技术中心 重庆 400038 【摘要】:制作网络课件经常遇到链接错误 、图片数据量大 、下载时间长 、视频音频不能实时播放甚至不能传输等问 。本文结合分析《听觉生物物理基础》网络课件制作过程 ,提出了对这些问题 的解决办法 。 【关键词】:网络课件 地址 图片 流媒体 【中图分类号】: G434【文献标识码】:A The a ddress ,picture and strea ming media of web course ware Ma Fengxi , Deng Yi , Wang J in , Cao Xiaodong ( )Educational Technology Center , Third Military Medical University , Chongqing 400038 【Abstract】:Many problems such as wrong linking occur while you are making web courseware . The pic2ture data are large ,video and audio media cannot be played in real time , and even cannot be transmitted. This paper analyses these problems in the web courseware of“Basis of Auditory Biophysics”. 【 Key words】:web courseware ,address ,picture ,streaming media ? 回 答“是 ”, Dream2 望把这 个 文 件 复 制 到 这 儿 来 制作网络课件是当前教育技术的一个热点 ,也 weaver 就能自动将此文件复制到 hear 目录下 ,并以 是为信息高速公路“造车”的一项工程 。网络课件制 文档相对地址格式建立链接 。如果回答“否”,将以 作过程中遇到的一些技术问题 ,在教育信息资源网 绝对地址格式建立连接 。 的建设 、网络课程和远程教育网的建设中都不能回 所谓绝对地址是用于指定协 议 类 型 、域 名 , 或 ( 避 。因此我们把制作《听觉生物物理基础》以下简 1 ID 、路径 、文件名等。当需要与位于其他服务器上 ) 称《听觉》网络课件当成一次发现问题和解决问题 的 Web 页进行链接时 , 通常会用到绝对地址 , 例如 的实践 ,从而在课件地址选择 、图片软件使用以及流 网络课件链接中国物理教育网 , http :ΠΠwww. cpenet . 媒体技术等方面有了一些体会 。 org. cnΠ是绝对地址 。 在绝对地址中包含的是精确地址而不用考虑源 文件的位置 ,因此绝对地址存在两个问题 : 1 绝对地址和文档相对地址 a . 需要 URL 地址输入 ; 制作网络课件第一步是建立站点 ,可以建在服 b. 如果链接文件被移动了 ,必须重新设置每个 务器上 ,也可以建在本机 , 做好之后再上传到服务 单独的链接 。 器 。例如《听觉》课件 ,建立一个站点取名“听觉”,是 如果我在本机上建立一个链接 ,输入绝对地址 一个“hear ”文 件 夹 。Dreamweaver 不 能 识 别 中 文 地 file :ΠΠC : \ Pic \ abc . jpg ,在本机浏览当然没有问题 , 址 ,因此所有文件和文件夹都以英文命名 。当我从 因为图形文件就存放在本机的 C : 盘 。但是发布到 站点中的主页链接站点以外的 html 文件 、图片文件 网上 ,别人要浏览该图片 ,就会从他本机 C : 盘的 Pic 或动画文件时 ,会弹出一个对话框 : This file is outside 2 文件夹去找 ,这样就不可能正常显示该图片。所 of the root folder of site“听觉”, and may not be accessi2 以我们用自己的素材编制网络课件 ,都用文档相对 ble when you publish the site Would you like to copy the file there now ? 提示这个文件不在“听觉”站 hear 根目录下 ,把 2 . htm 链接到主页上 。如能在网站点以外所有代表文档路径的元素都被省略了 。例 () 如创建从主页 index. htm到储存在同一个文件夹中 课件的制作脚本中把每个章节 、每个素材的文件名 ( ) 的另一页 hear - 2 . html的相对链接 , 该链接格式 扩展名都标出来 ,按照脚本制作素材 ,建立链接 ,简写为 : hear - 2 . html 。如果站点改变服务器或域 , 仅可以避免大部分链接错误 ,还能使制作工作进 站点内所有的链接仍然有效 。 一种有序状态 ,大家协作愉快 ,提高工作效率 。 这里值得一提的是 ,要在 Dreamweaver 中使用文 档相对地址 ,最好先建立一个站点根目录 ,并按照一 定的秩序在根目录下建立若干文件夹 ,把各种素材 分门别类保存在各个文件夹里 。否则当看到 Would you like to copy the file there now ? 就回答“是”,Dre2 ( amweaver 会将网页 、图片 、视频 、音频文件 不分类型 ) 地保存到作为站点的 hear 文件夹 ,并与 index. html 图 1 打开的 hear2 文件夹 () 主页同属根目录下 。如果站点在服务器上 ,课件 组的每个成员都这样把自己制作的网页和素材复制 2 用 Flash 制作网络课件的图片到 hear 根 目 录 下 , 文 件 多 了 以 后 就 会 造 成 排 列 无 网络课件在图片作为主要教学内容的情况下序 ,管理混乱 ,可能还会有相同文件名 、文件夹名 ,后 来的把先前存在的替换掉 ,造成无可挽回的损失 。 图片的质量与下载速度直接关系到教学质量 。由 受到带宽的限制 ,在保证图片清晰的前提下 ,希望 所以最好每个制作人员都默认站点是“听觉”, 3 件尽量小 ,下载速度越快越好。清华教育软件 在本机上建立一个文件夹 ,例如第二章内容 ,文件夹 究中心 开 发 的 网 络 课 件 中 , 图 像 文 件 几 乎 都 使 叫 hear2 ,把网页 、图像 、流媒体 、动画等文件分别保 Flash 做的 swf 格式 。以一个 550 ×400 像素的图 存在不同的文件夹里 ,同属 hear2 目录下 。如图 1 所 为例 ,256 色的 gif 文件有 80 KB 左右 ,假设下载时 示 : 23 秒 ;相同内容做成 swf 文件 ,只有 28 KB ,下载时 9 秒 ,具体参数如表所示 。 表 1 550 ×400 像素不同格式的图像质量和文件大小对比 图像格式图像质量文件大小备注 79. 8 KB 256 色 gif中网络课件常用格式 ,渐变色分层 () jpg 质量 8良 网络课件常用格式 ,线条光洁度稍差 70. 8 KB () jpg 质量 3图像质量差 ,渐变色分层 ,线条模糊 差 38. 5 KB ()优 swf 单帧 色彩鲜艳 ,线条光洁 ,浏览需要插件 28 KB 从这个对比中可以看出 ,与其它常用格式比较 ,的线条还要细 。 Flash 虽然是 256 色 , 但是色彩鲜艳 , 渐变色 单帧的 swf 文件最小 , 质量最好 。而且在网上浏览 () 常柔和 ,渐变模式有放射状渐变和线形渐变 ,工具 可以 单击鼠标右键选择放大放大若干倍观看细 下脚有两个图标 ,Lock Fill 图标是锁定填充色 ,可 节 ,线条和色彩质量不变 。 使画面中分散在各处的一种渐变色具有统一的渐 对用惯了 Photoshop 的素材制作者来说 ,再学一 个 Flash 软件并不困难 ,而且 Flash 的矢量绘图工具 类似 Corel Draw , 画 曲 线 、调 整 线 条 的 张 力 , 都 很 方 效果 ; Transform Fill 图标可以改变渐变色的角度 、便 。Flash 的画笔功能有 7 个选项 ,包括实线 、虚线 、 心 、长宽比例 ,例如常用的背景垂直渐变 , Flash 本点划线 、不规则线等 ,其中 hairline 像头发丝一样细 , 只有水平渐变 , 可以先填充一块水平渐变 , 再旋 用 hairline 画的图形 ,打印出来比 0 . 2 毫米绘图笔画 90 度变成垂直渐变 。还可以转成一定角度 ,看上 好像一束光线投射进来 ,配合主体物用渐变色制 了大量 Flash 动画 。用 Flash 制作网络课件的图片只 media player 7 以上放 。客户端播放流媒体需要安装 是“边锋”,然而我们在制作网络课件中发现 ,医学上 () 的播放器 该播放器由微软公司免费提供。 以“纯很多模式图用于网络课件 ,最适合用 Flash 做成 swf 音 测 听”视 频 文 件 为 例 , 如 果 采 集 为 avi 文件 。这些素材用 Photoshop 画起来非常麻烦 ,直接 格式 ,编辑后长度 35 秒 ,文件有 100 多 MB ,根本不 扫描修改填色 ,效果不尽人意 ,而且有“盗版”嫌疑 。 能考虑上网 。采集为 MEPG - 1 格式 ,编辑后文件大 用 Corel Draw 重画 , 工作量非常大 , cdr 格式不能直 小是 6 . 05 MB ,可以上网 ,但仍然要一边传输一边播 接上网 ,用 jpg 或 gif 格式输出 ,质量大打折扣 ,损失 放 ,等待时间较长 。用 cleaner 5ez 压缩成 wmv 格式 , 了 Corel Draw 画 面 细 腻 、色 彩 真 实 的 特 点 。而 用 Flash 制作 swf 文件 ,所花的时间相当于用绘图钢笔 文件大小只有 1 . 18 MB , 在校园网可 以 实 时 播 放 。把原图描一遍 ,填充色是极简单的工作 ,可以不计时 间 ,画面效果好于质量 < 6 的 jpg 和 256 色 gif ,网上 质量比 MEPG - 1 稍差 ,但色彩没有明显分层 ,视频下载时间只相当于 gif 的 2Π5 。 没有丢帧现象 ,图像质量是可以接受的 。 又如该课5 但是矢量图不能完全代替位图,有些解剖图 件中的“箫声”音频素材 , 采集为 wav 需要表现准确的立体结构和表面材质 ,如骨骼的表 格式 ,文件大小 103 MB 。压缩成 wma 只有 9 . 38 MB , 面质感 ,用 Flash 不容易做出来 ,仍需扫描或用 Pho2 声音没有明显失真 。如果网络课件需要背景音乐 , toshop 制作 。动画中要用位图的物体或背景 , 可以 除 mp3 之外也可以考虑 wma 格式 , 实 际 上 wma 比 将图像文件导入 Flash ,用 Modify ΠBreak Apart 打散 , mp3 还要小 。 用橡皮工具擦除周围不需要的部分 ,只留需要的物 网络课 件 中 的 声 音 还 有 一 种 解 决 办 法 , 利 用 5 体 ,这样文件会“减肥”很多。 () Flash 加载声音文件 wav 或 mp3,有动画或无动画 , 浏览 Flash 制作的动画和图像 ,需要在客户机上 都可以存储为 swf 格式 ,从而实现以流媒体形式在 安装 Flash 软 件 或 Flash 播 放 器 。考 虑 到 近 期 内 网上传输 、播放 。《听觉》教材中凡是有声音的动画 Flash MX 尚未普及 ,我们在《听觉》网络课件中提供 了 Flash 5 软件下载 。另外在制作过程中 ,应该所有 素材都用一个 Flash 版本制作 ,这样只需要给户提供 5 均采用这种方式 。( 一个 Flash 播放器 用 Flash MX 制作的 swf 文件 ,在 ) 参考文献Flash 5 不能打开。 施威铭研究室 1Dreamweaver 魔法书 4 M 1 中国青年出版 1 社 ,2001 ,5 :127 - 128 肖金秀 ,冯沃辉 ,卢国旺 1 中文 Deamweaver3 网页设计大 2 制作 M . 中国民航出版社 ,2000 ,5 :70 - 71 江丽瑜 ,黄海 ,刘鹏图 1 医学教学网站的美术设计 J . 中 () 国医学教育技术 ,2001 ,12 4:250 - 251 3 刘晓宇 ,沈建荣 ,陈月杨. 流媒体技术在网络教学中的应 () 用 J . 广西农业机械化 ,2001 , 3:27 3 视频流和音频流4 曹晓东 1 减小网络课件数据量的几个方法 J . 中国医学 通过计算机网络浏览声音 、动画和视频等媒体 ,() 教育技术 ,2001 ,9 , 3:183 - 184 5 通常需要完整下载文件后才能播放 ,信息不具实时 ( 倪晟 1 流媒体技术概述 1 浙江师范大学学报 自然科学 ( 性 。采用流媒体技术 , 可以将一个大的媒体 如音 ) () 版J . 2002 ,25 1:89 - 93 6 ) 频 、视频等,分解为较小的多个片段 ,像流水一样从 () 收稿日期 :2002 - 09 - 10远程服务器源源不断地传送到本地计算机的缓冲