第1单元 彩虹花园

第1单元彩虹花园一、单元概述本单元围绕主题网站“彩虹花园”，初步介绍了利用网页制作软件——FrontPage进行网站制作的过程。

首先对网站进行规划、设计，然后创建站点，并制作首页。

通过首页的制作，学习了使用表格规划网页的版面，在网页中插入文字、图片、设置网页背景、设置背景音乐等，还用悬停按钮制作了“导航”栏和字幕。

通过第一单元的学习，使我们对FrontPage有了初步的认识。

二、学习目标1．理解网站、网页、首页（主页）、导航、超级链接等术语。

2．了解创建网站的过程，会对自己的网站进行规划、设计，会用表格规划网页的版面。

3．掌握美化网页的一些操作，如插入文字、图片，会设置网页的背景，为网页添加背景音乐。

4．会插入字幕和悬停按钮。

5．通过自主学习，培养学生的合作意识与信息加工的能力。

三、重点难点教学重点1．学会对自己的站点进行规划、设计，用FrontPage创建站点，用表格规划网页版面。

2．掌握美化网页的一些操作，如插入文字、图片，会设置网页的背景，为网页添加背景音乐，会插入字幕和悬停按钮。

教学难点1．对站点进行规划、设计，用表格规划网页版面。

2．插入字幕和悬停按钮。

四、学时安排本单元共4课，总计4学时，每课占用1学时。

第1课登堂入室（一）本课教学目标1．理解网站、网页、首页（主页）、导航、超级链接等术语。

2．掌握FrontPage的启动/退出，了解FrontPage窗口的组成。

3．掌握在FrontPage 中插入文字和图片的方法，并会保存网页。

4．了解FrontPage的三种网页模式，会预览制作好的网页。

（二）教学设计与教学建议1．课堂引入分析在学习本册教材前，学生已经能够熟练上网，对网络世界有着强烈的好奇心和浓厚的兴趣，对于学生来说，网络上那些精彩的网页具有神秘的色彩，学生想不到有一天自己也可以制作网页。

针对这种情况，在课堂的引入部分，教师可以这样设计：首先出示几个用FrontPage软件制作的网页，请学生欣赏，让学生讨论这是怎样制作出来的。

然后用FrontPage软件打开其中的一个网页，让学生观察窗口，并说一说这个窗口与学习过的哪个软件相似。

由于FrontPage 与Word软件在界面的风格上和功能上有很多相似之处，因此学生很快能在这个窗口中找到熟悉的面孔。

此时，教师可以告诉学生，这个软件叫FrontPage ，与学习过的Word软件同属于Office软件家族的成员，但它的主要功能是制作网页。

由于学生在Word软件中对插入文字、图片进行编辑排版的操作非常熟练，因此可以采用自主探究的学习方式让学生认识FrontPage。

教师可以给出制作网页的素材，让学生尝试在FrontPage 中输入文字、插入图片。

让学生在学习这个软件的初始，自己去探索这两个软件的相同与不同。

2．重点内容分析在学习本课前，学生已经掌握Word软件的使用，而本节课是初步认识FrontPage软件，因此本节课可以把重点放在让学生通过已掌握的知识来初步分析FrontPage与Word 的相同与不同，这样可以减少学生对学习新软件的陌生感，尽快熟悉新软件，降低学习的难度，同时也培养了学生自主学习的能力。

相同：常用工具栏与格式工具栏中的大部分工具都一样，编辑文字和图片的方法一样。

不同：与Word软件相比，FrontPage窗口多了视图栏；在编辑区左下角有三种网页模式；保存网页文件时，图片是采用嵌入式保存的，即同一个网页中的图片和文字被分开保存。

当然，Word与FrontPage的不同还有很多，对比两种软件的不同可以贯穿在整册教材的学习中。

用对比的方法学习，会让学生知道，很多软件的一些操作都具有相同的地方，掌握这种学习方法，会提高学生自主学习的能力，对学习新知识起到事半功倍的效果。

3．归纳提高分析本节课涉及到的知识可以归纳为以下几点：（1）理解网站、网页、首页（主页）、导航、超级链接等术语。

（2）FrontPage是一种制作网页的软件，由于它与Word同属于Office家族的成员，与Word软件在许多地方相似，如编辑图文等，以及它具有所见既所得的特点，因此很容易被掌握。

（3）掌握FrontPage的启动/退出，了解FrontPage窗口的组成。

（4）FrontPage有三种不同的网页模式：普通、预览和HTML。

在普通模式下可以编辑网页，在预览模式下可以预览网页效果，在HTML模式下可以看到网页的HTML代码。

（5）掌握在FrontPage中插入文字和图片的操作，并会保存网页。

需要注意的是，网站中的文件夹和网页的名称通常使用英文、汉语拼音来命名。

（三）教学补充1．到下面几个网站去欣赏一些精彩的网页。

请你观察网站的首页，看看首页上一般都包含哪些信息。

东方少年雏鹰网e童网毛毛先锋网儿童综合网2．在Word软件中，利用“文件”菜单中的“另存为Web页…”命令也可以把文档直接保存成网页。

可以让学生制作一个图文并茂的Word文档，并尝试着把它保存成网页，并在“IE”浏览器中浏览这个网页。

3．在FrontPage中插入“来自文件”的图片时，与Word有些不同：执行“插入”→“图片” →“来自文件…”命令，弹出“图片”对话框，在这个对话框中提供了四种获取图片的方式，如下图所示。

第2课蓝图设计（一）本课教学目标1．根据自己站点的主题，会对自己的站点进行规划、设计。

2．会通过多种途径收集资料。

（二）教学设计与教学建议1．课堂引入分析请同学们欣赏几个网站的首页，并以学习小组为单位讨论首页一般包含哪些信息。

