现代教育技术中心高小惠.ppt

《现代教育技术中心高小惠.ppt》由会员分享，可在线阅读，更多相关《现代教育技术中心高小惠.ppt（42页珍藏版）》请在三一办公上搜索。

1、现代教育技术中心 高小惠,网站制作与教学应用,教学网站概述,教学网站分为两大类：1.网络教学（网络学院、网络选修课）教学一般是建立在教学平台上2.辅助教学（课程内容的复习和知识的扩展）教学网站的功能:要使学习者通过学习和运用教学网站上的模块，替代部分教学活动教学网站模块主要包含：学习内容、内容讲解(多媒体)、学习导航、案例分析、学习反馈、思考活动、布置作业、学习建议、学习进度管理（网络教学辅助平台或编辑动态网页）,网页制作一般采用 Dreamweaver 和 Frontpage 软件软件 Frontpage 版本说明Frontpage 2000 版本是全国计算机考试所确定的版本。学校服务器：(

2、账号、密码均为train)培训软件文件夹中有 Microsoft Office2000 安装软件。下载后在本机安装时只选择安装frontpage即可。参考网站：http:/202.116.160.98:8000/course/FrontPage2000/fp2k0101.htm,教学网站概述,FrontPage 2000的启动与退出FrontPage 2000的启动与退出的方法与其它的Windows应用程序相同。（1）启动操作（2）退出操作 FrontPage 2000的用户界面FrontPage 2000的主窗口界面由：标题栏、菜单栏、工具栏、视图栏、编辑器、状态栏组成。,Frontpage

3、 2000 概述,FrontPage 2000支持6种不同的视图，它们分别是：l网页视图：可以用不同的方式编辑网页或浏览网页。l文件夹视图：可以按照文件夹的形式查看站点中的文件组成情况。l报表视图：该视图下显示的是当前站点的统计数据。其内容涉及到所有的文件、图片、未链接与已链接的文件等的数量、大小及简要说明。l超链接视图：超链接是Web站点中最重要的部分，在网页中通常少不了超链接。l任务视图：这是FrontPage 2000为制作复杂网站提供的一种有力工具，通过它，设计人员可以根据工作安排制定详细的任务列表。,Frontpage 2000 概述,创建网站的一般过程由以下几个步骤构成：(1)需求

4、分析(2)规划网站(3)收集内容(4)建立Web站点(5)制作网页 根据网站的建设规划，制作网站的主页面及其它页面(6)测试网站及网页(7)发布网站(8)维护与更新从设计阶段来说，最为重要的就是做好网站的规划、收集建立网站需要的资料及制作网页。,网页制作,设计阶段,规划网站（1）确定站点结构根据Web站点的需要，明确建立站点的目标，确定站点的组成部分及各页面间的层次关系，除此之外，制作网页所需要的各类型的素材应建立相应的素材文件夹以统一管理。（2）创建Web站点规划好站点后，需要在FrontPage 2000中制作出相应的网站结构,网页制作,层状结构 层状结构（如图1.8所示）类似于目录系统的

5、树体结构，由网站文件的主页开始，依次划分为一级标题、二级标题等等，逐级细化，直至提供给浏览者具体信息。,线性结构 线性结构（如图1.9所示）类似于数据结构中的线性表，用于组织本身的线性顺序形式存在的信息，可以引导浏览者按部就班地浏览整个网站文件。这种结构一般都用在意义是平行的页面上。通常情况下，网站文件的结构是层状结构和线性结构相结合的。这样可以充分利用两种结构各自的特点，使网站文件既具有条理性、规范性，又可同时满足设计者和浏览者的要求。,Web结构 Web结构（如图1.10所示）类似于Internet的组成结构，各网页之间形成网状连接，允许用户随意浏览。,制作网页 规划好网站的结构后，即将开

