现代教育技术中心

1、现代教育技术中心 2021-4-242021-4-242 教学网站分为两大类：教学网站分为两大类： 1.网络教学（网络学院、网络选修课）教学一般是建立在教 学平台上 2.辅助教学（课程内容的复习和知识的扩展） 教学网站的功能教学网站的功能: : 要使学习者通过学习和运用教学网站上的模块，替代部分教 学活动 教学网站模块主要包含：教学网站模块主要包含： 学习内容、内容讲解(多媒体)、学习导航、案例分析、学习 反馈、思考活动、布置作业、学习建议、学习进度管理（网 络教学辅助平台或编辑动态网页） 2021-4-242021-4-243 网页制作一般采用网页制作一般采用 Dreamweaver 和和

2、Frontpage 软件软件 软件软件 Frontpage 版本说明版本说明 Frontpage 2000 版本是全国计算机考试所确定的版本。版本是全国计算机考试所确定的版本。 学校服务器：学校服务器： ( 账号、密码均为账号、密码均为train)培训软件文件夹中有培训软件文件夹中有 Microsoft Office2000 安装软件。下载后在本机安装时只选择安装安装软件。下载后在本机安装时只选择安装frontpage即可。即可。 参考网站：参考网站： 2021-4-242021-4-244 FrontPage 2000FrontPage 2000的启动与退出的启动与退出 FrontPage

3、2000的启动与退出的方法与其它的Windows应用程 序相同。 （1）启动操作 （2）退出操作 FrontPage 2000FrontPage 2000的用户界面的用户界面 FrontPage 2000的主窗口界面由： 标题栏、菜单栏、工具栏、视图栏、编辑器、状态栏组成。 2021-4-242021-4-245 FrontPage 2000FrontPage 2000支持支持6 6种不同的视图，它们分别是：种不同的视图，它们分别是： l l网页视图：可以用不同的方式编辑网页或浏览网页。网页视图：可以用不同的方式编辑网页或浏览网页。 l l文件夹视图：可以按照文件夹的形式查看站点中的文件组成情

4、况。文件夹视图：可以按照文件夹的形式查看站点中的文件组成情况。 l l报表视图：该视图下显示的是当前站点的统计数据。其内容涉及到所有的文件、报表视图：该视图下显示的是当前站点的统计数据。其内容涉及到所有的文件、 图片、未链接与已链接的文件等的数量、大小及简要说明。图片、未链接与已链接的文件等的数量、大小及简要说明。 l l超链接视图：超链接是超链接视图：超链接是WebWeb站点中最重要的部分，在网页中通常少不了超链接。站点中最重要的部分，在网页中通常少不了超链接。 l l 任务视图：这是任务视图：这是FrontPage 2000FrontPage 2000为制作复杂网站提供的一种有力工具，通过

