活动制作网站的主页.docx
《活动制作网站的主页.docx》由会员分享，可在线阅读，更多相关《活动制作网站的主页.docx（17页珍藏版）》请在冰豆网上搜索。
活动制作网站的主页
活动2：
制作的主页
教学目标：
1、知识与技能
1、熟悉网页制作软件的窗口界面和常用操作。
2、掌握用表格编排页面的方法。
3、提高文字和图像混合编排的能力。
2、过程与方法：
认识并熟悉网页编辑软件FrontPage，掌握利用软件编辑网页的方法。
三：
情感态度与价值观：
学习利用软件编辑网页的方法，增强团结协作的意识与能力。
教学重点：
FrontPage使用方法。
教学难点：
设计、编辑网页的方法。
教学时间：
4课时
第一课时
教学容：
认识FrontPage软件的操作界面，创建，开始制作主页
教学过程：
教学环节
教师活动预设
学生活动预设
应用软件窗口
设计意图
1、复习
建立的基本过程？
巩固
2、导语
最重要的就是网页，多个网页通过关系构成一个整体。
主页相当于一个的门，通过它可以了解的功能和基本结构。
3、讲新
一、FrontPage软件简介
FrontPage功能比较丰富、简单易用。
右图是FrontPage软件的窗口，大家打开软件后观察它的结构。
下方有四个视图模式按钮，可以改变视图模式。
2、创建
要在网络中建立一个，首先要在计算机中创建一个，然后在这个中添加主页和其他层次的页面。
下面我们来建立一个。
在E盘建立一个名为“心灵之约”的。
1、执行“文件-新建”命令，在任务窗格中选择“由一个网页组成的”
2、把的位置改为E盘。
如图所示。
3、在E盘的盘符后面输入“心灵之约”，然后单击确定按钮。
3、制作主页
主页是整个的窗口。
制作主页一定要达到整齐美观、活泼鲜明。
（1）、用表格安排页面布局
使用表格可以把整个页面分成很多区域。
编辑时，首先把文字、图像等素材定位到指定的单元格中，然后修饰美化单元格。
在主页index.htm中插入表格
1、双击文件名index.htm，显示它的页面编辑区。
2、执行“表格-插入-表格”命令，设置好参数，插入一个一行一列、宽度为870像素、不显示边框、居中对齐的表格。
3、在页面中敲一下回车键后，插入一个一行六列的表格。
4、继续插入一个2行2列、不显示边框的表格，然后合并其中的第2行单元格。
5、把第3个表格的第1行第2列单元格拆分成3行。
6、适当调整表格高度，最后保存网页。
（2）、插入标题
1、把插入点移动到页面中的第1个表格中，然后执行“插入-图片-来自文件”命令。
2、将素材库中“动画标题”插入进去。
3、适当调整标题的大小，然后把图像保存到中的images文件夹里。
观察软件
同步操作
小组讨论交流
同步操作
合作交流
实际上，这个就是一个文件夹。
完成上述操作后，系统在“心灵之约”中生成了“private”和“images”两个文件夹，并自动生成了网页文件index.htm。
“private”文件夹用来存放不想供浏览者访问的文件；“images”文件夹用来存放图像文件。
4、课堂补充练习：
完成课堂所学容。
5、小结：
网页的布局，表格的插入。
6、课后反思
成功：
不足：
第二课时
教学容：
主页制作
教学过程：
教学环节
教师活动预设
学生活动预设
应用软件窗口
设计意图
1、复习
如何调整网页布局？
小组可以讨论
巩固
2、导语
网页上除了标题以外，还需要放置更多的文字，给浏览者提供丰富的信息。
3、讲新
（三）、输入文字。
1、在第2个表格的6个单元格里分别输入各个栏目标题。
2、设定文字的格式。
3、在第2个表格的第1个单元格中逐行输入下面的文字，然后设置文字格式。
4、将插入点移动到文字当中，然后执行下列操作，设置段落格式。
执行“格式-段落”操作，然后再设置。
这部分学生学习过，可独立操作。
5、在页面相应的位置输入有图红色文字容，并设置适当的格式。
6、单机预览视图按钮，在窗口中可以预览网页的效果。
（4）、配插图
网页中，除了文字，还需要配上插图，使网页达到图文并茂的效果。
1、在“心灵之约”的主页中插入合适的图像。
插入图片并调节图片的大小，学生没有学过这一容，需加强训练。
2、保存网页，把图像保存到中的images文件夹里。
4、完善主页
在网页中输入文字、插入图像后，为了使网页更加直观和美观，往往还需要进一步修饰网页。
（1）、修改网页标题。
尝试修改标题。
1、右击主页任意位置，在右键菜单中单击“网页属性”命令。
2、在对话框中输入网页额标题，再单击确定按钮。
3、保存文件后，在浏览器窗口中预览网页，观察所显示的标题。
（2）、修改网页背景
默认情况下，我们看到的网页背景是白色的。
把一幅图像设定为“心灵之约”主页的背景。
1、右击页面，单击快捷菜单中的“网页属性”命令。
2、按需要操作，把一幅图像设成网页的背景。
3、保存网页，并把背景图像文件保存到站点中，然后浏览网页。
（3）、修改单元格样式
1、选定栏目标题所在的表格并右击，然后执行相应的操作
2、修改边框的颜色，并适当变粗。
3、调整单元格的高度，适当修改单元格中文字的颜色。
4、修改单元格中文字的对齐方式。
5、参考右图，设置其它单元格的边框和背景。
（4）、设置单元格的边距
默认情况下，单元格中的文字会紧贴着单元格的边框，影响美观，如右图。
1、选定单元格并右击，然后设置文字与边框的距离。
2、保存后浏览网页。
这部分可独立完成
文字输入这一容进尽量完成
讨论交流小组互助
观察标题
同步操作
跟踪操作
中华民族的传统美德，源远流长，照亮人心。
美德，是至善、至纯、至高人性的结晶，它源自生活又融入生活，只要我们用心去感悟，就会发现它无处不在。
我们要让心灵闪耀出本性的光芒，要付出爱的行动，爱亲人、爱朋友，爱家庭、爱集体、爱国家，热爱并善待一切美好的事物。
让我们从这里开始，迈开爱的步伐，让心灵永远保持美丽的本色！
爱读书，读好书
今天推荐的好书是《中华传统美德格言》。
该书由人民教育出版，精选格言近300条，涵盖爱国、修身、立志、进德、处世等容，是启迪人生的良师益友。
“配插图”这一容，在往年都是七年级上学期的课程，从去年教材变动后，这一容移动到了小学，而我们本地小学没有开办《信息技术》这一课程。
主页右击格式背景图片（打√），然后单击“浏览”选择素材库中的“主页-背景图”后，单击确定按钮即可。
这一步，大家在老师的诵读下，按要求直接操作即可。
选择“单元格属性”“背景”项（选择一种颜色）“样式”（最下面）“格式”（最下面）修改后确定即可。
选定单元格并右击单元格属性
样式（最下面）边框，样式里选择“无”，衬距中的上下左右都选择8，然后单击确定即可。
4、课堂补充练习：
完成上述操作。
5、小结：
实际操作时，可以根据实际情况进行修改。
6、课后反思
成功：
不足：
第三课时
教学容：
1、制作滚动字幕
2、插入水平线
教学过程：
教学环节
教师活动预设
学生活动预设
应用软件窗口
设计意图
1、复习
打开前面自己制作的，看看还有哪些方面需要进一步加工处理的？
观察交流
巩固
2、导语
很多里我们都能看到滚动的字幕，它是怎么实现的呢？
滚动字幕中的文字会从某个方向顺序移动，通过动态的方式呈现。
网页中往往用滚动字幕来展示一些通知、广告、标语等，而且要求字幕容简洁、篇幅短小。
3、讲新
一、制作滚动字幕
在“心灵之约”主页中添加一行滚动字幕。
1、单击第1个表格下方的空行，执行“插入—Web组件”命令。
2、双击“字幕”选项，然后在字幕属性对话框中输入字幕容，设置参数。
3、预览网页，可以看到文字从左逐渐向右移动。
2、插入水平线
水平线可以用来划分网页中的不同区域。
如果网页中容比较多，需要划分界线以便分类时，使用水平线是一种比较简便的方法。
在主页信息等文字的上方插入一条水平线。
1、把指针移动行首并单击，执行“插入—水平线”命令。
2、双击插入的水平线，在“水平线属性”对话框中设置它的高度和颜色。
最后单击确定按钮，设置完成。
小组互相查看制作效果
4、课堂补充练习：
补充没有完成的项目；将水平线的线性改成其它的类型。
5、小结：
滚动字幕和水平线的制作方法。
6、课后反思
成功：
不足：
第四课时
教学容：
1、创建电子信箱地址的超
2、创建超
教学过程：
教学环节
教师活动预设
学生活动预设
应用软件窗口
设计意图
1、复习
如何制作滚动字幕？
指名操作大屏幕。
巩固
2、导语
访问者与的联系方式，最常见的就是电子联系方式。
而给出的提示文字可以是电子信箱地址或者类似“欢迎来信”、“与我们联系”等等。
3、讲新
一、在主页中创建电子信箱地址的超。
1、选定要插入电子信箱地址超的文字并右击。
2、按右图操作，建立所选文字与电子信箱地址的超。
建立超后，当鼠标指针指向那里时，会出现表示连接的小手标志。
2、创建超
因特网上有很多与我们制作的网页相关的，如果在网页中插入这些的超，可以使浏览者很方便地浏览相关的，扩大视野。
插入方法：
1、在主页中插入友情栏目的名称.
跟踪操作
小组合作交流
2、选定一个栏目，创建与它相应的的超。
如右图，我们的网址是人民教育的思想品德网页。
一旦成功，被连接的文字颜色会发生变化，鼠标指向它时，会出现“小手”图标。
自主完成“中华美德网”的超。
3、超的删除
选中被插入超的文字，如右图所示，然后点击“超属性”，在出现的对话框中执行“删除超”即可。
组成员合作，完成其它超
4、课堂补充练习：
阅读教材第85也容。
5、小结：
如何创建超。
6、课后反思：
成功：
不足：
升级会员 