第十二课《制作网站首页和框架》教案
文档属性
| 名称 | 第十二课《制作网站首页和框架》教案 |  | |
| 格式 | zip | ||
| 文件大小 | 673.5KB | ||
| 资源类型 | 教案 | ||
| 版本资源 | 川教版 | ||
| 科目 | 信息技术（信息科技） | ||
| 更新时间 | 2018-11-13 16:09:00 | ||
图片预览
文档简介
第十二课《制作网站首页和框架》
【课时安排】1课时??
【教学目标】：
1、知识与技能：理解个人网站首页的基本构成；了解制作网页的软件，掌握FrontPage2000网页文本编辑和图片插入方法，以及网页背景的设置方法。??
2、过程与方法：先让学生观摩一些漂亮、有个性特色的首页，然后任务驱动，让学生参考教材，互助学习，自主学会知识与技能，实现首页的制作。??
3、情感、态度、价值观：培养学生的审美能力和创造能力，在小组协作学习中，培养学生的团队精神。??
【教学重点】：??
1、理解个人网站的基本组成和网页框架布局；??
2、学习FrontPage2000制作网页的一般方法（重点是文本格式、图片、背景）；??
【教学难点】：??
1、首页的艺术性与个性布局，色彩的搭配；??
2、图片的插入和背景的设置。??
【教学准备】：??
大屏幕投影、多媒体网络教室、相关图片及文档素材??
【教学过程】：??
一、创设情景，引入课题：??
师：老师今天给大家带来了一个礼物，它是一个漂亮的网站，它就是“刘翔个人官方网站”，请同学们欣赏。
刘翔全球个人官方网站（http://liuxiang.sports.cn/）?
上节课我们已经规划了自己的网站，并且搜集了素材，这节课咱们来动手制作网站的首页。你知道有哪些软件可以用来制作网页吗？?教师引入：其实好多字处理软件都可以设计网页，如word中，利用“另存为web页”就可以将文档保存为网页，有些图像处理软件如PhotoShop也可以制作网页，windows“记事本”也可以制作网页……不过FrontPage和Dreamweaver却是最方便的网页制作软件，因为它们不仅可以制作网页，而且能方便地设计和管理网站，很适合入门学习。??
我们先学习用FrontPage2000制作网站的首页。??
二、新课教学??
任务一：认识FrontPage2000??
1、学生探究：用以前学过的打开软件的方法，在“程序”中找到并打开“FrontPage”。??
2、师引入：FrontPage与Word的操作非常相似，请同学们用鼠标试探FrontPage网页编辑窗口界面上各部分的名称，了解各按钮的作用，小组内进行交流，说说与Word窗口有哪些异同。??
3、抽2~3个小组代表交流讨论结果，教师适时展示FrontPage界面并辅助说明。重点指出新建、保存、插入、预览等菜单或按钮的位置和功能。??
4、学生练习：打开一个已经做好的网页，试探一下三种编辑视图模式按钮的效果。（教师事先下载一个简单的网站首页发送给学生，让学生自主操作）??
任务二：制作网站首页??
1、师引入：在我们动手制作网页前，我们应当考虑好网页的布局和内容，个人网页的布局就像办小报一样，没有固定的格式，完全可以由我们自己大胆地进行设计。（教师利用广播展示几个风格不同的个人主页，让学生注意观察主页的内容版块布局）??
抽生回答：你觉得网站首页应当包含哪些图、文内容？你能形象地描述以上网站的布局样式吗？
根据学生的回答，适时板书“网站首页的一般内容：网站标题、网站图标、导航栏、水平线、网站主题介绍、作者及电子邮箱……”?
常见的网页布局有：“国”字型；“匡”字型；“三”字型；“川”字型；封面型；Flash动画型；标题与文本型；框架型……你能指出老师展示的这些网站属于哪种布局吗？你准备选择哪一种布局方式来设计自己的首页？
2、练一练：新建一个网页，根据上节课自己拟订的网站设计方案，在空白位置输入网站名称、栏目名称、主题介绍、作者姓名等内容。?
3、仿照word的操作，利用格式栏中的工具按钮，设置改变文字效果，师鼓励学生在设计时要展示出自己的个性。?
小组内交流：我是怎样使文字格式更美的。?
4、保存主页文件?教师指导学生保存时，首页应保存为index.htm或default.htm，保存的位置是上节课所规划的网站文件夹。????
任务三：美化网页??
师：（通过广播展示一些学校或公司网站、以及学生网站4幅截图）请同学们观察这四个网站的首页，色彩和风格上有什么不同？（抽生回答）?要使我们的首页更美，我们可以用色彩或图案来美化它，你还希望你的网页背景是什么色彩或图案？你觉得可以插入什么图片来突出网站的主题呢？?
1、试一试：改变网页的背景和插入图片?学生阅读课本89页，独立试探完成背景颜色效果的设置。?投影展示：“格式——背景”的关键步骤画面??
设置网页背景??
进一步尝试和交流：除了使用色彩作为背景，还可以怎样美化背景？能用图片作为背景吗？试试看，怎样才能办到？?Frontpage能像word一样插入图片吗？试试看。?
2、组织学生进行交流：怎样设置背景效果？怎样插入图片和调整大小？?
四、课外拓展??
????上互联网，欣赏http://www.nbxiaoshi.net/xsgrzy/?网站的学生作品。选择一种你最欣赏的主页布局样式，自找素材制作一个介绍“中国年”的主题网站首页。??
五、小结：??
通过本节课的学习，你的网站首页做好了吗？向大家介绍你的首页中都做了哪些内容？你对自己作品的哪一方面最满意呢？小组互评网站首页。
【课时安排】1课时??
【教学目标】：
1、知识与技能：理解个人网站首页的基本构成；了解制作网页的软件，掌握FrontPage2000网页文本编辑和图片插入方法，以及网页背景的设置方法。??
2、过程与方法：先让学生观摩一些漂亮、有个性特色的首页，然后任务驱动，让学生参考教材，互助学习，自主学会知识与技能，实现首页的制作。??
3、情感、态度、价值观：培养学生的审美能力和创造能力，在小组协作学习中，培养学生的团队精神。??
【教学重点】：??
1、理解个人网站的基本组成和网页框架布局；??
2、学习FrontPage2000制作网页的一般方法（重点是文本格式、图片、背景）；??
【教学难点】：??
1、首页的艺术性与个性布局，色彩的搭配；??
2、图片的插入和背景的设置。??
【教学准备】：??
大屏幕投影、多媒体网络教室、相关图片及文档素材??
【教学过程】：??
一、创设情景，引入课题：??
师：老师今天给大家带来了一个礼物，它是一个漂亮的网站，它就是“刘翔个人官方网站”，请同学们欣赏。
刘翔全球个人官方网站（http://liuxiang.sports.cn/）?
上节课我们已经规划了自己的网站，并且搜集了素材，这节课咱们来动手制作网站的首页。你知道有哪些软件可以用来制作网页吗？?教师引入：其实好多字处理软件都可以设计网页，如word中，利用“另存为web页”就可以将文档保存为网页，有些图像处理软件如PhotoShop也可以制作网页，windows“记事本”也可以制作网页……不过FrontPage和Dreamweaver却是最方便的网页制作软件，因为它们不仅可以制作网页，而且能方便地设计和管理网站，很适合入门学习。??
我们先学习用FrontPage2000制作网站的首页。??
二、新课教学??
任务一：认识FrontPage2000??
1、学生探究：用以前学过的打开软件的方法，在“程序”中找到并打开“FrontPage”。??
2、师引入：FrontPage与Word的操作非常相似，请同学们用鼠标试探FrontPage网页编辑窗口界面上各部分的名称，了解各按钮的作用，小组内进行交流，说说与Word窗口有哪些异同。??
3、抽2~3个小组代表交流讨论结果，教师适时展示FrontPage界面并辅助说明。重点指出新建、保存、插入、预览等菜单或按钮的位置和功能。??
4、学生练习：打开一个已经做好的网页，试探一下三种编辑视图模式按钮的效果。（教师事先下载一个简单的网站首页发送给学生，让学生自主操作）??
任务二：制作网站首页??
1、师引入：在我们动手制作网页前，我们应当考虑好网页的布局和内容，个人网页的布局就像办小报一样，没有固定的格式，完全可以由我们自己大胆地进行设计。（教师利用广播展示几个风格不同的个人主页，让学生注意观察主页的内容版块布局）??
抽生回答：你觉得网站首页应当包含哪些图、文内容？你能形象地描述以上网站的布局样式吗？
根据学生的回答，适时板书“网站首页的一般内容：网站标题、网站图标、导航栏、水平线、网站主题介绍、作者及电子邮箱……”?
常见的网页布局有：“国”字型；“匡”字型；“三”字型；“川”字型；封面型；Flash动画型；标题与文本型；框架型……你能指出老师展示的这些网站属于哪种布局吗？你准备选择哪一种布局方式来设计自己的首页？
2、练一练：新建一个网页，根据上节课自己拟订的网站设计方案，在空白位置输入网站名称、栏目名称、主题介绍、作者姓名等内容。?
3、仿照word的操作，利用格式栏中的工具按钮，设置改变文字效果，师鼓励学生在设计时要展示出自己的个性。?
小组内交流：我是怎样使文字格式更美的。?
4、保存主页文件?教师指导学生保存时，首页应保存为index.htm或default.htm，保存的位置是上节课所规划的网站文件夹。????
任务三：美化网页??
师：（通过广播展示一些学校或公司网站、以及学生网站4幅截图）请同学们观察这四个网站的首页，色彩和风格上有什么不同？（抽生回答）?要使我们的首页更美，我们可以用色彩或图案来美化它，你还希望你的网页背景是什么色彩或图案？你觉得可以插入什么图片来突出网站的主题呢？?
1、试一试：改变网页的背景和插入图片?学生阅读课本89页，独立试探完成背景颜色效果的设置。?投影展示：“格式——背景”的关键步骤画面??
设置网页背景??
进一步尝试和交流：除了使用色彩作为背景，还可以怎样美化背景？能用图片作为背景吗？试试看，怎样才能办到？?Frontpage能像word一样插入图片吗？试试看。?
2、组织学生进行交流：怎样设置背景效果？怎样插入图片和调整大小？?
四、课外拓展??
????上互联网，欣赏http://www.nbxiaoshi.net/xsgrzy/?网站的学生作品。选择一种你最欣赏的主页布局样式，自找素材制作一个介绍“中国年”的主题网站首页。??
五、小结：??
通过本节课的学习，你的网站首页做好了吗？向大家介绍你的首页中都做了哪些内容？你对自己作品的哪一方面最满意呢？小组互评网站首页。