6、始网站的内的网页制作。网页是站点中最基本的文档，它是用HTML语言编写的。由于FrontPage具有所见即所得的特性，并能自动创建HTML代码，所以在不很了解HTML语言的情况下，用FrontPage创建出多种格式的网页。1）创建网页2）保存网页 新的网页建立后，要以HTML的格式进行保存，直接选择文件菜单下的“保存”选项，即可弹出“另存为”对话框，与其它Office系列软件一样，我们可以在此处选择文件保存的位置，并对文件进行命名。,网页制作,在所有的网页制作软件中，表格的作用不仅是可以直观地描述数据，还可利用表格来划分网页的页面布局。1)表格的插入与编辑 在FrontPage 2000里，表

7、格的操作与Word类似。2)利用表格进行布局 在FrontPage 2000里，表格可以用来进行页面布局。所谓页面布局，就是利用表格来确定文本、图片等网页元素的位置，作为表布局用的表格，其边框一般是不显示出来的，否则会影响页面的美观。,网页制作,网页中的表格,以一个常见的网页结构为例介绍表格布局，此页面由顶部的Logo和Banner区，导航菜单区，页面内容区，底部版权区组成。如下图：,嵌套表格。为了满足页面的需要，常常需要进行表格嵌套，进行表格嵌套只需将光标定位在一格单元格中，然后插入一个新的表格即可。嵌套表格可以最大程度的满足页面布局的要求，如下图：,表格的嵌套也有不利因素，例如过多的嵌套影

8、响浏览器的解析，影响页面的显示速度，因此表格的嵌套不要超过三层。在开始嵌套表格前最好计划好，避免反复的合并拆分、嵌套、取消。,1）文字的格式设置 在FrontPage 2000中，文字的录入与编辑与Word的操作完全相同，我们可以直接在插入点所在的位置输入文字，然后通过“格式”菜单可以对文字内容的格式、段落的格式进行设置，也可以为文字内容添加项目符号与编号、边框与底纹。(学会使用 Shift+Enter 换行)2）文本动画 作为网页制作工具，FrontPage 2000针对文字提供了一些动态效果的制作手段，最为常用的是文本动画，文本动画都是采用动态HTML（DHTML）来实现的，因此只有在In

9、ternet Explorer 4.0或以上版本，或者其它支持动态HTML的浏览器中才可以看到文本动画的效果。,网页制作,网页中的文字,FrontPage 2000支持多种图片格式（包括GIF、JPEG、BMP、PHG、TIF、MSP、RAS、WPG、EPS、PCX和WMF），同时它包含了丰富的图片操作命令，提供了以下功能：,网页制作,设置图形透明、剪切图形、给图形添加文本、设置特殊效果（翻转按钮组、叠加、凹凸效果、对比度亮度等）单击左边的图形，FRONTPAGE窗口下又多了一个工具栏，我们称它为“图形”工具栏。（查看-工具栏-图形）,网页中的图片,自动创建缩略图：可以自动创建一个图片的小尺寸

10、版本，并将它链接到原始的图片。这个特征可以用来方便地创建相册网页 图片预览：图片预览是一个很有用的特征，当网页中插入图片时，事先可以预览到图片在网页中的效果，从而选择最合适网页的图片；改进了图片编辑工具：FrontPage 2000提供了图片工具栏，使用户可以方便地对图片进行编辑,网页中的图片,网页中的视频和音频,为了使网页更加丰富多彩，我们还可以在其中插入视频和音频特效。,音频：文件-属性-常规-背景音乐,视频、动画：插入-高级-插件-浏览,超链接与书签超链接是从文本或图片（称为源锚）指向另一个网页或其它类型文件（称为目标锚）的链接。书签则是在网页中预先定义一个位置，它可以作为同一网页或其他