5、它，为制作复杂网站提供的一种有力工具，通过它， 设计人员可以根据工作安排制定详细的任务列表设计人员可以根据工作安排制定详细的任务列表。 2021-4-242021-4-246 创建网站的一般过程由以下几个步骤构成：创建网站的一般过程由以下几个步骤构成： ( (1) 需求分析 (2) 规划网站 (3) 收集内容 (4) 建立Web站点 (5) 制作网页 根据网站的建设规划，制作网站的主页面及其它页面 (6) 测试网站及网页 (7) 发布网站 (8) 维护与更新 从设计阶段来说，最为重要的就是做好网站的规划、收集建立网站需要的 资料及制作网页。 网页制作网页制作 2021-4-242021-4-2

6、47 （1 1）确定站点结构）确定站点结构 根据Web站点的需要，明确建立站点的目标，确定站点 的组成部分及各页面间的层次关系，除此之外，制作网 页所需要的各类型的素材应建立相应的素材文件夹以统 一管理。 （2 2）创建）创建WebWeb站点站点 规划好站点后，需要在FrontPage 2000中制作出相应的 网站结构 网页制作网页制作 2021-4-242021-4-248 层状结构 层状结构（如图1.8所示）类似于目录系统的树体结构，由网站 文件的主页开始，依次划分为一级标题、二级标题等等，逐级细 化，直至提供给浏览者具体信息。 主 页 页面1页面2页面3 页面4页面5页面6页面7 一级标

7、题 二级标题 图1.8 层状结构 2021-4-242021-4-249 线性结构 线性结构（如图1.9所示）类似于数据结构中的线性表，用于 组织本身的线性顺序形式存在的信息，可以引导浏览者按部就班地 浏览整个网站文件。这种结构一般都用在意义是平行的页面上。 通常情况下，网站文件的结构是层状结构和线性结构相结合的。这样 可以充分利用两种结构各自的特点，使网站文件既具有条理 性、规范性，又可同时满足设计者和浏览者的要求。 主 页 页 面 1 页 面 2 页 面 3 图1.9 线性结构 2021-4-242021-4-2410 Web结构 Web结构（如图1.10所示）类似于Internet的组成

8、结构，各网 页 之间形成网状连接，允许用户随意浏览。 主 页 页面1页面2页面3 页面4页面5页面7页面8 一级标题 二级标题 图1.10 Web结构 页面6 2021-4-242021-4-2411 制作网页制作网页 规划好网站的结构后，即将开始网站的内的网页制作。 网页是站点中最基本的文档，它是用HTML语言编写的。 由于FrontPage具有所见即所得的特性，并能自动创建 HTML代码，所以在不很了解HTML语言的情况下，用 FrontPage创建出多种格式的网页。 1）创建网页 2）保存网页 新的网页建立后，要以HTML的格式进行保存，直接选 择文件菜单下的“保存”选项，即可弹出“另存

9、为”对 话框，与其它Office系列软件一样，我们可以在此处选 择文件保存的位置，并对文件进行命名。 网页制作网页制作 2021-4-242021-4-2412 在所有的网页制作软件中，表格的作用不仅是可以直观地描述数据， 还可利用表格来划分网页的页面布局。 1)1)表格的插入与编辑表格的插入与编辑 在FrontPage 2000里，表格的操作与Word类似。 2)2)利用表格进行布局利用表格进行布局 在FrontPage 2000里，表格可以用来进行页面布局。所谓页面布局， 就是利用表格来确定文本、图片等网页元素的位置，作为表布局用 的表格，其边框一般是不显示出来的，否则会影响页面的美观。

10、网页制作网页制作 2021-4-242021-4-2413 以一个常见的网页结构为例介绍表格布局，此页面由顶部的 Logo和Banner区，导航菜单区，页面内容区，底部版权区组 成。如下图： 2021-4-242021-4-2414 嵌套表格。嵌套表格。 为了满足页面的需要，常常需要进行表格嵌套，进行表格嵌套只需将光标定 位在一格单元格中，然后插入一个新的表格即可。嵌套表格可以最大程度的 满足页面布局的要求，如下图： 表格的嵌套也有不利因素，例如过多的嵌套影响浏览器的解析，影响页面的显示 速度，因此表格的嵌套不要超过三层。在开始嵌套表格前最好计划好，避免反复 的合并拆分、嵌套、取消。 2021

11、-4-242021-4-2415 1）文字的格式设置 在FrontPage 2000中，文字的录入与编辑与Word的操作完全相同， 我们可以直接在插入点所在的位置输入文字，然后通过“格式”菜单可 以对文字内容的格式、段落的格式进行设置，也可以为文字内容添加项 目符号与编号、边框与底纹。 (学会使用 Shift+Enter 换行) 2）文本动画 作为网页制作工具，FrontPage 2000针对文字提供了一些动态效果 的制作手段，最为常用的是文本动画，文本动画都是采用动态HTML （DHTML）来实现的，因此只有在Internet Explorer 4.0或以上版本， 或者其它支持动态HTML的

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

