FrontPage网页设计教学教案
frontpage课程设计
frontpage课程设计一、教学目标本课程的教学目标是使学生掌握 FrontPage 的基本操作，能够使用 FrontPage 制作简单的网页。
具体目标如下：1.了解 FrontPage 的界面和基本功能。
2.掌握 FrontPage 中的文本、图像、超链接等基本元素的插入和编辑方法。
3.了解 FrontPage 的、框架等布局工具的使用方法。
4.掌握 FrontPage 的网页发布和管理方法。
5.能够使用 FrontPage 制作简单的个人网页。
6.能够使用 FrontPage 进行网页的基本布局和设计。
7.能够使用 FrontPage 发布和维护简单的个人。
情感态度价值观目标：1.培养学生对计算机技术和网络应用的兴趣和好奇心。
2.培养学生独立思考和解决问题的能力。
3.培养学生团队协作和分享交流的精神。
二、教学内容根据教学目标，本课程的教学内容主要包括以下几个方面：1.FrontPage 的基本操作和界面熟悉。
2.文本、图像、超链接等基本元素的插入和编辑方法。
3.、框架等布局工具的使用方法。
4.网页发布和管理方法。
具体的教学大纲如下：第 1 课时：FrontPage 基本操作和界面熟悉。
第 2 课时：文本的插入和编辑。
第 3 课时：图像的插入和编辑。
第 4 课时：超链接的插入和管理。
第 5 课时：的制作和编辑。
第 6 课时：框架的使用和布局。
第 7 课时：网页发布和管理。
三、教学方法为了达到教学目标，本课程将采用多种教学方法，包括讲授法、实践操作法、小组讨论法等。
1.讲授法：用于讲解 FrontPage 的基本概念和操作方法。
2.实践操作法：让学生通过实际操作来熟悉和掌握 FrontPage 的各项功能。
3.小组讨论法：让学生通过小组合作和讨论，共同完成网页制作和设计任务。
四、教学资源为了支持教学内容和教学方法的实施，本课程将准备以下教学资源：1.教材：FrontPage 学习手册。
2.参考书：FrontPage 高级应用技巧。
Frontpage网页设计教学方案
交互效果
1 2
弹出框
使用JavaScript和CSS创建一个弹出框，用于显 示额外的内容或信息，增强用户与页面的互动性。
表单验证
通过JavaScript对表单进行实时验证，确保用户 输入的数据符合要求，提高表单提交的准确率。
3
点击特效
通过JavaScript实现点击元素时的特效，如放大、 变色、跳转等，提升用户体验和页面吸引力。
总结词
选择合适的链接颜色和下划线样式
详细描述
链接的颜色、下划线样式等应与网页的整体风格协调，同 时也要便于用户识别和点击。一般来说，链接的颜色应与 网页背景形成对比，下划线样式也要清晰可见。
总结词
设置链接的打开方式
详细描述
根据用户的需求和体验，可以选择链接的打开方式（如新 窗口、当前窗口等）。一般来说，为了防止用户误点击链 接而离开当前页面，建议在弹出窗口中打开链接。
站点设置
在站点属性面板中，可设置站点标题、描述等信息， 以及设置网页模板等。
网页布局与设计
表格布局
使用表格进行网页布局，方便控制页面元素位置 和大小。
插入元素
通过插入菜单，可添加文本、图片、链接等元素 到页面中。
ABCD
CSS样式
通过CSS样式表，可设置页面元素的样式，如字 体、颜色、背景等。
页面美化
使用Frontpage提供的工具和插件，可对页面进 行美化，如添加动画效果、背景音乐等。
03 网页元素设计
文本设计
总结词
选择合适的字体和字号
详细描述
根据网站的风格和目标受众，选择适合的字体和字号。对于正文内容，通常使用易读且清晰的字体， 如Arial、Times New Roman等，字号大小也要适中，以便用户阅读。
FrontPage制作简单网页(高二公开课教案)
FrontPage制作简单网页（高二信息技术公开课教学教案）［教学目的］了解网站的基本结构、构建网站的步骤，掌握用FrontPage制作简单网页［教学重点］网站规划、在网页中输入文字，插入图片和表格［教学难点］在网页中输入文字，插入图片和表格［教学形式］演示与练习穿插进行［教学过程］［导入新课］大家都很喜欢上网，因为网上有许多东西（学习资料、游戏、软件、音乐……）可供我们选择，而且许多都是免费的。
这就是网络的一个很重要的特点――资源共享。
这些资源都是放在一个一个网站中的。
我们也可以构建一个网站，把你的珍藏整理好放上去。
这样别人就可以分享你的东西。
目前，在网上就有许多有名的个人网站，像华军软件、电脑之家、驱动之家、九天音乐等。
［讲授新课］要想在网上安家落户，大体上有以下三步：网站规划、网页制作和上传以布。
今天我们就先来学习网站规划和简单网页的制作。
一、网站规划（在制作网页之前要先建站，如果没有事先的准备及策划，只盲目的开始编辑网页，将要花更多的时间和精力在网站的整合上。
所以要养成先建站再织网的好习惯）1．确定网站的主题2．网站要包含哪些咨训与服务3．构思每个网页的草图4．确定网页与网页之间的链接演示：1、用FrontPage中的导航来更直观地了解网站结构；2、用FrontPage新建一个站点；（1）打开FrontPage，选择“文件”－＞“新建”－＞“站点”；（2）单击“只有一个网页的站点”注：在“文件夹列表”中显示该站点中所有的文件夹和文件。
（一般新建站点后就有两个文件夹，我们一般将网站所需的图片放在“image”文件夹中，当然你也可以根据需要新建一些文件夹，但必须在一个站点中）练习：1．自己构建一个个人网站；2．新建个人网站（当然此时的个人网站还只是和个空白网页）二．制作网页“自我简介”（先展示一下做好的“自我简介”）（一）在网页中输入文字和插入表格1．在网页中编辑工作区输入文字“自我简介”，居中；2．选中文字“自我简介”，选择“楷体＿GB2312”，字号为“6（24）磅”，粉红色）；3．选择“插入”－＞“换行符”，在弹出的“换行符属性”对话框中选择“普通换行符”，单击“确定”，光标移到下一行；4．单击“常用”工具栏上的“插入文件中的图片”按钮，弹出“图片”对话框；5．单击“剪贴画”按钮，在“比喻”类别中选择一幅图片，将此图片插入网页中；6．调整图片的大小，居中放置；7．选择“格式”－＞“背景”命令在网页中加入背景图片；8．单击“网页编辑区”下方的“预览”标签，可以预览网页的效果。
《网页制作》教学设计（5篇）
《网页制作》教学设计（5篇）作为一名优秀的教导工，通常会被要求编写教学设计，借助教学设计可以提高教学质量，收到预期的教学效果。
则写教学设计须要留意哪些问题呢？下面是我收拾的《网页制作》教学设计〔精选5篇〕，欢送阅读与收藏。
《网页制作》教学设计1一、教材或教学内容分析本章内容在本教材中的位置处于第五章,是在文字处理(Word2000)和网络根底及因特网应用两章之后。
学生所学的文字处理软件Word和将要学习的网页制作软件Frontpage同是Microsoft公司的产品,在软件的使用上有无数的共通之处,所以在学习frontpage的时候,无数内容可以让学生自学,而不必面面俱到地在课上讲授。
而第四章网络根底及因特网的应用又为学生对网页的理解奠定了根底,学生对网页中的根本元素——文字、图片、动画、声音等都有所了解,而网页的制作就是将这些元素重新组合到网页上,学生要学的就是这种组合的办法。
所以说,虽然大多数学生以前都未接触过网页的制作,但有了以上这些根底,学起来就轻巧多了。
本章内容根据学生已有的根底,我对教学内容分了一下类,也为教学的组织工作打下一点根底。
本章内容主要由网页根底学问、网站的建设和管理、网页的制作、创立超链接、图片的处理、网页框架。
重点是网页的制作和创立超链接,学会了这些就可以开场容易的网页制作了。
难点是网页框架,这局部互相之间关系比拟冗杂,必要时,教师在对各组个别辅导时,可以赋予分离解说。
这个分类可以为组长支配各个组员的任务提供参考,使分工越发合理。
二、教学对象的分析信息技术课虽然已经成为初中的必修科目,但是城乡学生之间控制状况的差别却相当大,条件好一点的初中学生不仅已经娴熟控制了课本上的内容,还对一些常用软件有所了解;而差一点的可以说是从高中开场才正式接触到信息技术学问的学习,他们须要多锻炼、多指导,所以配合学习对学生的学习帮忙很大。
三、教学策略的挑选及媒体的使用在教学策略的挑选上,我使用的是任务驱动和配合学习相结合的办法。
《Frontpage网页制作》教案设计
《Frontpage网页制作》教案设计
一、教学目标：
1、知识与技能：
能利用表格设计页面布局，能在网页中插入图片、文字，制作出一个简单的网页。
2、过程与方法：
能合理利用身边的素材，安排网页的内容。
能有意识地进行色彩的搭配，注重页面美化。
3、情感态度与价值观：
能转换视角，以浏览者的角度考虑页面设计的合理性。
能发现网页中存在的问题，并以积极的态度通过相互交流、协作学习、自主探究等手段尝试解决问题。
二、教学组织：
教师引导，学生自主探究
三、教学环境：
网络教室，极域教学软件，网页制作软件（Frontpage）
四、教学重点、难点：
利用表格布局网页。
FrontPage网页制作教案(18课时)
FrontPage网页制作教案（18课时）第一节网页制作基础知识教学目标：1、了解网站、网页、主页和HTML的基本概念2、了解常见的网页制作工具3、掌握Frontpage的启动和退出教学手段：教师讲解与学生演示相结合教学过程：一．讲课：一、网页及其组成通过浏览器在WWW上所看到的每一幅画面都是一个网页（Web Page）。
网页是全球广域网上的基本文档，用HTML语言编写。
网页中所的元素主要有文字、图片、声音、动画、影像以及链接等，通过这些元素的有机组合，就形成了包含各种信息的网页。
其中，文字是网页中最常用的元素；图片可以给人以生动直观的视觉印象，适当运用图片，可以美化网页；链接的设计，可以使我们进行选择性的浏览；随着动态HTML技术的发展，人们在网页中加入声音、动画等多媒体信息，使网页更加丰富多彩。
二、常用的网页制作工具最初，人们利用HTML语言在文本编辑器中制作网页。
HTML语言是超文本标记语言（Hypertext Markup Language）的缩写，用来描述网页的结构，但不能直观的描述网页在浏览器中的效果。
因此，只有熟练掌握HTML语言的专业人员才能用它制作网页。
后来出现了一些网页制作工具（如CDIDA软件），降低了对HTML语言的要求，但是要实现某些功能，还必须输入相应的HTML代码。
FrontPage系列软件的问世，才将人们从HTML代码中解放出来。
用FrontPage软件制作网页就象在文字处理软件中编排多媒体文档一样，具有“所见即所得”的特性，而真正描述网页结构的HTML代码，则由FrontPage在幕后自动生成。
这样，大家都可以方便地制作自己的网页。
目前，使用较多的网页制作软件有：FrontPage、Flash、Dreamweaver等。
三、FrontPage2000的启动和退出1．启动方法：单击“开始”按钮，拖动鼠标指针依次指向“程序（P）”“Microsoft FrontPage”，并单击，即可启动FrontPage2000。
2024年FRONTPAGE制作网页型课件教案设计
2024年FRONTPAGE制作网页型课件教案设计第一章：FRONTPAGE 2024概述1.1 课程目标了解FRONTPAGE 2024的基本功能和特点掌握FRONTPAGE 2024的界面布局和主要工具栏熟悉FRONTPAGE 2024的网页编辑和排版技巧1.2 教学内容FRONTPAGE 2024的发展历程和版本特点FRONTPAGE 2024的启动和界面布局工具栏的功能介绍和操作方法网页编辑和排版的基本技巧1.3 教学活动观看FRONTPAGE 2024的介绍视频教师演示FRONTPAGE 2024的基本操作学生跟随教师一起创建一个简单的网页1.4 作业与评估学生完成一个简单的网页设计评估学生的网页设计质量和操作技能第二章：网页布局与设计2.1 课程目标学习网页布局的基本原则和方法掌握FRONTPAGE 2024的表格和框架功能了解网页设计的色彩和排版原则2.2 教学内容网页布局的基本原则和常见布局方式FRONTPAGE 2024的表格操作方法和技巧框架的创建和使用方法网页设计的色彩和排版原则2.3 教学活动教师讲解网页布局的原则和方法学生跟随教师一起设计一个网页布局学生自主设计一个网页布局并进行展示2.4 作业与评估学生完成一个网页布局设计评估学生的网页布局设计和操作技能第三章：网页元素添加与编辑3.1 课程目标学习在FRONTPAGE 2024中添加和编辑网页元素掌握文本、图片、等网页元素的添加和编辑方法学习使用FRONTPAGE 2024的表单功能3.2 教学内容文本的添加和编辑方法图片的插入和编辑方法的创建和编辑方法表单的创建和编辑方法3.3 教学活动教师讲解文本、图片、等网页元素的添加和编辑方法学生跟随教师一起添加和编辑网页元素学生自主设计一个包含文本、图片、和表单的网页3.4 作业与评估学生完成一个包含文本、图片、和表单的网页设计评估学生的网页元素添加和编辑技能第四章：网页样式与动画4.1 课程目标学习使用FRONTPAGE 2024的样式功能掌握CSS样式的创建和应用方法学习使用FRONTPAGE 2024的动画功能4.2 教学内容样式的创建和应用方法CSS样式的编写和应用方法动画的创建和编辑方法4.3 教学活动教师讲解样式和CSS样式的创建和应用方法学生跟随教师一起创建和应用样式和动画学生自主设计一个包含样式和动画的网页4.4 作业与评估学生完成一个包含样式和动画的网页设计评估学生的样式和动画创建和应用技能第五章：网页发布与维护5.1 课程目标学习使用FRONTPAGE 2024发布网页掌握网页的预览和发布方法学习网页的维护和更新技巧5.2 教学内容网页的预览和发布方法网页的维护和更新技巧5.3 教学活动教师讲解网页的预览和发布方法学生跟随教师一起发布网页学生自主设计一个网页并进行发布和维护5.4 作业与评估学生完成一个网页的设计、发布和维护评估学生的网页发布和维护技能第六章：FRONTPAGE 2024高级文本编辑6.1 课程目标掌握FRONTPAGE 2024中的高级文本编辑功能学习使用字体、字号、颜色、对齐等文本样式了解如何插入特殊字符和符号文本样式设置：字体、字号、颜色、对齐等插入特殊字符和符号的方法使用文本框和段落格式的技巧实例讲解文本的高级编辑技巧6.3 教学活动教师演示高级文本编辑功能的使用学生跟随教师一起练习文本编辑学生自主设计一个文本编辑展示页6.4 作业与评估学生完成一个高级文本编辑的网页设计评估学生的文本编辑质量和操作技能第七章：图片和多媒体的应用7.1 课程目标学习在FRONTPAGE 2024中插入和编辑图片掌握多媒体文件（如音频、视频）的插入和控制了解图片和多媒体在网页中的优化使用7.2 教学内容插入和编辑图片的方法和技巧多媒体文件（音频、视频）的插入和属性设置图片和多媒体的优化使用和版权问题实例讲解图片和多媒体在网页中的应用教师讲解图片和多媒体的应用方法学生跟随教师一起练习插入和编辑图片及多媒体学生自主设计一个包含图片和多媒体的网页7.4 作业与评估学生完成一个包含图片和多媒体的网页设计评估学生的图片和多媒体应用质量和操作技能第八章：超和导航栏的制作8.1 课程目标学习在FRONTPAGE 2024中创建超掌握超的目标设置和路径选择了解如何创建导航栏和菜单8.2 教学内容超的创建方法和目标设置超路径的选择和编辑导航栏的创建和菜单的设置实例讲解超和导航栏在网页中的应用8.3 教学活动教师讲解超和导航栏的制作方法学生跟随教师一起练习创建超和导航栏学生自主设计一个包含超和导航栏的网页8.4 作业与评估学生完成一个包含超和导航栏的网页设计评估学生的超和导航栏制作质量和操作技能第九章：FRONTPAGE 2024表格和数据展示9.1 课程目标学习在FRONTPAGE 2024中创建和编辑表格掌握表格的样式设置和数据排序了解如何使用表格进行数据展示和分析9.2 教学内容表格的创建和编辑方法表格样式的设置和调整表格数据的排序和筛选实例讲解表格和数据在网页中的应用9.3 教学活动教师讲解表格和数据的创建和编辑方法学生跟随教师一起练习创建和编辑表格学生自主设计一个包含表格和数据的网页9.4 作业与评估学生完成一个包含表格和数据的网页设计评估学生的表格和数据编辑质量和操作技能第十章：FRONTPAGE 2024表单和交互设计10.1 课程目标学习在FRONTPAGE 2024中创建和编辑表单掌握表单元素（如文本框、按钮、下拉菜单等）的插入和属性设置了解表单的提交和数据处理方式10.2 教学内容表单的创建和编辑方法表单元素的插入和属性设置表单的提交和数据处理方式实例讲解表单和交互在网页中的应用10.3 教学活动教师讲解表单和交互的创建和编辑方法学生跟随教师一起练习创建和编辑表单学生自主设计一个包含表单和交互的网页10.4 作业与评估学生完成一个包含表单和交互的网页设计评估学生的表单和交互设计质量和操作技能第十一章：FRONTPAGE 2024模板和主题应用11.1 课程目标学习如何在FRONTPAGE 2024中应用模板和主题掌握模板和主题的导入和编辑方法了解如何定制模板和主题以适应个性化需求11.2 教学内容模板和主题的概念及作用模板和主题的导入和应用方法定制模板和主题的技巧实例讲解模板和主题在网页设计中的应用11.3 教学活动教师讲解模板和主题的应用方法学生跟随教师一起练习导入和应用模板和主题学生自主设计一个应用了模板和主题的网页11.4 作业与评估学生完成一个应用了模板和主题的网页设计评估学生的模板和主题应用质量和操作技能第十二章：FRONTPAGE 2024网页布局的高级技巧12.1 课程目标学习FRONTPAGE 2024网页布局的高级技巧掌握框架的嵌套和表格的层叠使用了解响应式布局和移动端优化方法12.2 教学内容框架的嵌套方法和技巧表格的层叠使用和样式设置响应式布局的实现方法移动端网页优化的技巧12.3 教学活动教师讲解网页布局的高级技巧学生跟随教师一起练习框架嵌套和表格层叠学生自主设计一个具有响应式布局和移动端优化的网页12.4 作业与评估学生完成一个具有响应式布局和移动端优化的网页设计评估学生的网页布局高级技巧质量和操作技能第十三章：FRONTPAGE 2024网页设计的最佳实践13.1 课程目标学习FRONTPAGE 2024网页设计的最佳实践掌握网页设计的基本流程和原则了解如何提高网页设计的质量和用户体验13.2 教学内容网页设计的基本流程和原则网页设计的标准和规范提高网页设计质量和用户体验的方法实例讲解网页设计的最佳实践13.3 教学活动教师讲解网页设计的最佳实践学生跟随教师一起练习网页设计的基本流程学生自主设计一个符合最佳实践的网页13.4 作业与评估学生完成一个符合最佳实践的网页设计评估学生的网页设计质量和操作技能第十四章：FRONTPAGE 2024网页设计的案例分析14.1 课程目标分析FRONTPAGE 2024网页设计案例学习优秀网页设计案例的优点和启示了解如何将案例中的设计理念应用到实际项目中14.2 教学内容分析网页设计案例的方法和技巧优秀网页设计案例的优点和启示将案例中的设计理念应用到实际项目中的方法14.3 教学活动教师讲解网页设计案例分析的方法学生跟随教师一起分析优秀网页设计案例学生自主分析一个网页设计案例并分享心得14.4 作业与评估学生完成一个网页设计案例分析报告评估学生的案例分析质量和操作技能第十五章：FRONTPAGE 2024网页设计的项目实践15.1 课程目标运用FRONTPAGE 2024完成一个网页设计项目掌握网页设计项目的整体流程和团队协作了解如何将所学知识应用到实际项目中15.2 教学内容网页设计项目的整体流程和团队协作项目实践中的注意事项和解决方法实例讲解网页设计项目实践15.3 教学活动教师讲解网页设计项目实践的方法学生跟随教师一起完成一个网页设计项目学生自主设计一个网页设计项目并进行展示15.4 作业与评估学生完成一个网页设计项目评估学生的网页设计项目质量和操作技能重点和难点解析本文主要介绍了2024年FRONTPAGE制作网页型课件教案设计，内容涵盖了网页布局与设计、网页元素添加与编辑、网页样式与动画、网页发布与维护、高级文本编辑、图片和多媒体的应用、超和导航栏的制作、表格和数据展示、表单和交互设计、模板和主题应用、网页布局的高级技巧、网页设计的最佳实践、网页设计的案例分析以及网页设计的项目实践等十五个章节。
高中信息技术《网页制作》教案三篇高中信息技术网页制作
高中信息技术《网页制作》教案三篇高中信息技术网页制作教案网权威发布高中信息技术《网页制作》教案三篇，更多高中信息技术《网页制作》教案三篇相关信息请访问教案网。
FrontPage网页设计技巧综合运用专家们、教师们：大家好！今天我说课的题目是：FrontPage网页设计技巧综合运用我的说课将从以下几个方面进行：一：说教材二：说教学目的三：说学生四：说教学方法及实现途径五：说有关教学设计中的三个引导点首先说教材：教材的选取：教材使用经全国中小学教材审定委员会审查通过，全日制普通高级中学信息技术教科书，高中第三册，第一单元FrontPage网页设计的总结运用课。
这一教材由广西科学技术出版社出版本节教学内容所处的地位：是巩固与提高学生网页设计技巧的极好机会，而且是教师抓住机会进行更精彩、更有意义的教学设计与教学实施的关键时期，我想这点会在我后面的教学设计阐述中体会。
接下来说教学目标：基础知识目标：巩固前面已学的网页设计技巧，而且将激发学生自主去探讨，更多的网页设计技巧。
能力培养目标：培养学生互相合作，共同提高的良好品质；鼓励学生们在这一网页设计运用课中，充分利用网络资源，培养自己主动学习及探究能力和综合信息素养。
情感教育目标：如何使信息技术教学成为培养学生综合素质的一个平台，如何设计除了教会学生使用一些基础软件知识之外的更多的东西，这是我一直在计算机课教学中思考的一个问题；学生情感教育的培养，一直应成为我们课堂教学中，不可缺少的重要素质教育目标之一，所以选择母爱为主题，由此培养学生对母爱的理解及体验母亲对儿女平凡而伟大的爱；另外也为丰富我自己的情感：我作为一名普通的教学人员，我希望在我的教学中做我应做的，做我能做的，多探讨，多尝试，丰富学生的内心同时，我也在其中丰富自己，并感受更多的快乐。
接下来说学生：学生计算机知识背景：我的学生是高二的学生，高二的的学生经过高一计算机基础知识的学习以后，他们有一定的网络知识，如何设计一个教学环节不仅仅简单让学生回顾复习一下，而是能达到更高的层次，下面了解一下：学生的身心特点：高中生在心理和行为上表现出强烈的自主性，具有很强的自信心和自尊心，热衷于展现自己的力量和才能；他们已不满足于父母、老师的讲解，或书本上的现成结论，学生与父母的交流：在高中阶段，高生中的自主、独立性使他们的个性处于极其张扬与反叛的时期，父母与孩子的交流往往在这一时期成为多事之秋。
初中frontpage网页制作教案
初中frontpage网页制作教案课程目标：1. 让学生了解 FrontPage 网页制作的基本操作和功能。
2. 培养学生运用计算机技术进行创意表达和信息交流的能力。
3. 提高学生利用网络资源进行学习、调查和研究的能力。
教学内容：1. FrontPage 网页制作的基本操作。
2. FrontPage 网页编辑技巧。
3. FrontPage 网页设计原则。
4. 网页发布与分享。
教学重点：1. FrontPage 网页制作的基本操作和功能。
2. 网页编辑技巧。
3. 网页设计原则。
教学难点：1. 网页布局和设计。
2. 网页特效实现。
教学准备：1. 安装有 FrontPage 的计算机。
2. 网络连接。
教学过程：一、导入（5分钟）1. 向学生介绍 FrontPage 网页制作的意义和用途。
2. 引导学生思考如何利用 FrontPage 制作一个有趣的网页。
二、基本操作学习（15分钟）1. 引导学生打开 FrontPage，了解界面布局。
2. 讲解如何创建新网页、保存网页、打开网页。
3. 讲解如何添加文本、图片、链接等基本元素。
三、网页编辑技巧（20分钟）1. 讲解如何对文本进行格式化，如字体、颜色、大小等。
2. 讲解如何对图片进行处理，如剪裁、翻转、加水印等。
3. 讲解如何添加音频、视频等多媒体元素。
四、网页设计原则（15分钟）1. 讲解网页设计的基本原则，如布局、色彩、字体等。
2. 引导学生思考如何将设计原则应用于实际网页制作中。
五、实践操作（20分钟）1. 引导学生分组进行实践，运用所学知识制作一个简单的网页。
2. 教师巡回指导，解答学生遇到的问题。
六、网页发布与分享（10分钟）1. 讲解如何将网页发布到互联网上。
2. 讲解如何通过链接、邮件等方式分享网页。
七、总结与反思（5分钟）1. 让学生回顾本节课所学内容，总结自己的收获。
2. 引导学生思考如何运用所学知识进行网页制作的创新。
教学延伸：1. 邀请专业网页设计师进行讲座，让学生了解网页设计的前沿动态。
FrontPage网页设计教学教案
FrontPage網頁設計教學教案學生的起點行為：熟悉電腦之基本操作，例如啟動電腦、開啟與關閉檔案，使用滑鼠等。
熟悉FrontPage2003軟體的基本操作，如啟動軟體，開啟與關閉檔案，拖曳與按點滑鼠兩下等。
瞭解PhotoImpact11工具列與屬性工具列的位置，並已會存檔與使用文字輸入工具及百寶箱的基本操作。
貳、發展活動教師講解一、建立資料夾按「我的電腦／（Ｃ：）／按右鍵／新増／資料夾」，輸入：班級-座號姓名二、開啟網站1.執行FrontPage程式：按「開始／程式集／ Microsoft Office／Microsoft FrontPage」2.開啟網站：按「檔案／開啟網站」執行PhotoImpact程式：點選「我的工作區／完整功整」按「是／正確」按「網路／元件設計師」：點選「橫幅」樣式，按「下一步」，設定「色彩」及「標題／文字」，輸入如：「三信家商資處科二年13組10號周杰倫」，勾取「文字改變時，同時改變形狀」按「匯出／作為個別物件」，按「儲存」，儲存於：「C:／個人資料夾／images」，輸入檔名：「title」，存檔類型：「GIF」2.插入橫幅元件回FrontPage畫面，打開images資料夾，將拖曳至網頁中，點選圖，按右鍵／顯示圖片工具列，按「設定透明色彩」，點選橫幅背景，設為透明六、製作網頁1.製作按鈕按「插入／Web元件／互動式按鈕／完成」，點選「按鈕」標籤，再點選「按鈕樣式」，輸入文字：「自我介紹」點選「字型」標籤，再設定「原始字型色彩」、「停留時字型色彩」、「按下時字型色彩」點選「圖像」標籤，圈選「將按鈕製成GIF圖像並使用透明背景」2.複製按鈕點選「自我介紹」按鈕，按複製＋貼上複製四個，利用「按右鍵／按鈕屬性」，分別更改四個按鈕文字為：「成長歷程、好站連結、相片藝廊、與我聯絡」七、製作網頁1.插入跑馬燈：按「插入／Web元件／跑馬燈／完成」，輸入歡迎文字2.輸入網站名稱：按「插入／圖片／文字藝術師」，幫自己的網站取超炫名字3.插入自製GIF動畫八、按鈕超連結設定1.按「新增頁面」，新增、、、並輸入標題，按儲存2.點選「自我介紹」按鈕，「按右鍵／超連結」，點選「」網頁，目標框架：點選「右邊」3.同上方法，成長歷程（）、好站連結（）、相片藝廊（）4.點選「與我聯絡」按鈕，「按右鍵／超連結」，點選「電子郵件地址」，輸入E-Mail信箱，如」學生實作1.教師依步驟帶領學生實作練習，並做行間巡視，瞭解學生的學習狀況並解答問答。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
瞭解PhotoImpact11工具列與屬性工具列的位置，並已會存檔與使用文字輸入工具及百寶箱的基本操作。
教學資源
白板，廣播教學系統，PowerPoint投影片，講義
教學方法
講述法，練習法(上機實作)，問答法，示範法
7、製作main.htm網頁
1.插入跑馬燈：按「插入／Web元件／跑馬燈／完成」，輸入歡迎文字
2.輸入網站名稱：按「插入／圖片／文字藝術師」，幫自己的網站取超炫名字
3.插入自製GIF動畫
8、按鈕超連結設定
1.按「新增頁面」，新增01.htm、02.htm、03.htm、04.htm並輸入標題，按儲存
學生實作
1.教師依步驟帶領學生實作練習，並做行間巡視，瞭解學生的學習狀況並解答問答。
2.教師隨時觀看學生的作品，並作評量，註記具創意的作品。
參、綜合活動
1、作成本單元結論。
2、檢討自我評量。
三、指定課後作業。
四、預告下次上課單元。
認真聽講，並適時發問。
依老師指定範例建立新網站。
注意觀察老師的操作程序，建立首頁並存檔。
PowerPoint投影片
講義
講義
廣播教學系統
講義
廣播教學系統
講義
廣播教學系統
講義Hale Waihona Puke 3分5分2分
5分
5分
5分
5分
5分
2分
3-1能描述佈景主題套用的方法。
4-1能說明網路元件設計師的使用方法。
4-2能描述插入圖片的設定方式。
4-3能瞭解圖片設定為透明色彩的方法。
5-1能說明跑馬燈功能的設定。
6-1能描述互動式按鈕製作的方法。
6-2能描述按鈕超連結設定的方法。
2、技能方面
7.學會FrontPage2003的基本操作。
8學會範例作品的製作方法。
按「匯出／作為個別物件」，按「儲存」，儲存於：「C:／個人資料夾／images」，輸入檔名：「title」，存檔類型：「GIF」
2.插入橫幅元件
回FrontPage畫面，打開images資料夾，將title.gif拖曳至網頁中，點選圖，按右鍵／顯示圖片工具列，按「設定透明色彩」，點選橫幅背景，設為透明
7-1熟練FrontPage2003的操作介面。
7-2熟練PhotoImpact11的元件製作。
8-1熟練使用FrontPage2003創作網頁。
三、情意方面
9.增進學習使用網頁設計軟體的樂趣。
10.在團體之中發揮同學愛，並彼此關懷相互協助。
9-1體驗從「做中學」的樂趣。
9-2能主動參與學習活動並樂於發言討論。
3、建立空白網頁
1.按「檔案／開新檔案」，右邊出現「開新檔案」窗格
2.點選「其它網頁範本」
3.(或按工具列「建立新的網頁／網頁」)
4.點選「框架頁」標籤，再點選「橫幅和目錄」後按「確定」
5.出現框架，點選三個「新增網頁」鈕；表示新增三個空白網頁
6.將三個空白網頁分別存檔：按工具列「儲存檔案」鈕，儲存位置：「C:／個人資料夾」上面存title.htm、左邊存menu.htm、右邊存main.htm
FrontPage網頁設計教學教案
單元名稱
建立分割式框架網頁
班級
資處213
人數
52人
教材來源
快快樂樂學FrontPage2003使用技巧，網頁設計相關網站
編表者
李蕙琳
時間
40分
參考書目
FrontPage學習範本，PhotoImpact11快易通
學生學習條件之分析
學生的起點行為：
熟悉電腦之基本操作，例如啟動電腦、開啟與關閉檔案，使用滑鼠等。
依需求選取佈景主題樣式。
注意觀察老師的操作程序，創作橫幅元件。
將所設計橫幅元件存檔。
將元件插入網頁。
注意觀察老師的操作程序，建立所需按鈕。
依範例修改按鈕文字。
依步驟製作跑馬燈。
設定五個按鈕的超連結。
依老師的講解上機實作。
將個人網站壓縮，上傳至老師主機。
提出問題。
複習本節上課內容。
預習下次上課內容。
廣播教學系統
6、製作menu.htm網頁
1.製作按鈕
按「插入／Web元件／互動式按鈕／完成」，點選「按鈕」標籤，再點選「按鈕樣式」，輸入文字：「自我介紹」
點選「字型」標籤，再設定「原始字型色彩」、「停留時字型色彩」、「按下時字型色彩」
點選「圖像」標籤，圈選「將按鈕製成GIF圖像並使用透明背景」
2.複製按鈕
點選「自我介紹」按鈕，按複製＋貼上複製四個，利用「按右鍵／按鈕屬性」，分別更改四個按鈕文字為：「成長歷程、好站連結、相片藝廊、與我聯絡」
教學目標
單元目標
具體目標
1、認知方面
1.認識FrontPage2003的基本操作。
2.認識建立分割式框架網頁製作方法。
3.瞭解套用佈景主題的應用。
4.認識PhotoImpact11元件設計師的使用。
5.瞭解跑馬燈的製作步驟。
6.認識互動式按鈕的設定。
1-1能說出正確開啟網站的方法。
2-1能瞭解建立「橫幅和目錄」框架頁的使用方法
2.點選「自我介紹」按鈕，「按右鍵／超連結」，點選「01.htm」網頁，目標框架：點選「右邊」
3.同上方法，成長歷程（02.htm）、好站連結（03.htm）、相片藝廊（04.htm）
4.點選「與我聯絡」按鈕，「按右鍵／超連結」，點選「電子郵件地址」，輸入E-Mail信箱，如：「johin@」
10-1擔任小老師協助同學，在團體中表現同學愛。
教學目標
教學活動
教具
時間
教師活動
學生活動
壹、準備活動
一、課前活動
1.教師課前準備教材內容。
2.擬定單元目標以及行為目標。
3.製作教具、講義。
4.請學生預習本次上課單元內容。
二、引發動機
1.教師事先蒐集相關之網頁，解說其所引發之討論及社會關懷作用，激發學生自由創造的學習興趣。
2、開啟網站
1.執行FrontPage程式：按「開始／程式集／Microsoft Office／Microsoft FrontPage」
2.開啟網站：按「檔案／開啟網站」
3.指定網站資料夾：「C:／個人資料夾」
4.隨即在左側出現其網站(Web)架構圖，稱為「資料夾清單」（若不小心關閉，可按「檢視／資料夾清單」開啟）
事先設定網頁主題，並上網搜尋圖片。
預習本章內容。
思考並回應老師所提的問題。
PowerPoint投影片
廣播教學系統
3分
1-1
2-1
3-1
4-1
4-2
4-3
6-1
5-1
6-2
7-1
7-2
8-1
9-1
9-2
10-1
貳、發展活動
教師講解
1、建立資料夾
按「我的電腦／（Ｃ：）／按右鍵／新増／資料夾」，輸入：班級-座號姓名
7.最後將首頁以index.htm為檔名存入
4、套用佈景主題
1.按「格式／佈景主題／選取佈景主題／套用為預設的佈景主題」按「是」
5、製作title.htm網頁
1.製作橫幅元件
執行PhotoImpact程式：點選「我的工作區／完整功整」按「是／正確」
按「網路／元件設計師」：點選「橫幅」樣式，按「下一步」，設定「色彩」及「標題／文字」，輸入如：「三信家商資處科二年13組10號周杰倫」，勾取「文字改變時，同時改變形狀」