11、网页中的超链接目标锚。1)使用超链接：常用的超链接对象有两种，一种是网页元素（如文本、图片等），一种是热点，热点是图片中的一个部分，为每个热点创建不同的超链接。文本、图片超链接：热点超链接：图形地图,网页制作,超链接与书签,2）使用书签：在同一个页面里跳转或做为其他网页中的超链接目标锚首先定义书签，然后就直接把超链接指向书签。3）设置超链接颜色 4)超链接的浏览与验证：FrontPage 2000提供了“超链接”视图供用户浏览网站内各网页所建立的超链接；验证超阶级链接是否有效可通过“报表”视图来实现。,常用组件的使用FrontPage组件是内建的FrontPage对象，当作者保存网页时该对象被

12、执行，或者在某些情况下当用户浏览网页时被执行。FrontPage组件可以生成HTML代码，在某些情况下也可以生成客户端或服务器端的脚本代码。在FrontPage 2000中常用的组件有：1）横幅广告管理器：用于快速制作简单的广告牌。2）站点计数器：通常用来统计和显示用户访问网页的次数。3）悬停按钮：当鼠标移动到动态按钮上面或者单击该按钮时，这种按钮会改变其颜色或形状，或者按照作者所定义的其他方式来动作。4）字幕组件：用于在网页中显示水平滚动的文本信息5）网页过渡：设置网页的过渡效果，当浏览者进入或离开网页时过渡效果都会 自动播放6)包含网页：在一个网页中包含另外的一个网页,网页制作,框架网页的

13、制作框架网页将浏览器的显示窗口分成多个区域，每个区域称为一个框架，在每个框架中可以包含一个独立的、能够滚动的网页。1)创建框架网页：在FrontPage编辑窗口中,可以利用框架网页模板创建一个新的框架网页。2)设置框架中显示的网页：对于框架网页中的每个框架，都必须指定它显示的内容，其内容可以是HTML网页、图片文件或者其他的任意类型的文件。3)保存框架网页：框架网页不同于普通网页，它不仅包含一个框架，每个框架内还包含一个网页文件。4)设置超链接的目标框架在框架网页中，允许将某一网页中超级链接的目标锚设置在同页面中其它框架内。,网页制作,共享边框：是站点上有一个或多个网页共享的区域，共享边框可能

14、是一个在网页顶端(类似于网页页眉)、底端(类似于网页页脚)、左边或右边的区域。共享边框是创建具有一致外观的网页的最快速最灵活而且最容易的方法。,添加表单表单使Web站具有交互功能，使其不再是单一形式的对信息进行发布的载体，同时也是对信息进行收集的载体。在表单中可以包含文本、图片、表格和大多数可以在网页中插入的其他对象。1)表单域表单域就是用户可以在其中输入信息的区域，一个表单中可以包含多个表单域。2）创建表单直接通过“插入”菜单下的“表单”选项即可。3)表单属性的设置创建表单后必须设置表单的属性，在快捷菜单中选择“表单属性”菜单项，即可。,网页制作,当网站建立好之后，用户需要在互联网上发布网站

15、，这样自己开发设计的网站才能被互联网上其他用户浏览。发布网站的过程就是把本机上的网站中的所有文件上传到Web服务器上，能够提供WWW浏览服务，用户用浏览器在Internet上浏览网页，其实都是在访问相应Web服务器中的网页文件。,网站发布,1、制作好教学网站后可向现代教育技术中心教育技术部（电话85283889）申请服务器空间，空间大小一般限制在1G.2、申请个人主页空间 由于网络服务器的租用费用较高，个人用户一般都是向提供网页服务的ISP申请个人免费主页空间。如 免费空间广告多，性能不稳定，因此可申请一些付少量费用的空间，如 注册成功后，相关信息会发送到您的信箱，提供免费空间的网站的目录、地

16、址标志、你的主页网址、用户名、密码等，有时要求在你的网页代码中加上有关广告的HTML代码.,1.在FrontPage 2000中发布网站 从ISP处申请好网页服务后，我们需要在FrontPage 2000中将网站发布到服务器上。配置Web Server服务 如果用户暂时不需要将自己建立的网站上传到互联网上供所有互联网用户使用，只希望自己所在局域网内的用户能访问到，也可以在本机上自行配置自己的Web server服务。,网站发布,站点的发布,2.利用cutftp软件上传CuteFTP 的 基 本 使 用 方 法 CuteFTP是一个非常优秀的上传、下载工具，在目前众多的FTP软件中，CuteFT