13、一个图片的小尺寸版本，并将它链接 到原始的图片。这个特征可以用来方便地创建相册网页 图片预览：图片预览是一个很有用的特征，当网页中插入图片时，事 先可以预览到图片在网页中的效果，从而选择最合适网页的图片；改进了 图片编辑工具：FrontPage 2000提供了图片工具栏，使用户可以方便地对 图片进行编辑 2021-4-242021-4-2418 网页中的视频和音频网页中的视频和音频 为了使网页更加丰富多彩，我们还可以在其中插入视频 和音频特效。 音频：文件-属性-常规-背景音乐 视频、动画：插入-高级-插件-浏览 2021-4-242021-4-2419 超链接与书签超链接与书签 超链接是从文

14、本或图片（称为源锚）指向另一个网页或其它类 型文件（称为目标锚）的链接。书签则是在网页中预先定义一 个位置，它可以作为同一网页或其他网页中的超链接目标锚。 1)使用超链接：常用的超链接对象有两种，一种是网页元素 （如文本、图片等），一种是热点，热点是图片中的一个部分， 为每个热点创建不同的超链接。 文本、图片超链接文本、图片超链接： 热点超链接热点超链接：图形地图：图形地图 网页制作网页制作 2021-4-242021-4-2420 超链接与书签超链接与书签 2）使用书签 ：在同一个页面里跳转或做为其他网页中的超链接 目标锚 首先定义书签，然后就直接把超链接指向书签。 3）设置超链接颜色设置超

15、链接颜色 4)超链接的浏览与验证：FrontPage 2000提供了“超链接”视图 供用户浏览网站内各网页所建立的超链接；验证超阶级链接是否 有效可通过“报表”视图来实现。 2021-4-242021-4-2421 常用组件的使用常用组件的使用 FrontPage组件是内建的FrontPage对象，当作者保存网页时该对象被执行，或 者在某些情况下当用户浏览网页时被执行。FrontPage组件可以生成HTML代码， 在某些情况下也可以生成客户端或服务器端的脚本代码。 在FrontPage 2000中常用的组件有： 1）横幅广告管理器：用于快速制作简单的广告牌。 2）站点计数器： 通常用来统计和显

16、示用户访问网页的次数。 3）悬停按钮 ：当鼠标移动到动态按钮上面或者单击该按钮时，这种按钮会改 变其颜色或形状，或者按照作者所定义的其他方式来动作。 4）字幕组件：用于在网页中显示水平滚动的文本信息 5）网页过渡：设置网页的过渡效果，当浏览者进入或离开网页时过渡效果都会 自动播放 6)包含网页：在一个网页中包含另外的一个网页 网页制作网页制作 2021-4-242021-4-2422 框架网页的制作框架网页的制作 框架网页将浏览器的显示窗口分成多个区域，每个区域称为一个框架， 在每个框架中可以包含一个独立的、能够滚动的网页。 1)创建框架网页：在FrontPage编辑窗口中,可以利用框架网页模

17、板创建 一个新的框架网页。 2)设置框架中显示的网页：对于框架网页中的每个框架，都必须指定它 显示的内容，其内容可以是HTML网页、图片文件或者其他的任意类型的 文件。 3)保存框架网页：框架网页不同于普通网页，它不仅包含一个框架，每 个框架内还包含一个网页文件。 4)设置超链接的目标框架 在框架网页中，允许将某一网页中超级链接的目标锚设置在同页面中其 它框架内。 网页制作网页制作 2021-4-242021-4-2423 共享边框：共享边框：是站点上有一个或多个网页共享的区域，共享边框可能是一个 在网页顶端(类似于网页页眉)、底端(类似于网页页脚)、左边或右边的 区域。共享边框是创建具有一致

18、外观的网页的最快速最灵活而且最容易 的方法。 2021-4-242021-4-2424 添加表单添加表单 表单使Web站具有交互功能，使其不再是单一形式的对信息进行发布的 载体，同时也是对信息进行收集的载体。在表单中可以包含文本、图 片、表格和大多数可以在网页中插入的其他对象。 1)表单域 表单域就是用户可以在其中输入信息的区域，一个表单中可以包含多 个表单域。 2）创建表单 直接通过“插入”菜单下的“表单”选项即可。 3) 表单属性的设置 创建表单后必须设置表单的属性，在快捷菜单中选择“表单属性”菜 单项，即可。 网页制作网页制作 2021-4-242021-4-2425 当网站建立好之后，

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