由此引出要规划个人网站，需要从哪几方面入手。

规划个人网站，主要包括网站名称、网站栏目及主要内容，还要考虑应准备哪些素材，收集的素材一定要围绕网站的主题。

由于制作一个网站工程比较大，可以采用小组分工合作的方式进行。

组内的同学共同商讨确定网站名称、结构，然后分工收集相关资料，并进行分类汇总。

通过这种方式不但可以节省时间，还可以培养学生合作的能力。

2．重点内容分析本节课的重点可以分为两点：（1）规划网站。

对于学生来说，建设一个网站，是一件比较浩大的工程，要完成这个任务，学生会感觉到无从入手，不知道怎么做，因此本节课的重点之一是规划网站。

通过规划网站，让学生了解制作网站的过程。

规划网站的过程是：确定网站名称——规划网站的结构——收集素材。

网站的名称相当于网站的主题，网站中的所有内容都要围绕这个主题来设计，所以确定了名称，也就确定了网站的大方向。

网站的结构指的是网站中的网页存在的层次关系。

一个网站是由很多网页组成的，网页之间存在着层次关系：主页是最顶层，主页的下一层是网站的各个栏目，各栏目又能细分，构成第三层，甚至更多层，如下图所示。

在制作网站前画出如上图所示的网站结构图，不但可以帮助我们规划网站结构，使网站层次分明、条理清楚，还可以确定各个网页的内容，方便大家思考各网页之间的链接方式。

（2）收集素材并进行分类保存。

规划好了网站的结构，也就确定各个网页的内容，此时可以根据网站的结构收集相关的素材。

收集素材的方法有多种，可以利用素材光盘、数码相机拍摄、网上下载等方法获取文字、图片、视频、声音、动画等资料。

由于需要收集的资料很多，为了便于管理这些资料，我们可以把它进行分类整理，放在不同的文件夹中。

分类的方法有两种：可以根据网站的栏目创建文件夹，把与栏目相关的素材存放在这个文件夹中，如针对上图中的“卡通世界”、“心语日记”、“小小戏迷”、“闪客一族”、“作文乐园”、“动感地带”等创建相应的文件夹；还可以根据素材的类型创建文件夹，如“文字”、“图片”、“视频”、“声音”、“动画”等。

经过以上这些准备工作，就可以创建网站了。

3．归纳提高分析本节课涉及到的知识可以归纳为以下几点：（1）在创建网站前，一定要对网站的内容、结构等进行规划，并画出网站结构图，使网站层次分明、条理清楚，并确定各个网页的内容。

（2）根据网站的结构收集相关的素材，收集素材的途径有多种，可以利用素材光盘、数码相机拍摄、网上下载等方法获取文字、图片、视频、声音、动画等资料。

（3）为了便于管理收集到的素材，我们可以把它进行分类整理，放在不同的文件夹中。

分类的方法有两种，一是根据网站的栏目创建文件夹，二是根据素材的类型创建文件夹。

（三）教学补充1．看看在第1课教学补充提供的网站中都包含哪些信息，并试着列出这些网站的结构，最多有几层？2．请规划设计自己的网站，并画出网站结构图。

3．根据网站结构收集相关的资料，并建立文件夹，将收集到的资料进行分类保存。

4．收集到的资料可以根据需要进行适当的修改。

如获取的文字资料，可以在Word软件中进行编辑修改；获取的图片资料可以用Windows操作系统自带的画图软件进行修改，也可以用Photoshop等专业绘图软件进行修改、加工；获取的声音资料，可以用Windows操作系统自带的录音机进行修改，或用超级音频解霸等专业处理声音的软件进行修改；获取的视频资料可以用超级解霸、绘声绘影等软件进行加工处理。

第3课花园之匙（一）本课教学目标1．理解网站站点的概念，掌握创建站点的操作。

2．会用表格规划网页的版面。

3．会在表格中插入文字和图片，会设置单元格中的文字格式，会设置文字和图片在单元格中的对齐方式。

4．会保存网页，并将网页中的图片保存到images文件夹中。

5．培养学生自学与合作学习的能力。

（二）教学设计与教学建议1．课堂引入分析创建站点对于学生来说并不是难点，如何规划网页的版面，对于学生来说难度更大。

因此在课堂引入部分，可以这样设计：首先教师可以准备两个内容一样的网页，一个是没有用表格规划版面的，一个是用表格规划版面的，让学生观察预览效果，比较哪一个更好其次，将制作这个网页的素材提供给学生，让学生自己尝试制作这样一个网页。

学生在制作过程中会发现图文并不能按照自己的意愿随心所欲地摆在网页上，使得网页看起来很糟糕。

随之会产生疑问：那个版面漂亮的网页是怎么做出来的？第三，教师再次出示利用表格规划版面的网页，动态出现表格线，让学生观察，学生就会看出版面是由表格规划的。

而表格是学生在Word软件中就已经学习过的，此时再让学生尝试在FrontPage中插入表格，并在单元格中插入文字和图片。

由于学生在Word软件中学习过表格的操作，对插入表格、设置单元格的格式操作比较熟悉，因此这部分可以采用让学生自主探究的方式学习。

2．重点内容分析本节课的重点可以归纳为：（1）创建网站站点在FrontPage中提供了8种站点类型，我们可以根据需要选择不同的类型。

需要注意的是，在“指定新站点的位置”框中，需要输入站点的位置和名称，如输入“d:\web”，“d:”表示位置在“D盘”上，“web”表示站点的名称，位置和名称之间用“\”隔开，不要错输入成“/”。

（2）用表格规划网页的版面创建站点对于学生来说是重点，但不是难点。