《用FrontPage制作网页课件教程》由会员分享,可在线阅读,更多相关《用FrontPage制作网页课件教程(8页珍藏版)》请在金锄头文库上搜索。
1、用 FrontPage 制作网页课件【教学目标】了解用 FrontPage 制作课件的优势与不足,学会用 FrontPage 制作网页型课件。【重点难点】重点是如何在 FrontPage 插入多媒体素材,难点是课件交互性的实现和网页源代码的应用。【教学策略】教师实例演示,学生上机操作,教师辅导和点评。 【媒体选择】主要采用 FrontPage 示范课件和实际操作讲解相结合,并辅以文字教材 、网上学习资源和教学光盘。 【教学内容】现在越来越多的课件是用网页制作工具来制作,并结合数据库、 ASP 等技术来加强课件的交互性。网页形式的课件可以集成丰富的多媒体信息,具有交互性强、制作简易、体积小、便于
2、在网络上发布、传播和更新等优点,适合于个别化学习、课堂教学和网络教学。 网页课件的开发工具软件有很多,包括: 语言编程如 HTML 、 D HTML 、 ASP 、 JSP 、 PHP 、 JAVA 、 JavaScript 、 VBScritp 、 VRML 等。 所见即所得的可视化编辑工具,如 FrontPage 、 Dreamweaver 、 Flash 、 Authorware 、 PowerPoint 、 CourseBuilder 等。 对于一般都有繁重教学任务在身的学科教师来说,没有太多的精力去学习复杂的编程语言。 可视化网页编辑工具由于源代码自动生成,使教师可以有更多的精力关注
3、内容的表达和教学设计。 用 FrontPage 编制的网页课件有较易操作的界面(与上网浏览网页完全相同) ,一门课程或一堂课的脉络结构(知识结构)可以在主页上用菜单(树形菜单或弹出菜单)或导航条的形式清楚地表明,可以列出教学目的、内容、重点难点、引言、概念性质、例题、练习、小结、作业等等,甚至操作注意事项。 FrontPage 被公认为最好的入门级的网页编辑工具。一、 FrontPage 基本操作 1. 启动 FrontPage : 双击桌面上的 FrontPage 快捷方式图标; 开始程序 Microsoft FrontPage ;右击一个扩展名为 htm 或 html 网页文件,选“编辑”
4、 。 2. 打开或隐藏视图栏、文件夹列表和网页文档 a. 点“视图 视图栏”打开或隐藏视图栏。点“视图 文件夹列表”打开或隐藏文件夹列表。 b. 右击 扩展名为 htm 或 html 网页文件( 如 index.htm ) ,选“编辑” ,系统默认用 FrontPage 打开网页。 c. 点“文件 打开”或点 常用工具栏中的“打开”按钮, 从本地磁盘或网络驱动器中打开网页文档,从任意 Web 网站打开网页,打开最近打开过的网页文档。 3. 在 FrontPage 编辑器中预览网页 a. 点普通视图按钮,观察刚才打开的 index.htm 网页。b. 点 HTML 视图按钮,观察 index.h
5、tm 网页。 c. 点预览视图按钮,观察 index.htm 网页。 4.FrontPage 视图方式: 网页视图,文件夹视图,报表视图,导航视图,超级链接接视图,任务视图。 5. 保存网页: 点“文件 保存(另存为) ”或点 常用工具栏中的“保存”按钮,将新建的网页或从万维网上打开的网页保存到本地磁盘,把自己喜欢的网页作为模板保存。 6. 关闭网页: 点“文件 关闭”或文档窗口 中的“ X ”按钮,关闭当前网页。 二、设计网页课件的框架结构 三、在网页中插入表格、图像、 背景、 剪贴画、声音、视频 和动画等多媒体对象 1. 插入表格 插入 到网页上的文本、图片、音频、视频、动画等元素,往往看
6、起来显得不够整齐,为了使网页更美观,我们利用表格来控制复杂的网页布局,即 用 表格来定位 网页元素 。 (1) 点“表格 插入 表格” ,输入行数、列数(如 3 列 5 行) ,插入一个规则表格, 设置表格的属性。 (2) 用“表格”工具栏上的 按钮或“表格”菜单上的“插入行或列”命令来增加 表格的 行或列。 (3) 用“表格”工具栏上的按钮删除一个单元或多个单元,删除一行、多行或一列、多列,删除整个表格,表格删除后立即按“常用工具栏”中的“撤消”按钮或按“ Ctrl+Z ”恢复表格;选择单元格或单元格中的内容用鼠标把选择的内容拖到新位置进行移动;按住 CTRL 键,再用鼠标把选择的内容拖到新
7、位置进行复制。 (4)选中需要拆分的单元,单击“表格”工具栏上的按钮或使用“表格”工具栏上的“笔”拆分单元格;选中需要合并的单元,单击“表格”工具栏上的按钮或单击“表格”工具栏上的( 擦除 ) 按钮合并单元格。经过处理, 3 列 5 行的表格 变成 1 列 4 行。 2. 插入图像和背景图象 将鼠标定位到要插入图片的位置(如某个单元格内) ,单击“常用工具栏”上的“插入图片”按钮,从已建站点的图片文件夹中 选择 合适 的图片,点击“确定” 。也可以 在“图片”对话框中点击“插入一个计算机中的图片”按钮, FrontPage 编辑器将打开“选择文件”对话框,从本地磁盘中指定一个图像文件。 右击网
8、页空白处,选“ 网页属性 ”快捷命令,单击“ 网页属性 ”对话框的“背景”选项卡,先选中“背景图片”复选框,选择合适的图像作为背景图插入网页,点击“确定”按钮。 3. 插入剪贴画 点“插入”“图片”“剪贴画”命令,选择一幅剪贴画,单击“插入”按钮,或直接双击剪贴画。 4. 插入声音或视频剪辑 选择“插入”“高级”“插件”命令,打开“插件属性”对话框,单击“浏览”按钮,打开“选择插件数据源”对话框,从站点文件夹或本地计算机上指定要播放的声音或视频文件。调整网页中插件图标到合适的尺寸。 5. 修改图像属性 右击网页中的图像,选“图片属性”命令,在“常规”选项方式下指定图像的格式(例如 jpg 和质
9、量 75 ) ;在“文本”框内简单地描述图像;单击“外观”选项卡,指定图像无边框即边框线宽度为 0 ,指定图像与相邻的文字或图像之间的水平间隔和纵向间隔,要改变图像的大小,首先选中“大小”框内的“指定大小”复选框,然后分别指定图像的宽度和高度。熟悉“图片”工具栏:创建自动缩略图;调整图像的黑白对比度和亮度;给图像加上斜面边界;把彩色图像变成黑白图像;把图像翻转;修正图像;裁剪图像;淡化图像;把图像恢复原样;在 GIF 格式的图像上写文字;使 GIF 图像透明等。 6. 插入水平线美化网页 网页水平线用于把网页分隔成几个部分。新建或打开网页文档,把插入点移到要插入水平线的地方,单击“插入”菜单上
10、的“水平线”命令。要把水平线插入在下一行,就把插入点定在行尾。在水平线上单击鼠标右键,在弹出的菜单中选择“水平线属性”命令,也可直接双击该水平线,设置水平线的宽度 、 水平线的对齐方式和水平线的颜色。 四、在课件网页中使用书签和超级链接接 1. 书签的作用书签用于在长网页内部快速跳转和定位。 2. 创建书签 网页 从 Web 网页上复制一篇比较长的文本,粘贴(选择性粘贴:无格式文本)到新建网页中。选择要标记的位置,单击“插入”菜单中的“书签”命令。 FrontPage 编辑器将显示“书签”对话框。在“书签”框中键入书签名称(最好用西文命名) ,书签名称应具有较好的描述性,然后单击“添加”按钮。
11、可看到标签小旗出现在期望定位的位置上。用同样的方法创建其它书签。 在网页顶端创建系列提纲(目录)文本,选中其中一个,右击文本,选“超链接” ,在“链接到”栏中点“本文档中的位置” ,在书签列表中选中合适的书签,确定。用同样的方法给其它的提纲(目录)文本建立超链接。保存网页,在 IE 中预览。 3. 超级链接使用超级链接,不仅可使站内的网页成为一个有机整体,还可使不同的站点之间建立联系。例如,在制作“网上学习资源”网页时,需要给所列出的大量的网上学习资源的标题文字设置超链接,以便访问者通过点击网页上的标题文字打开相对应的学习资源。首先选中标题目文字,然后单击标准工具栏上的“超级链接”按钮,在弹出
12、的“创建超链接”对话框中指定超级链接所对应的网页,或在 URL 文本框中填入网页的地址即可。 4创建图像热点作为超级链接接新建或打开包含有复杂图片(如地图或大型仪器图片)的网页。练习创建图像热点作为超级链接接。例如,在世界地图片上的“国家地区”区域处创建一个热点,指定它跳转到“按国家地区查询”的主页上。方法是:首先单击图像,编辑器将显示“图片”工具栏,选择“图片”工具栏上的“图片”按钮,把光标移到图像上,光标将变成笔状,按住鼠标左键在图像上画出热点。释放鼠标后, FrontPage 编辑器自动打开“创建超级链接”对话框,在此指定该热点要跳转的目标网页或网址。制作好后在 IE 浏览器中预览。 5
13、. 改变超级链接的外观选择某文字超级链接,单击“格式”菜单上的“背景”命令,打开“网页属性”对话框的“背景”选项。把该超级链接的颜色改为另一种更醒目的颜色,预览一下,看超级链接文字是否发生变化。试着用不同的颜色表示未访问过的超级链接 (Hyperlink) 、访问过的超级链接 (Visited Hyperlink) 和将要访问的超级链接 (Active Hyperlink) 。看看改变超级链接的外观的效果。 6. 编辑超级链接属性右击超级链接,选“超级链接属性” ,FrontPage 编辑器将打开,在 URL 框内键入新的网页文件名或网址。观察改变后的效果。 7. 取消超级链接右击超级链接,选
14、“取消超级链接”命令。 五、插入活动元素 - 让课件网页活起来 1. 制作悬停按钮 定位插入点,单击“插入” / “组件” / “悬停按钮” ,打开“悬停按钮”对话框。把动态按钮默认标签“按钮文本” ,改成所需的按钮文字,单击“字体”按钮,在打开的“字体” (字体)对话框里设置您所需标签的字体。要为动态按钮创建超级链接,可直接在“链接到”框内键入要跳转的 URL ,也可单击“浏览”按钮,从当前打开的网站、 WWW 、本地磁盘中指定跳转目标。可重新指定按钮的前景颜色,不过如果按钮显示的是图像,前景颜色无效。当用户把鼠标移到动态按钮上时,按钮的颜色将自动发生变化,这是动态按钮最大的特色,至于颜色是
15、怎样变化的,可通过“效果”和“效果颜色”框设定。还可改变按钮的宽度和高度(以像素为单位) 。动态按钮还有一些高级用法,单击“自定义”按钮,在“自定义”对话框可设置播放声音或音乐和在动态按钮上显示图像等。 2. 制作横幅广告 定位插入点后,单击“插入” / “组件” / “横幅广告管理器”命令,打开“横幅广告管理器”对话框。单击“添加”按钮从图片目录下分别获取图片序列(例如 01.gif 04.gif ) ,设置宽度、高度、渐变效果、显示每幅图片时间。要为横幅广告创建一个超级链接,只需在“链接”框内键入跳转目标的 URL ,或者单击“浏览”按钮定位跳转目标。 3. 制作字幕 定位插入点后,单击“
16、插入” / “组件” / “字幕”命令,打开“字幕属性”对话框。在“文本”框内键入要显示的字幕内容,设定文字游动“方向” 、 “速度” 、 “表现方式” 、 “文本对齐方式”等选项。在“表现方式”框内,可指定字幕游动的方式,默认是“滚动条” ,如果选“幻灯片” ,表示当第一个字符而不是最后一个字符触及左边界时就停止游动,如果选“交替” ,表示像钟摆那样在左右边界内摆来摆去。可任意设置字幕的宽度和高度,字幕的宽度和高度既可以按像素的绝对值给出,也可以按 Web 浏览器窗口的百分比给出。默认情况下,字幕周而复始,不停地游动,周而复始。您可让字幕只游动若干次,方法是,不选中“连续”复选框,然后在“次数”框内选择要游动的次数。此外,还可给整个字幕加上“背景颜色” 。 4 、插入 Flash 动画 方法一:“插入”“ Web 组件”“高级控件”“插件” ( 1 )将鼠标定位到要插入 Flash 动画 的位置,单击菜单命令“插入”“ Web 组件” ,在“插入 Web 组件