17、P因为其使用方便、操作简单而备受网上冲浪者的青睐。下面我们以现较流行的CuteFTP中文汉化版为例，来简单讲解它的使用。,1、运行CuteFTP，认识CuteFTP的基本界面。（图一）,2、新建FTP帐号。点击文件-新建-FTP站点，弹出对话框。（图二）（图二）,3、将你主机信中的服务器地址，服务端口，密码填入对话框。（图三）,4、设置本地路径。在本地目录窗口中，点击此项的下拉菜单，你可以选择欲上传文件的本地目录。（图四）,5、上传文件。在本地目录窗口的文件列表中,选中要上传的文件，点击鼠标右键，选择上传。（图五）,6、下载文件。在上传目录窗口中选中要下载的文件，点击鼠标右键，选择下载。（图六

18、）,3.通过地址栏:格式ftp:/账号:密码IP地址例：FTP:/202.116.160.98 账号:lianxi密码:lianxi浏览地址:http:/202.116.160.98:8000/course/lianxi/index.htm,用FrontPage2000下载整个网站：当你在网上看到一些漂亮的网站时,如何把它下载下来呢?在FrontPage 2000的站点模板选择窗口中有这样一个选项点击：新建-站点-导入站点向导将你要下载的网址输入后,通过向导下载整个网站。,网站下载,1.学习内容的编排要适合网上学习者的自主自学网上学习材料的编排，要充分体现课堂教学中教师讲课的特点对理论和原理进

19、行系统和详细的说明；用通俗易懂的实例来解释和阐述原理；采用亲切、友好、互动的方式来编排学习内容；把学习材料的内容分成不同的段落，方便学习者利用小块时间学习相对整体的内容尽量用图解等直观方式帮助学习者掌握学习内容；采用思维图进行章节的总结，帮助学习者从整体上掌握学习容。,网上教学材料撰写的要点,教学网站教材的撰写与应用,2.学习内容的撰写要促进学习者的交互学习 在远程教育交互理论中，“学习者与学习内容的交互”是首要的交互。要促进学习者和学习内容的交互，关键是网上学习材料需要按照交互性原则进行撰写，使用交互性原则撰写学习材料的策略很多，例如，采用对话式学习材料撰写方法，使学习者感到在阅读网上学习材

20、料时，犹如在教师进行启发式交谈；通过学习材料中的思考题，激发学习者进行学习思考；通过自测题进行交互式学习评估等等。,网上教学材料撰写的要点,教学网站教材的撰写与应用,3.学习内容的选择要结合成人学习者的实践 经验式学习是成人学习的有效方法。在学习者进行理论学习时，如果能将理论与学习者的经验结合起来，就能取得良好的学习效果。4.学习内容的组织可适当采用基于问题的学习 基于问题的学习就是以问题为焦点，要求学生通过网络进行协作学习，提出解决问题的思路和途径，在解决问题的过程中掌握知识，并获得解决实践问题的经验，逐渐形成自主学习和终身学习的能力,网上教学材料撰写的要点,教学网站教材的撰写与应用,网上教学材料撰写的要点,5.学习内容的呈现可采用多种学习媒体 网上学习材料可以是灵活多样的，它不仅可以是文字材料，也可以是视听材料。为学习者提供多种媒体的学习材料，能使网上学习者的学习更加灵活、丰富、有效。,教学网站教材的撰写与应用,网上学习材料的特征及与教科书的差异,教学网站教材的撰写与应用,网上学习材料撰写的语言使用,教学网站教材的撰写与应用,网上学习材料撰写中的图表使用 网上学习材料撰写的原理之一是采用图解的方式，让学习者一目了然，易于理解和掌握,根据学习内容采用不同的图表工具列表,教学网站教材的撰写与应用,