1、 第一课第一课 简单网页尝试做简单网页尝试做 教学目的与要求： 1掌握建立站点的方法； 2掌握保存网页及预览网页的方法。 教学重难点： 1建立站点； 2保存网页； 3预览网页。 教学过程： 一复习巩固 二引入新课 目前， 可以制作网站的工具软件非常多， 我们选用 FrontPage 作为网 站制作的工具软件。 三建立新站点 1打开 FrontPage，单击“文件”“新建”“站点” ，打开“新 建”对话框。 2选择“空站点” ，键入站点的保存位置和名称，单击“确定”按钮。 四建立网页 在 FrontPage 中创建站点后，会自动在站点文件夹内创建两个文件 夹，用于制作网页时存放各类资源。 在光标
2、处输入网站的名称，并写上一段欢迎的文字，例如“欢迎走进 温馨的 XX 班网上家园” 。 这样，一个只有文字的网页就建立好了。 五保存网页 单击“文件”“保存文件” ，打开“另存为”对话框，输入文件名， 单击“保存”按钮。 六预览网页 1在浏览器中预览网页。单击“文件”“在浏览器中预览” ，打开 “在浏览器中预览”对话框，单击预览。 2在 FrontPage 窗口中单击“预览”按钮，进行预览。 3观察使用两种预览方法所显示的预览效果。 七思考与练习 建立一个新站点，并输入文字，保存后预览。 第二课第二课 美化网页显身手美化网页显身手 教学目的与要求： 1掌握打开站点的方法； 2掌握插入图片的方法
3、； 3掌握保存图片的方法。 教学重难点： 1插入图片； 2保存图片。 教学过程： 一复习巩固。 二引入新课 仅有文字的网页显得有些单调， 今天， 我们在网页上挂上我们的全家 福“班级合影”图片。 三打开站点 1单击“文件”“打开站点” ，弹出“打开站点”对话框。 2单击“查找范围”后的小方块按钮，选择站点位置。单击“打开” 按钮。 四插入图片 1在文件夹列表中，双击 new_page_1.htm,打开网页。 2在网页上把光标移到要插入图片的位置。 3单击“插入”“图片”“来自文件” ，打开“图片”对话框。 4单击“从计算机上选择文件”按钮，弹出“选择文件”对话框。 5单击“查找范围”后的小方块
4、按钮，选择图片文件所在的位置。 6选择图片文件， “班级合影” ，单击“确定”按钮。 插入的图片的大小可以自由调整。单击图片，出现 8 个控制点， 拖动这些控制点就可以改变图片的大小。 网页上常用的图形格式有 Gif 和 Jpeg 两种。 五保存图片 在保存含有图片的网页时， 计算机会自动弹出一个 “保存嵌入式文件” 对话框。这是因为我们刚刚从站点外“我的资料”文件夹中插入了一 个图片，现在计算机要求把这个图片存放到站点内。 文件名 new_pa1.jpg 是计算机自动生成的。 为了方便使用， 我们可以 重新给图片起名字。在“保存嵌入式文件”中选择图片文件 new_pa1.jpg，单击下面的“
5、重命名”按钮，可对其重命名。我们将 图片文件重命名为 bjhy.jpg。 为方便图片管理， 计算机自动在站点内为我们建立了一个存放图片的 文件夹 images。一般情况下，我们都把图片文件存放在这个文件夹 内。 在“保存嵌入式文件”对话框内，选择图片文件 bjhy.jpg，单击“改 变文件夹” ，打开“改变文件夹”对话框。选中“images” ，单击“确 定”按钮，图片文件 bjhy.jpg 就存放在“images”内了。 单击“确定”按钮就完成了对网页和图片的保存。 六思考与练习 在网页中插入图片， 将插入图片的网页保存， 并将图片存放到 images 文件夹内。 第三课第三课 浏览网页有标
6、准浏览网页有标准 教学目的与要求： 1. 掌握用表格布局的方法； 2. 掌握横幅广告的制作方法； 3. 完成班级简介页面的制作。 教学重难点： 1. 表格的布局与插入； 2. 制作横幅广告。 教学过程： 一.复习巩固 二.引入新课 制作了首页， 我们就好象拥有可一扇大门， 推开这扇门就应该看到里 面丰富多彩的内容。下面，我们用“班级简介”页面、 “班级荣誉” 页面、 “活动剪影”页面?来丰富我们的家园。本课，我们以“班 级简介”页面为例学习网页的制作。 三.插入表格 （制作网页前，我们要先设计网页内容的布局，根据设计，插入合适 的表格。 当要制作一个内容较复杂的网页时， 可以插入两个或多个规
7、范的表格来定位，使每个表格不过于复杂，方便我们的编辑。 ） 1. 新建一个网页。 先插入一个 2 行 2 列的表格， 再将第 2 列合并 成一个单元格。这一表格用来放置网站标志图片和校园风光图片。 2. 将光标放到第一个表格下方， 再继续插入一个1行6列的表格， 用于排放栏目。 3. 将光标放到第二个表格下方， 再继续插入一个1行1列的表格。 在这个表格中制作“班级简介”的文字及图片内容。 布局做好后，网页基本完成了一半。接下来，只要把相应的内容放到 不同的单元格就可以了。 四.给网站名单元格添加背景 将光标定位在单元格内，然后 1. 单击“表格”“属性”“单元格” ，弹出“单元格属性” 对话
8、框； 2. 选中“使用背景图片” ； 3. 单击“浏览” ，选择背景图片文件“背景图 2.gif” ； 4. 单击“确定”按钮。 五.横幅广告的制作 横幅广告并不是一种动画， 而是通过横幅广告管理器制作的由多个大 小相同的图片交替显示的一种动态效果。 将校园风光图片制作成横幅广告。 首先， 将光标定位在插入校园风光 图片的单元格内，然后 1. 单击“插入”“组件”“横幅广告管理器” ，弹出“横幅 广告管理器属性”对话框； 2. 单击“添加”按钮，依次添加要显示的图片； 3. 单击“确定”按钮。 六.思考与练习 第四课第四课 网页素材先准备网页素材先准备 教学目的与要求： 1了解网站建设规划流程
9、； 2收集整理资料。 教学重难点： 1网页的连接； 2网站的规划。 教学过程： 一引入新课 我们的校园生活丰富多彩， 班级活动活泼有趣， 怎样让远方的伙伴了 解我们的校园生活呢？为了更好地展示我们班级的风采， 让更多的人 认识和欣赏我们，我们可以制作班级网站，发布到因特网上，让更多 的人了解我们班。 二网页之间如何联系 1在因特网上，利用超级链接可以方便地将与网站主题相关联的一 个个网页链接起来， 使其变成一张有序的网， 为人们展现丰富的主题 内容。 2以“中国儿童中心”的首页为例，介绍网页的链接。 在 “中国儿童中心” 网站中， 网页是由一层层的超级链接组织起来的。 如第一个页面中包括“芝麻
10、开门” 、 “故事地界” 、 “能力大比拼” 、 “游 戏天地”等栏目， “游戏天地”栏目又分别链接有“益智游戏”网页、 “趣味游戏”网页、 “技巧游戏”网页三大内容。当我们选择“益智 游戏”时，又看到许多游戏名称供我们选择。 3请学生随便找一个网站，点击网页，体验超级链接。 三网站规划与素材准备 网站是由多个网页链接组成的，在开始制作网站前最好做好整体规 划。 1确定网站主题。网站的主题决定制作网站的风格，决定网站所包 含的网页信息。 2搜集素材。通过多种渠道搜集网站所需要的各种素材。 3筛选、整理素材。对搜集来的素材进行必要的挑选、修改、编排、 整理， 筛选出各类网页所需要的素材。 有时还
11、需要根据实际情况自己 动手完成一些必要的文字、图片等素材。 4做好网站建设规划。根据我们筛选、整理的素材，按照不同的分 类，规划整理到不同的网页中。同时要注意使页面布局主题突出、美 观大方、有自己的特色。 5选择网页制作软件，开始制作。 四思考与练习 为自己的班级网站设计一个欢迎首页。 第五课第五课 使用表格版面齐使用表格版面齐 教学目的与要求： 1了解表格在网页中的作用； 2掌握插入表格的方法； 3掌握首页命名及设置网页标题的方法。 教学重难点： 1利用表格制作网页。 教学过程： 一复习巩固 二引入新课 一个好的网页不仅内容要充实， 而且版面要美观。 为了一个好的视觉 效果，需要精心装点自己
12、的家园。打开我们的网页，怎样将网页中的 文字、图片摆放得更美观一些呢？ 三利用表格制作网页 插入表格的方法非常简单， 但在插入表格之前， 我们需要知道自己要 画一个几行几列的表格。 1新建网页并设置网页背景。 单击“新建”按钮，新建一个网页。将适合的图片设置成网页背景 2打开“插入表格”对话框。 单击“表格”“插入”“表格” ，弹出“插入表格”对话框。 3输入行、列数，设置布局参数，单击“确定”按钮。 4通过鼠标调整表格的列宽。 5在合适的位置放入欢迎文字、全家福、欢迎词等。 四设置网页标题 在“保存网页”对话框中设置网页标题。 1输入文件名：index 2单击“更改”弹出“设置网页标题”对话
13、框 3输入网页标题“首页” ，单击“确定按钮” index.htm 是网站常用的首页名。这是因为，我们在浏览器中输入 一个网址时， 浏览器会自动寻找该地址的 index.htm 文件， 并将其打 开。 五思考与练习 建立一个介绍自己的网页。并将内容通过表格定位。 第六课第六课 图像声音齐上阵图像声音齐上阵 教学目的与要求： 1掌握设置背景图片的方法； 2掌握设置背景音乐的方法； 3掌握保存背景音乐的方法。 教学重难点： 1设置背景图片； 2设置背景音乐。 教学过程： 一复习巩固 二引入新课 我们在浏览许多网页时，可以听到优美的音乐，看到漂亮的背景。今 天，我们就揭开它的神秘面纱。 三为网页设置
14、背景 1单击“格式”“背景” ，打开“网页属性”对话框。 2选择“背景”标签，选中“背景图片” ，单击“浏览” ，选择背景 图片，单击“确定”按钮。 四为网页配背景音乐 1在“网页属性”对话框中选择“常规”标签。 2单击“浏览”按钮，弹出“背景音乐”对话框，选择背景音乐文 件，单击“确定”按钮。 五保存网页 1把“背景.gif”更名为“bj.gif” ，保存在 images 文件夹内。 2把“背景音乐.mid”更名为“bjyy.mid” ，保存在站点根目录下。 六思考与练习 为自己的网页设置背景图片和 音乐。 第七课第七课 网页越做越漂亮网页越做越漂亮 教学目的与要求： 1.了解表格的一般操作；
