1、书设计 第一课教学一导入新课目前,可以制作网站的工具软件非常多,我们选用FrontPage作为网站制作的工具软件。二新授1认识FrontPage窗口2、制作简单的网页认识了FrontPage窗口后,就可以利用FrontPage制作网页了。教师演示在FrontPage的编辑区制作一个简单网页的方法。3、保存网页师质疑:网页做好后,按照我们的老习惯,应该把这个网页怎么处理呢?生:保存师:对,同学们说的好极了。但大家知道吗?保存网页的方法和我们以前学过的保存方法却有点不同,大家想知道有什么不同吗?师演示保存网页的方法。4、浏览网页网页保存了吗?保存后的网页该怎么打开呢?生尝试打开网页教师演示打开网页
2、的两种方法:(1)在浏览器中预览网页。单击“文件”“在浏览器中预览”,打开“在浏览器中预览”对话框,单击预览。(2)在FrontPage窗口中单击“预览”按钮,进行预览。(3)观察使用两种预览方法所显示的预览效果。5思考与练习建立一个新站点,并输入文字,保存后预览。6、课堂小结本节课所学知识点:(1)认识了制作网页的软件: FrontPage(2)学习了用FrontPage制作一个简单的网页。(3)学习了保存网页和浏览网页的方法课后反思审阅人年 月 日 教 学 设 计第二课 规划网站与创建站点1了解网站建设规划流程;2收集整理资料。3、掌握打开站点、创建站点的方法;4、掌握在站点中增加文件夹和
3、创建一个简单网页。5、学会在网页中插入图片和插入水平线。1网站的规划。2、创建站点。3、在站点中创建网页 规划网站与创建站点 1、设计网站结构2、收集加工素材3、创建站点4、在站点中创建一个简单的网页一引入新课我们的校园生活丰富多彩,班级活动活泼有趣,怎样让远方的伙伴了解我们的校园生活呢?为了更好地展示我们班级的风采,让更多的人认识和欣赏我们,我们可以制作班级网站,发布到因特网上,让更多的人了解我们班。二、新授要建立网站,首先要确定主题。主题确定后,为了使网站有一个整体的风格和特色,还需要设计网站的结构。大屏幕出示一个简单的网站的结构让学生了解网站的结构。网站是由多个网页链接组成的,在开始制作
4、网站前最好做好整体规划。(1)确定网站主题。网站的主题决定制作网站的风格,决定网站所包含的网页信息。(2)搜集素材。通过多种渠道搜集网站所需要的各种素材。(3)筛选、整理素材。对搜集来的素材进行必要的挑选、修改、编排、整理,筛选出各类网页所需要的素材。有时还需要根据实际情况自己动手完成一些必要的文字、图片等素材。(4)做好网站建设规划。根据我们筛选、整理的素材,按照不同的分类,规划整理到不同的网页中。同时要注意使页面布局主题突出、美观大方、有自己的特色。(5)选择网页制作软件,开始制作。(1)打开FrontPage,单击“文件”“新建”“站点”,打开“新建”对话框。(2)选择“空站点”,键入站
5、点的保存位置和名称,单击“确定”按钮。在FrontPage中创建站点后,会自动在站点文件夹内创建两个文件夹,用于制作网页时存放各类资源。4、在自建站点中制作一个简单的网页站点建好后,就可以在站点中制作网页了。制作网页的一般步骤:(1)如果你建好的站点已经关闭,需要先打开站点:单击文件打开站点选择建好的站点名打开。(2)在窗口的编辑区中输入网页的标题和正文内容。设置文章的字体、字号、格式等。设置方法同WORD。(3)如要在网页中插入图片,插入的方法和WORD相同(4)为了美观和网页中的不同内容界限更加分明,也可以在网页中插入水平线。方法如下:单击插入菜单水平线。双击插入的水平线,可以设置水平线的
6、宽度、高度、颜色等属性。(5)保存网页。5、巩固练习:(1)在自己的文件夹里建立一个名为“我的网站”的站点。(2)在站点里创建一个名为“sound”和“text”文件夹(3)打开“我的网站”,创建一个介绍四完小校园的网页 网页内容为:标题:四完小简介 正文内容和要插入的图片都保存在E盘陈老师文件夹里。(4)在标题的上文插入一条水平线。颜色为绿色,宽度和高度自己设置(5)做完后保存网页。本课所学知识点:4、在站点中创建一个简单的第四课 修饰网站主页21、掌握表格背景的设置方法。2、学会在主页中制作悬停按钮。3、学会在主页中制作欢迎字幕。4、让学生通过一步步修饰网站主页,体验成就感,从而培养学生对
7、信息技术的兴趣。设置表格背景、制作悬停按钮和欢迎字幕 第四课一、导入新课在网页中插入表格、输入文字、插入图片,看起来这个主页已经是整齐划一了,但同学们有没有觉得还有什么不满的地方吗?观察1、设置表格背景让我们试着给主页中的表格加一个背景,看看会怎么样?教师演示“设置表格背景”的操作方法:第一步:打开“自己的站点”第二步:打开“自己的站点”中的“index.htm”主页文件。第三步:在表格中单击右键。选择“表格属性”,打开“表格属性”对话框。第四步:选择“使用背景图片”选项,然后单击“浏览”按钮,打开“选择背景图片”对话框,找到要用来设置背景的图片后双击,再单击“确定”按钮即可。设置表格背景的时
8、候,要注意插入的图片和表格中的文字搭配,否则会让整个表格显得凌乱不堪,那要就适得其反了。任务:请给你的主页中的表格设置一个漂亮的背景。学生完成任务后保存二、制作悬停按钮下面让我们来美化“伊金霍洛旗第四小学”主页中的每一个栏目按钮。师演示操作方法:选择主页中的第一个栏目“校园风景”选择“插入”WEB组件交互式按钮完成设置按钮文字、颜色、背景等。设置好后确定即可。请你把主页中的所有栏目按钮都做成自己喜欢的悬停按钮。学生完成任务三、制作滚动字幕我们经常会在网站上看到一行或多行滚动的文字,就和电影中移动的字幕一样,非常有趣。今天,我们学习制作滚动字幕的方法。(在制作滚动字幕之前,要确定字幕的位置。我们
9、可以将主题“伊金霍洛旗第四小学”单元格拆分为两行,下面一行用于放置字幕。)拆分单元格的方法:将光标定位在要拆分的单元格中,然后1.单击“表格”“拆分单元格”,弹出“拆分单元格”对话框;2.设置拆分的方式,如:拆分成行;3.设置拆分的行数,如:2行;4.单击“确定”按钮。 将光标定位在要插入字幕的单元格中,1. 单击“插入”“组件”“字幕”,弹出“字幕属性”对话框;2. 输入文字;3. 单击“确定”按钮。在一个内容较复杂的网页中,要较好地定位内容,需要对表格进行分割、行列的插入或删除、单元格的合并、拆分等。这些操作都可以在“表格”菜单中进行,操作方法也很相似。学生把“欢迎来到伊金霍洛旗第四小学”
10、做成滚动字幕。四、课堂小结:第五课 制作校园风景栏目1、学会制作“校园风景” 网页。2、学会在“校园风景”网页里插入表格和缩略图。3、学会修改网页的标题在网页中插入表格和在表格里插入缩略图 第五课一、导入:完成网站的主页后,就可以按照网站的结构图制作与各个栏目相关的网页了。本课我们首先来制作“伊金霍洛旗第四小学”网站的“校园风景”栏目。1、制作“校园风景”网页“校园风景”栏目是用来展示校园各处风景的图片的,为了让访问网站的人能够方便的找到自己感兴趣的图片,可以先把收集到的图片分类,如分成“教学楼”、“孺子楼”、“书山阁”等,然后把这些图片插入不同的网页。当然,首先要建立一个网页来列出校园各处风
11、景的名称。任务一:新建一个网页,并访照如下表格布局来安排网页内容,并把“校园风景”做成艺术字。校园风景此处插入学校全景图教学楼孺子楼书山阁士林轩毅坚厅黍香楼教师演示操作方法,重点指导学生对插入的图片如何设置才能使网页变得美观。2、制作“教学楼”网页由于我们要把“教学楼”图片按照正面、背面、侧面三个角度展示给访问者,所以为了使图片整齐、有序,同样采用表格布局,把图片及说明文字放在表格的不同单元格中。但由于图片文件都比较大,所以我们在插入图片时采用自动缩略图方式,把图片缩成小图,浏览时单击小图,就可看到大图。教师演示操作方法:新建一个网页,插入一个3行3列的表格,合并第1行的单元格。在第1行中插入
12、艺术字“教学楼”,并设置为居中对齐。把插入点移到第2行第1列的单元格中,然后单击常用工具栏中的“来自文件”按钮,插入事先准备好的教学楼正面图片。单击“工具”菜单中的“网页选项”命令,出现“网页选项”对话框时,打开“自动缩略图”选项卡,然后单击“确定”按钮。第五步:选定插入的图片,单击图片工具栏中的“自动缩略图”按钮,选定的图片就会缩小,变成缩略图。第六步:适当调整单元格的大小,再在图片下方对应的单元格中输入图片的说明文字并设置适当的文字格式。第七步:用以上方法,在其他单元格中插入图片和说明文字,并为图片设置缩略图技术。第八步:选定第2行单元格,再单击“表格”菜单中的“平均分配列宽”命令,使表格中的每一列等宽。第九步:保存做好的网页并在浏览器里浏览网页。学生用同样的方法
copyright@ 2008-2022 冰豆网网站版权所有
经营许可证编号:鄂ICP备2022015515号-1