现代教育技术 第8章 网络教育资源建设与利用配套教材配套教材 国家 国家“十一五十一五”规划教材规划教材 《《现代教育技术现代教育技术》》 陈 陈 琳琳 主编主编 高等教育出版社 高等教育出版社2006年版年版 学习目标1．．说出网络教育资源建设对于教育现代化的意义2．．阐释网络教育资源的建设原则3．．领会网站创建的前期工作内容4．．掌握用表格、层及框架布局网页的方法5．．掌握图形、文字的设置以及超级链接的设置6．．掌握导航设计的办法 学习目标7．．掌握表单和样式表的制作及应用8．．掌握在网页页面中加入和设计多媒体元素的方法9．．能制作各种行为效果10．．掌握发布网站的方法11．．熟悉网络课程概念和网络课程设计开发特点12．．说出流媒体特点，知道流媒体格式与制作 8.1 网络教育资源概说 8.1.1 网络教育资源的类型l按技术格式–文本、图形、图像、音频、视频、动画和应用软件类l按表现形式–教育模板、电子教案、学生作品、课件、课程内容、演示稿、文献、评价量规、教学课例、资源索引l按教育过程–备课、讲授、实验、练习、测试、作业、讨论、答疑、游戏、情感交流、教学管理 8.1.2 网络教育资源建设原则l需求性原则–充分考虑教育的需要，以为教育服务为目的l系统性原则–处理网络教育资源系统内部的各个模块之间的结构关系–处理好与教育大系统中其他子系统的关系l规范性原则–符合《现代远程教育资源建设规范》 8.1.2 网络教育资源建设原则l开放性原则–参与人员的开放性l教师、教育专家、技术人员、学生，甚至于家长–体系结构的开放性l建立分布式网络教育资源平台体系结构l实现资源及时更新、及时交互l解决不同学科和功能整合，实现网络资源价值最大化–内容的开放性l资源多样性、交互性和扩展性l实现最大范围的师生、生生之间的学习交流 8.1.2 网络教育资源建设原则l创新性原则–概念创新–方法创新–内容创新–模式创新–以创新意识建设，不墨守成规l可持续性原则–动态可持续发展建设–功能和内容不断完善更新 8.1.3 网络教育资源开发l将多媒体素材和零散的教育资源整理、组合，使之有序化、规范化、系统化–有利于教育信息的存储、传播、检索和利用–包括多媒体素材的开发l网络教育资源开发的主要方式–用网页制作工具集成素材资源l网页制作工具–FrontPage、Dreamweaver 8.2 用Dreamweaver创建网站l创建网站一般过程–创建本地站点–在本地站点中创建和编辑网页–测试本地站点–修改及发布站点 8.2.1 Dreamweaver软件的界面构成“ “插入插入插入插入” ”工具栏工具栏工具栏工具栏“ “文档文档文档文档” ”工具栏工具栏工具栏工具栏 1 “插入”工具栏l在文档中创建相应类型的对象–“显示为制表符”、“显示为菜单”l“常用”——插入图像、表格等l“布局”——插入表格、Div 标签、层和框架等l“表单”——创建表单和插入表单元素的按钮l“文本”——插入各种文本格式设置标签和列表格式标签l“HTML”——插入水平线、文件头、表格等的 HTML 标签 2 “文档”工具栏l“代码”视图按钮l“设计”视图按钮l“拆分”视图按钮l标题–为文档输入标题 8.2.2 创建本地站点l创建网站的前期工作l定义本地站点 1．创建网站的前期工作l明确网站的定位–确定网站的主题l网站栏目–根据网站定位、教育资源特点设置网站主栏目–按主栏目的要求设计二级、三级栏目 创建网站的前期工作l网站风格–网站给浏览者的综合感受l网站标志（logo）l网站宣传标语（banner）l标准色彩–教育网站常用色彩——蓝、橙、绿 创建网站的前期工作l网站结构–内容结构–目录结构–链接结构l站点页面之间相互链接的拓扑结构l使浏览者不至于迷航 创建网站的前期工作l网站布局–设计图片和文字在页面的位置–突出重点–平衡协调l体现先进教学理念l有利于学习者自主探究学习 2．定义本地站点l执行“站点”／“管理站点”命令–在对话框中单击“新建”，选择“站点”l在文本框中输入标识站点的名称l在向导界面设置–选择“否，我不想使用服务器技术”–选择“编辑我的计算机上的本地副本 ……”–在询问如何连接到远程服务器中选择“无” 3．修改和删除本地站点 8.2.3 新建和编辑网页的一般过程1．．新建网页–执行“文件”／“新建”命令，在“新建文档”对话框中选择l“常规”选项卡选择“基本页”类别中的“HTML”2．．确定标题–在文档工具栏“标题”框删“无标题文档”，录入网页标题3．．保存网页–站点首页–保存站点首页，必须用浏览器默认的首页名lIndex；Default 8.2.3 新建和编辑网页的一般过程4．．设置页面属性–执行“修改”／“页面属性”命令l “大小”——不小于12像素l“左边距”、“右边距”、“上边距”、“下边距”为0l“标题/编码”使用简体中文（GB2312）l“跟踪图像”–“透明度”5．．网页布局定位设计–利用表格、层、框架对页面元素进行定位 8.2.3 新建和编辑网页的一般过程6．．插入内容–在合适位置插入各种媒体元素、表单7．．超链接及导航设计–通过超链接使网页具有开放性–通过导航设计有效解决迷航问题 8.2.3 新建和编辑网页的一般过程8．．测试与修改–按F12功能键启动浏览器预览和测试页面–默认的浏览器为IE–执行“文件”／“在浏览器中预览”／“编辑浏览器列表” l设置预览和测试用其他浏览器 8.2.4 网页内容的布局定位l表格l层l框架 1．表格l表格作用–起通常意义上的表格作用–对网页内容精确定位l创建表格–执行“插入”／ “表格”命令–点击“常用”插入工具栏中的l“表格”对话框设定–“表格宽度”百分比（Percent）l按照浏览器的大小而变化l表格属性 2．层l创建层–执行“插入”／“布局对象”／“层”–“插入”工具栏切换到“布局”后，单击 ，待出现十字型光标后在编辑窗口拖动创建层l嵌套层–执行“编辑”／“首选参数”，在对话框“层”类中，选择“嵌套” –父层、子层。
父层与子层为嵌套关系l层的属性设置l层与表格之间的转换 3．框架l框架–把浏览器窗口划分为多个区域，每个区域显示不同网页l框架集和单个框架–框架集是在一个文档内定义一组框架结构的网页l定义一个网页中包含的框架数、框架的大小、载入框架的网页源和其他可定义的属性–单个框架是指在网页上定义的一个区域–一个框架结构的网页由多个网页文件组成l框架操作–创建和保存新框架；拆分和删除框架；设置框架属性 8.2.5 文字和图像的插入与设置 1．文字的插入与处理l直接录入l执行“文件”／“导入”／“word文档”命令l设置段首空格–须将输入法转成中文全角状态l文字属性的修改与设定–“编辑字体列表．．．” 2．图像的插入与设置l插入图像–单击“常用”插入工具栏按钮 ；执行“插入”／“图像”命令–事先将插入图像文件放到站点根文件夹或其下的文件夹l通常放在images文件夹中l插入图像的路径应采用相对路径，而不用绝对路径l插入的图像格式GIF、JPG、JPEG、PNGl设置网页背景图像–执行“修改”／“页面属性”，在对话框中设“背景图像”l设置图像的属性–地图 8.2.6 链接与导航 1. 文字链接的一般方法l单击“常用”插入工具栏 钮调出对话框设置l选择文字后在文字属性页面中设置超链接l设置链接地址–单击文件夹图标浏览到站点中的文件–直接键入URL–由属性面板 “指向文件”图往“站点”面板文件上拖–将文件从“站点”面板拖到“链接”文本框 文字链接的一般方法l“目标”——指定将链接文档加载到的框架或窗口– _blank——打开一个新的窗口显示链接文件– _parent——用含超链接的父窗口显示链接文件– _self——用超链接所在窗口或框架显示链接文件– _top——链接文件显示在整个浏览器窗口中l 相应取消所有框架 2 文字的特殊链接l链接到E-mail–在文本属性面板 “链接”栏填“mailto:”和邮件地址lmailto:chenlin@–“常用”插入工具栏中的电子邮件链接工具 文字的特殊链接l锚点链接–在文档中设置锚点l将光标插入到欲设锚点位置l选择“常用”插入工具栏 l在“命名锚记”对话框中输入锚记名称–设置文字与锚点链接l选择作为超链接的文字l在属性面板“链接”文本框输入“#”和锚记名称 3 图像链接l一张图对应一个链接l通过热区给图的不同位置建立链接–在一张图上画很多热区，做很多链接，分别链接到不同的页面l创建不同形状的热区 ４ 网页的导航l导航条l弹出菜单l跳转菜单 制作导航条方法l事先准备做导航条按钮的图像，置于站点根文件夹下–每个按钮图像都具有相同的宽度和高度l执行“插入”／“图像对象”／“导航条”，在对话框中设定–在“项目名称”项后的文本框填入导航条项目的命名l每个项目对应一个按钮l每个按钮最多可对应四种状态的图像–若“预先载入图像”，图像将在页面下载的同时全部下载–“替换文本”文本框用于输入项目的描述性名称–“按下时，前往的URL”–“插入”项选框“水平”和“垂直”——导航条水平还是垂直展开–“使用表格”——导航条各按钮部位用表格隔开 8.2.7 创建表单 8.2.8 插入其它媒体元素 8.2.9 利用CSS样式美化网页lCSS–Cascading Style Sheets–层叠样式表单lCSS样式的创建lCSS样式应用 8.2.10 使用行为制作动态特效网页l在“行为”面板单击 ，在下拉菜单添加行为–“交换图像”–“弹出信息”l在特定的事件被触发时弹出信息框–“恢复交换图像”–“打开浏览窗口”–“播放声音”l为网页对象添加背景音乐– “显示弹出式菜单” 8.2.10 使用行为制作动态特效网页l“跳转菜单”–修改跳转菜单及改变默认的触发事件–在文档窗口中选择一个跳转菜单后才能使用l“跳转菜单开始”–控制导航菜单跳到哪个页面l“转到URL”–在满足触发事件时，跳转到其它页面 事件l用于设置当前对象上触发什么动作–“onMouseOver”——鼠标移到目标上–“onMouseUp”——按下鼠标再放开左键–“onMouseOut”——鼠标移开–“onMouseDown”——按下鼠标–“onClink”——点击–“onDblClick”——双击–“onLoad”——载入网页–“onUnload”——离开页面–“onResize”——当浏览者改变浏览窗口的大小时–“onScroll”——当浏览者拖动滚动条 8.2.11 发布本地站点l用站点管理器检查和整理网站文件l执行“站点”／“检查站点范围的链接”命令 1．上传到远程服务器上发布l发布站点操作l上传文件 2．本机发布站点l把PC机作为网络服务器使用l用IIS软件–Internet Informa Tian Server–微软架设 WEB、FTP、SMTP 服务器整合软件– Windows默认安装带有 或安装完毕后加装IIS 2．本机发布站点lWindows XP Professional计算机站点安装–执行“开始”／“设置”／“控制面板”–双击 “添加或删除程序”图标–单击“添加/删除Windows组件”按钮–在 “组件”列表框选“Internet信息服务（IIS）”–“下一步”，从系统安装盘中安装IIS 本机发布站点l配置服务器–右击“我的电脑”，选择“管理”选项–选“服务和应用程序”／“Internet信息服务”／“网站”／“默认网站”–右击“默认网站”，选择属性，进行配置l配置 IP。
在“网站”选项卡“IP地址”栏指定站点的IP–在“TCP端口”栏配置端口，WEB默认端口号是 80l指定站点主目录主目录”选项卡“本地路径”栏l设定默认文档 “文档”选项卡设定–index.htm、index.asp、default.asp 8.3 网络课程开发 8.3.1 网络课程概述l网络教育资源的一种重要类型l通过网络表现的某门学科教学内容及实施教学活动的总和–包括按一定的教学目标、教学策略组织起来的教学内容和网络教学支撑环境两个组成部分–网络教学支撑环境特指支持网络教学的软件工具、教学资源以及在网络教学平台上实施的教学活动l网络课程三个层次–通过网页给学习者提供学习材料及与相关网络教育资源链接–学习者通过电子邮件、电子公告栏等进行异步双向交流–用网上会议、视频会议等进行同步双向交流 网络课件l课件–对一个或几个知识点实施相对完整教学的教学软件–能够集成各种教学信息的程序，能够实现某些教学功能，起到辅助教学的作用–网络版课件、单机版课件l网络课程与网络课件区别–范围大，作用大，网络课程可包含若干网络课件–网络课件实现知识点的教学功能，网络课程是基于网络教学的全过程 8.3.2 网络课程设计和开发 1．网络课程设计的内容l网络课程的教学设计–教学目标的设计–教学内容的确定–学习者特征的分析–学习环境的设计–学习活动的设计–教学过程的设计–学习评价的设计 1．网络课程设计的内容l网络课程的系统设计–框架结构的设计–导航策略的设计–屏幕界面的设计–交互策略的设计l网络课程的脚本编写–文字脚本的编写–制作脚本的编写 2．网络课程设计原则l开放性原则–学习者参与的开放性l学习者可以按需参与，无过多限制–教学内容的开放性l体现各个知识领域的关联性–课程资源的开放性l便于学习者获取资源，方便于教师随时补充资源–网络教学支撑平台的开放性l教师可以根据学习者的学习情况及课程内容的发展，调整教学策略甚至于重新进行教学设计 2．网络课程设计原则l自主性原则l交互性原则l便利性原则l可评价性原则 3．网络课程的开发过程l确定教学大纲l确定教学内容l系统总体设计和网络课件原型设计l脚本编写l素材准备l课件开发l教学环境设计l教学活动设计l课程试用与评价及修订 （1）确定教学大纲l网络课程的教学大纲–以纲要的形式规定学科的内容、体系和范围，它规定课程的教学目标和课程的实质性内容–编写网络课程的直接依据–检查网络教学质量的直接依据–对网络教学工作具有直接的指导意义 （2）确定教学内容l根据教学大纲和在分析网络教学对象的特征、需求的基础上确定–应具有科学性、系统性和先进性的特点–要符合内在逻辑体系和学生的认知规律–表达形式符合国家远程教育资源建设规范 （3）系统总体设计与原型再现l系统总体设计–网络课程设计中最重要的环节之一–形成系统设计总体思路–确定主要教学模块，建立模块之间关系，形成系统结构l原型设计–选择相对完整教学单元，设计出网络课程教学单元模型–确定总体风格、界面、导航风格、素材规格及脚本内容–设计的原型应在一定范围内征求意见，再修订l注意教学设计、内容组织、内容表现和内容导航的设计 （4）脚本编写l对每个教学单元的内容、安排以及各单元之间的逻辑关系设计的文本–描述学习者将要在计算机上看到的细节–设计阶段的总结–开发和实施阶段的依据–由经验丰富的专业课教师编写 （5）素材准备l根据脚本的要求准备所需的素材–文字、图形、图像、声音、动画、视频、案例–符合学习资源素材标准l素材格式、素材版权和素材相关信息 （6）网络课程开发l用网络课程开发工具进行素材集成–Dreamweaver–Frontpage–ASP–JSP–PHPl完成后要编写相应的标准文档 （7）教学环境设计l主要指软教学环境–与网络课程学习直接有关的l课程大纲l练习题l答疑系统l课程学习讨论系统l作业提交与管理系统 （8）教学活动设计l对即将实施的网络教学具体活动的规划和设计 （9）系统试用与评价 教学实践——网络教育资源开发实践l实践目的–掌握开发网络资源的过程–掌握网络站点建设与发布的一般方法–掌握用Dreamweaver制作网页的方法l实践器材l实践方法–基本阶段–提高阶段l实践注意点 教学实践——网络教育资源开发实践l实践注意点–实践关键是全面掌握Dreamweaver制作网页的方法和思路。
制作网站之前要先观察网上已有与本科相关教学网站（或网络课程），分析网站的设计思路和教学思想–设计制作网站的要求l以学习者为中心，选题有意义，与学科教学紧密结合；l布局合理、均衡，页面美观、简洁，色彩和谐、自然；l页面内容准确充实，结构合理，信息呈现符合学习者特征，重点突出，能激发学习者的学习兴趣 教学实践——网络教育资源开发实践l问题讨论（1）使用表格与使用层来定位网页元素各有什么特点？（2）如何连续输入空格？（3）如何插入关键字？（4）如何实现在一个页面内部的链接跳转？（5）如何实现框架网页中的超级链接？（6）如何将一首歌作为一个页面的背景音乐？（7）导航条、弹出菜单和跳转菜单等这三种导航方式各有什么特点？各如何制作？（8）创建网站时应该注意哪些问题？ 思考题1 1．．．．网络教育资源的建设对于教育现代化的意义何在？2 2．．．．网络资源建设要遵循哪些原则？3 3．．．．创建网站的前期工作有哪些？ 4 4．．．．网页内容的布局定位方式有哪些？5 5．．．．如何实现表格与层之间的转换？利用框架定位要注意哪些问题？6 6．．．．如何进行页面元素的超链接设计？超链接有哪些方式？锚点在教育网站中有何实用价值？7 7．．．．什么是相对路径和绝对路径？它们之间有什么区别？ 思考题8 8．．．．网页导航有哪些方式？如何设计开发不同导航方式？9 9．．．．什么是CSS样式？如何利用CSS样式？1010．．．．怎样为网页设置行为？1111．．．．如何向网页文档中加入图像、声音、动画、活动视频？1212．．．．设计制作好的站点如何上传到服务器上发布？如何将自己的计算机设置为站点服务器？1313．．．．什么是网络课程？网络课程与网络课件有什么区别？1414．．．．网络课程开发的一般过程如何？ 。