20、空间的网站的目录、 地址标志、你的主页网址、用户名、密码等，有时要求在你的网页代码中 加上有关广告的HTML代码. 2021-4-242021-4-2426 1.1.在在FrontPage 2000FrontPage 2000中发布网站中发布网站 从从ISPISP处申请好网页服务后，我们需要在处申请好网页服务后，我们需要在 FrontPage 2000FrontPage 2000中将网站发布到服务器上中将网站发布到服务器上 。 配置配置Web ServerWeb Server服务服务 如果用户暂时不需要将自己建立的网站上传到互如果用户暂时不需要将自己建立的网站上传到互 联网上供所有互联网用户使

21、用，只希望自己所在局联网上供所有互联网用户使用，只希望自己所在局 域网内的用户能访问到，也可以在本机上自行配置域网内的用户能访问到，也可以在本机上自行配置 自己的自己的Web serverWeb server服务。服务。 站点的发布站点的发布 2021-4-242021-4-2427 2021-4-242021-4-2428 2021-4-242021-4-2429 （图二） 2021-4-242021-4-2430 2021-4-242021-4-2431 2021-4-242021-4-2432 2021-4-242021-4-2433 2021-4-242021-4-2434 3.3.通

22、过地址栏通过地址栏: :格式格式账号账号: :密码密码IPIP地址地址 例：例： FTP: /8 FTP: /8 账号账号: lianxi: lianxi 密码密码: lianxi: lianxi 浏览地址浏览地址: : 2021-4-242021-4-2435 用用FrontPage2000FrontPage2000下载整个网站：下载整个网站： 当你在网上看到一些漂亮的网站时,如何把它下载 下来呢? 在FrontPage 2000的站点模板选择窗口中有 这样一个选项点击：新建-站点-导入站点向导将 你要下载的网址输入后,通过向导下载整个网站

23、。 2021-4-242021-4-2436 1. 1. 学习内容的编排要适合网上学习者的自主自学学习内容的编排要适合网上学习者的自主自学 网上学习材料的编排，要充分体现课堂教学中教师讲课的特点网上学习材料的编排，要充分体现课堂教学中教师讲课的特点 对理论和原理进行系统和详细的说明；对理论和原理进行系统和详细的说明； 用通俗易懂的实例来解释和阐述原理；用通俗易懂的实例来解释和阐述原理； 采用亲切、友好、互动的方式来编排学习内容；采用亲切、友好、互动的方式来编排学习内容； 把学习材料的内容分成不同的段落，方便学习者利用小块时间学把学习材料的内容分成不同的段落，方便学习者利用小块时间学 习相对整体

24、的内容习相对整体的内容 尽量用图解等直观方式帮助学习者掌握学习内容；尽量用图解等直观方式帮助学习者掌握学习内容； 采用思维图进行章节的总结，帮助学习者从整体上掌握学习容。采用思维图进行章节的总结，帮助学习者从整体上掌握学习容。 网上教学材料撰写的要点网上教学材料撰写的要点 2021-4-242021-4-2437 2. 2. 学习内容的撰写要促进学习者的交互学习学习内容的撰写要促进学习者的交互学习 在远程教育交互理论中，在远程教育交互理论中，“学习者与学习内容的交互学习者与学习内容的交互”是首要是首要 的交互。要促进学习者和学习内容的交互，关键是网上学习材料需的交互。要促进学习者和学习内容的交互，关键是网上学习材料需 要按照交互性原则进行撰写，使用交互性原则撰写学习材料的策略要按照交互性原则进行撰写，使用交互性原则撰写学习材料的策略 很多，例如，很多，例如， 采用对话式学习材料撰写方法，使学习者感到在阅读网上学习材采用对话式学习材料撰写方法，使学习者感到在阅读网上学习材 料时，犹如在教师进行启发式交谈；料时，犹如在教师进行启发式