第一篇：《Dreamweaver中网页布局的方法》教学设计
《Dreamweaver中网页布局的方法》教学设计
授课班级:高一（3）授课教师:曹雪丽 授课时间：2004.5.12
教材分析: 1．教学目标
教学目标既是教学的出发点和归宿又是师生双边活动的中介，因此，我参照《高中新课程标准》和高中学生现有的知识水平和认识特点确定了以下三个目标： A：知识目标
（1）、让学生认识到网页布局对整个网页元素的组织编排的重要性。（2）、让学生掌握在Dreamweaver中实现网页布局的基本方法。
B：能力目标：让学生能动手完成一个简单的网页布局的设计。C：情感目标：
（1）培养学生严谨求实的工作态度以及感受美、评价美的艺术情操。（2）培养学生在进行自主学习的过程中勇于克服困难，体验到成功后的快乐。
2．教学重点、难点、关键 重点：插入表中表 难点、关键：表格的属性设置 学情分析：
本节课的内容面向的对象是高中二年级的学生，对于学习这部分内容他们有三大优势：第一，除信息技术课外许多课都在网络课室上。因此，他们对网络很熟悉且很热爱，有一定的网络知识。第二，他们有WORD部分关于表格和简单的网页制作基础。第三，一部分同学有一些Dreamweaver的基础，可在学生中起积极的促进作用。设计理念：
本节课的设计理念是以诱思探究学科教学论为理论依据，以充分发挥学生的主体地位为出发点，以培养学生自主学习能力全面提高学生素质为目的。是一节“诱思探究”理论的探索课。为此，在课前教师为学生准备了网络布局学习资源网站，学生自己也已经以小组为单位确立了要本组要建立的网站的主题。整节课的内容安排是以从学生“动手”中发现问题，又在学生的“动手”中解决问题为主脉展开的。同时又通过评价环节中学生的之间的互评、点评将本节推向高潮，达到突出重点，攻破难点的目的。学习目标分析：
借助以前积累的知识、经验及学习资源网自主探索，小组协作进而归纳、研究出网页布局的内在规律性。教学策略的选择与设计 1．教学方法：（1）诱思导学法（2）任务驱动—体验探究法
（3）分层教学法（4）网络探究教学法（5）激励教学法 2．学法指导：形象探究法、经验探究法、体验探究法、协作式学习法。3．资源的设计与选择： 结合本节内容设计了一个学习资源网站、传奇电子教室系统、Dreamweaver网页编辑软件等。教学过程设计：
教学设计过程及设计思想 教学环节 教师活动 学生活动 设计思想 时间 新 课 的 引 入 ⌒ 教 师 监 控 ︶
1，相邻两同学为一组分别在浏览器中打开两个不同的网页作品相互欣赏评价，同时准备回答：
问题1：这两个网页有什么不同？你认为哪个更好一些？为什么？ 2，在Dreamweaver中打开该网页并逐一删除页面元素同时继续提问： 留在页面上的是什么？ 1，回答问题1 带着问题2观察老师的操作
2，回忆Word中表格的插入方法及技巧
我以“诱思探究导学法”为指导思想,主要体现“诱”和“导”两个环节。首先是“诱疑”使学生“生疑”；然后要“导向”，比如这里教师的操作：在Dreamweaver中删除页中的页面元素后出现的表格，让学生的思维沿着正确方向发展，最终达到“释疑”的目的。2 分 钟
点评：“诱思探究导学法”一句话，诱发思维动机，导正思维航向。这是突现教师基本功的地方，要“诱”得巧，“导”得妙。
新
课
学习
新
课
学习
布置 任务 ⌒ 教 师 监 控 ︶
[任务1]能根据资源网的指导学会表中表的使用，并完成本节的例题的表格制作。（必做题）
[任务2]能在布局的基础上插入图片及文字，完成一个如例题的简单网页制作。（提高题）
[任务3]能通过属性的设计美化网页。（先做题）1，学生可根据自己的具体情况选择合适的任务。2，各组长明确任务。
在任务设计时我注意到这样两个因素；一是：为了一切学生，在设置任务时要充分考虑到学生的个别差异。体现分层教学的重要性。二是：以探索问题来引动和维持学习者学习的兴趣和动机。2 分 钟 学 法 指 导 ⌒ 教 师 监 控 ︶
指导学生带着“任务”中的问题，利用教师准备的学习资源网自主学习，探索交流,小组互助，“助教”指导,量力而行完成操作任务。1，明确学习资源的使用方法，采取各种方法完成任务
利用教学资源自主学习及优生做好“助教”的角色互帮互学，既能激发他们的学习积极性，给他们一个锻炼成长的机会，又能使更多的学生得到帮助，有利于全面提高学生动手动脑的能力，体现“因材施教”。1 分 钟
点评：这两部分的目的在于
一、体现分层教学的重要性。
二、培养学生养成由简到繁、由易到难、循序渐进地解决问题的好习惯，同时学生之间的以教促教，以教帮教，以教带教的方法有利于学生的全面发展。师
生 互
动
1，寻找学生在完成任务中会遇到第一个问题：“表格线互扰问题”并及时以该问题为切入点将学生的思维引入到本节的重点内容--表中表的使用。2，引导学生发现例子中的新问题—各部分表格线的差异，将本节的内容推向另一个热点。
1，学生掌握表中表的使用方法
2，完成任务
3，注意到表格属性的功能。
我是这样设计本部分内容将重点放在以下两个方面：
第一、在本节课师生以“任务”为主线，在学生不断地发现问题，教师及时地鼓励准确地导向，调控学生主动地探究，利用各种方法例如：教师搭建的网上学习资源，平时建立的小组协作关系等去想办法解决问题。25 分钟 师
生 互
动
3，评价小结是本节课的一个高潮部分。此时教师重点由上面技术点的引导转到学生心理素质及与人交往能力的导向上。这一点其实比单纯的学会上面的技术更为重要。在学生的自评中引导学生客观评价自己。不能过分谦虚而失去在同学们面前表现自己才干的机会又不能过分张扬引起同学们的反感影响自己的形象。
4，由学生推选代表主持评价以调动学生积极参与评价的积极性 第二、充分利用评价方式对学生的激励作用一改过去由教师为权威做法。此时，教师把主动权交给学生，使他们更具参与意识引发学习的主动性，学会正确地、善意地、艺术地评价他人和自己。从中学到做人的道理。12 分
钟
点评：让学生带着真实的任务学习，这是任务驱动的精髓。这一部分是本节的重要内容，也是教学设计的一个难点。是对教师综合运用“任务驱动—体验探究”；“分层教学”“表扬激励”等教学方法能力、如何引导学生选择确实可行的学习方法能力的考验。同时，通过评价的过程，潜移默化地巩固知识，提高解决问题、评判是否的能力。知识迁移 学生活动
[问题1]用表格布局有什么优缺点，还有好方法吗？ [问题2]在网络资源中是否有其它的方法呢？ 采用小组形式讨论
这里的想法主要是培养学生学会反思。3分钟
点评：为学有余力的学生创造继续发展的广阔天空，激发他们的兴趣，培养他们的创新精神。
课后反思： 成功的地方：
（1）课题引入时以诱发学生的思维动机，导正思维航向为目的，为学生的自主学习打下基础。
（2）学习资源网站、小组互助、助教帮忙等形式为学生的自主学习创造了条件对培养学生养成由简到繁、由易到难、循序渐 进地解决问题的好习惯起到积极的促进作用。
（3）评价方式的改革可达到引导学生客观评价自己不能过分谦虚而失去在同学们面前表现自己才干的机会又不能过分张扬引起同学们的反感影响自己的形象。在互评、点评中要引导学生正确看待别人对自己的评价学会宽以等人；学会巧妙地运用语言艺术对存在问题的同学提出批评。同时通过点评，互评各自的作品，巩固本节的知识点，达到强调重点，攻破难点的目的。
存在问题的地方：评价方式仍需大胆地放手，让评价的形式更加多样化，民主化。可充分发挥学生的主动作用让他们去设计评价手段、评价量表等，这对于主体作用的体现及学生的创造性思维的发展都会产生积极的影响。
网络
本节小结：由小组总结提交 结束 教师活动：
1． 分组欣赏网页作品。
2． 教师操作演示在网页中删除元素从而引入表格布局的方法。设计思想
通过教师的诱和导达到诱发思维动机，导正思维航向的目的。教师监控： 1。布置学习任务。
2．对学生进行学法指导。使用学习资源、小组互助、助教帮忙。
设计思想
1.创造开放式的教学环境，学生为主体，体验为红线，鼓励他们积极动脑、动手完成任务。2.教师的适时演示体现诱思探究法的思想宗诣。3.利用小组互助以教促教，以教帮教，以教带教的方法有利于学生的全面发展。设计思想
通过评价的过程正确地、善意地、艺术地评价他人和自己。教会学生学会做人的道理。网络
教师监控：小组互评及个案点评相结合强调难点，深化主题 开始
学生利用学习资源网站自主学习、探索交流、找出难点、小组互助，完成任务，深化主题。
教师寻找典型案例1表格线的互扰问题引出本节的重点表中表。典型案例2表格线的粗细问题引出难点属性问题
教师：提出问题1及问题2 设计思想 培养学
（二）教学过程流程图
第二篇：《Dreamweaver中网页布局的方法》教学设计
资料
《Dreamweaver中网页布局的方法》教学设计
授课班级:高一（3）授课教师:曹雪丽 授课时间：2004.5.12
教材分析: 1．教学目标
教学目标既是教学的出发点和归宿又是师生双边活动的中介，因此，我参照《高中新课程标准》和高中学生现有的知识水平和认识特点确定了以下三个目标： A：知识目标
（1）、让学生认识到网页布局对整个网页元素的组织编排的重要性。（2）、让学生掌握在Dreamweaver中实现网页布局的基本方法。
B：能力目标：让学生能动手完成一个简单的网页布局的设计。C：情感目标：
（1）培养学生严谨求实的工作态度以及感受美、评价美的艺术情操。（2）培养学生在进行自主学习的过程中勇于克服困难，体验到成功后的快乐。
2．教学重点、难点、关键 重点：插入表中表 难点、关键：表格的属性设置
资料
学情分析：
本节课的内容面向的对象是高中二年级的学生，对于学习这部分内容他们有三大优势：第一，除信息技术课外许多课都在网络课室上。因此，他们对网络很熟悉且很热爱，有一定的网络知识。第二，他们有WORD部分关于表格和简单的网页制作基础。第三，一部分同学有一些Dreamweaver的基础，可在学生中起积极的促进作用。设计理念：
本节课的设计理念是以诱思探究学科教学论为理论依据，以充分发挥学生的主体地位为出发点，以培养学生自主学习能力全面提高学生素质为目的。是一节“诱思探究”理论的探索课。为此，在课前教师为学生准备了网络布局学习资源网站，学生自己也已经以小组为单位确立了要本组要建立的网站的主题。整节课的内容安排是以从学生“动手”中发现问题，又在学生的“动手”中解决问题为主脉展开的。同时又通过评价环节中学生的之间的互评、点评将本节推向高潮，达到突出重点，攻破难点的目的。学习目标分析：
借助以前积累的知识、经验及学习资源网自主探索，小组协作进而归纳、研究出网页布局的内在规律性。教学策略的选择与设计 1．教学方法：（1）诱思导学法（2）任务驱动—体验探究法
（3）分层教学法（4）网络探究教学法（5）激励教学法
资料
2．学法指导：形象探究法、经验探究法、体验探究法、协作式学习法。3．资源的设计与选择： 结合本节内容设计了一个学习资源网站、传奇电子教室系统、Dreamweaver网页编辑软件等。教学过程设计：
教学设计过程及设计思想 教学环节 教师活动 学生活动 设计思想 时间 新 课 的 引 入 ⌒ 教 师 监 控 ︶
1，相邻两同学为一组分别在浏览器中打开两个不同的网页作品相互欣赏
资料
评价，同时准备回答：
问题1：这两个网页有什么不同？你认为哪个更好一些？为什么？ 2，在Dreamweaver中打开该网页并逐一删除页面元素同时继续提问： 留在页面上的是什么？ 1，回答问题1 带着问题2观察老师的操作
2，回忆Word中表格的插入方法及技巧
我以“诱思探究导学法”为指导思想,主要体现“诱”和“导”两个环节。首先是“诱疑”使学生“生疑”；然后要“导向”，比如这里教师的操作：在Dreamweaver中删除页中的页面元素后出现的表格，让学生的思维沿着正确方向发展，最终达到“释疑”的目的。2 分 钟
点评：“诱思探究导学法”一句话，诱发思维动机，导正思维航向。这是突现教师基本功的地方，要“诱”得巧，“导”得妙。
资料
新
课
学习
资料
新
课
学习
布置 任务 ⌒ 教
资料
师 监 控 ︶
[任务1]能根据资源网的指导学会表中表的使用，并完成本节的例题的表格制作。（必做题）
[任务2]能在布局的基础上插入图片及文字，完成一个如例题的简单网页制作。（提高题）
[任务3]能通过属性的设计美化网页。（先做题）1，学生可根据自己的具体情况选择合适的任务。2，各组长明确任务。
在任务设计时我注意到这样两个因素；一是：为了一切学生，在设置任务时要充分考虑到学生的个别差异。体现分层教学的重要性。二是：以探索问题来引动和维持学习者学习的兴趣和动机。2 分 钟 学 法 指 导 ⌒
资料
教 师 监 控 ︶
指导学生带着“任务”中的问题，利用教师准备的学习资源网自主学习，探索交流,小组互助，“助教”指导,量力而行完成操作任务。1，明确学习资源的使用方法，采取各种方法完成任务
利用教学资源自主学习及优生做好“助教”的角色互帮互学，既能激发他们的学习积极性，给他们一个锻炼成长的机会，又能使更多的学生得到帮助，有利于全面提高学生动手动脑的能力，体现“因材施教”。1 分 钟
点评：这两部分的目的在于
一、体现分层教学的重要性。
二、培养学生养成由简到繁、由易到难、循序渐进地解决问题的好习惯，同时学生之间的以教促教，以教帮教，以教带教的方法有利于学生的全面发展。师
生
资料
互
动
1，寻找学生在完成任务中会遇到第一个问题：“表格线互扰问题”并及时以该问题为切入点将学生的思维引入到本节的重点内容--表中表的使用。2，引导学生发现例子中的新问题—各部分表格线的差异，将本节的内容推向另一个热点。
1，学生掌握表中表的使用方法
2，完成任务
3，注意到表格属性的功能。
我是这样设计本部分内容将重点放在以下两个方面：
第一、在本节课师生以“任务”为主线，在学生不断地发现问题，教师及时地鼓励准确地导向，调控学生主动地探究，利用各种方法例如：教师搭建的网上学习资源，平时建立的小组协作关系等去想办法解决问题。25 分钟 师
生
资料
互
动
3，评价小结是本节课的一个高潮部分。此时教师重点由上面技术点的引导转到学生心理素质及与人交往能力的导向上。这一点其实比单纯的学会上面的技术更为重要。在学生的自评中引导学生客观评价自己。不能过分谦虚而失去在同学们面前表现自己才干的机会又不能过分张扬引起同学们的反感影响自己的形象。
4，由学生推选代表主持评价以调动学生积极参与评价的积极性 第二、充分利用评价方式对学生的激励作用一改过去由教师为权威做法。此时，教师把主动权交给学生，使他们更具参与意识引发学习的主动性，学会正确地、善意地、艺术地评价他人和自己。从中学到做人的道理。12 分
钟
点评：让学生带着真实的任务学习，这是任务驱动的精髓。这一部分是本节的重要内容，也是教学设计的一个难点。是对教师综合运用“任务驱动—体验探究”；“分层教学”“表扬激励”等教学方法能力、如何引导学生选择确实可行的学习方法能力的考验。同时，通过评价的过程，潜移默化地巩固知识，提高解决问题、评判是否的能力。
资料
知识迁移 学生活动
[问题1]用表格布局有什么优缺点，还有好方法吗？ [问题2]在网络资源中是否有其它的方法呢？ 采用小组形式讨论
这里的想法主要是培养学生学会反思。3分钟
点评：为学有余力的学生创造继续发展的广阔天空，激发他们的兴趣，培养他们的创新精神。
课后反思： 成功的地方：
（1）课题引入时以诱发学生的思维动机，导正思维航向为目的，为学生的自主学习打下基础。
（2）学习资源网站、小组互助、助教帮忙等形式为学生的自主学习创造了条件对培养学生养成由简到繁、由易到难、循序渐 进地解决问题的好习惯起到积极的促进作用。
（3）评价方式的改革可达到引导学生客观评价自己不能过分谦虚而失去在同学们面前表现自己才干的机会又不能过分张扬引起同学们的反感影响自己的形象。在互评、点评中要引导学生正确看待别人对自己的评价学会宽以等人；学会巧妙地运用语言艺术对存在问题的同学提出批评。同时通过点评，互评各自的作品，巩固本节的知识点，达到强调重点，攻破难
资料
点的目的。
存在问题的地方：评价方式仍需大胆地放手，让评价的形式更加多样化，民主化。可充分发挥学生的主动作用让他们去设计评价手段、评价量表等，这对于主体作用的体现及学生的创造性思维的发展都会产生积极的影响。
网络
本节小结：由小组总结提交 结束 教师活动：
1． 分组欣赏网页作品。
2． 教师操作演示在网页中删除元素从而引入表格布局的方法。设计思想
通过教师的诱和导达到诱发思维动机，导正思维航向的目的。教师监控： 1。布置学习任务。
2．对学生进行学法指导。使用学习资源、小组互助、助教帮忙。
设计思想
1.创造开放式的教学环境，学生为主体，体验为红线，鼓励他们积极动脑、动手完成任务。2.教师的适时演示体现诱思探究法的思想宗诣。3.利用小
资料
组互助以教促教，以教帮教，以教带教的方法有利于学生的全面发展。设计思想
通过评价的过程正确地、善意地、艺术地评价他人和自己。教会学生学会做人的道理。网络
教师监控：小组互评及个案点评相结合强调难点，深化主题 开始
学生利用学习资源网站自主学习、探索交流、找出难点、小组互助，完成任务，深化主题。
教师寻找典型案例1表格线的互扰问题引出本节的重点表中表。典型案例2表格线的粗细问题引出难点属性问题
教师：提出问题1及问题2 设计思想 培养学
（二）教学过程流程图
第三篇：Dreamweaver网页设计教学计划
《Dreamweaver网页设计》教学方案
第一部分 说明
1．课程的性质与任务
“Dreamweaver网页设计”是计算机网络技术专业（专科）的一门统设必修课。本课程的主要任务是介绍利用Dreamweaver开发工具进行网页设计，包括新建、编辑和设置一个Web站点；如何对页面属性进行基本的设置，如何设置、编辑CSS层叠式样式表；如何排版文字、表格和层；如何进行基本的图像处理；建立框架；模板和库的使用和编辑；网站的发布与维护等基本知识与应用。目的是通过本课程的学习，培养学生的实际动手能力和计算机的操作能力，能够运用所学的知识进行网页设计。
2．与相关课程的衔接、配合、分工
先修课程：计算机应用基础Photoshop图像处理等。
后续课程：Flash动画制作等。
３．课程的教学基本要求
本课程要求学生掌握基本的HTML语言。学会使用Dreamweaver开发工具进行网页设计。这是一门重在实践的科目，因此需要学生多上机、多进行实际操作，把老师所教授的各种网页制作、版面设计以及程序熟练制作或调试出来，并且能够在此基础上有所创造、有更进一步的发挥。
4．课程教学要求的层次
1．掌握：
要求学生能够全面掌握所学内容，并能够用其分析、应用与Dreamweaver网页设计相关的问题，能够举一反三。
2．理解：
要求学生能够较好地理解与Dreamweaver网页设计相关的问题，并且能够进行简单分析和判断。
3．了解：
要求学生能够一般地了解的所学内容。第二部分 媒体使用与教学过程建议
学时分配
课程教学总学时90学时，5学分。其中授课36学时，实训54学时。
2．多种媒体教材的总体说明
1．本课程文字教材为合一型教材，文字教材作为学习的主要媒体，着重反映课程的基本知识和针对性、应用性，在形式上要便于自学。在内容上包括基本理论知识讲解和实训两部分。
2．视频媒体配合文字教材的讲授，内容重点在于实训及辅导。
3．CAI课件作为网络教学媒体，可以在互连网上使用也可以单机使用。
3．教学环节
以主教材讲授为主，其它媒体作为辅助教学资源，以学生自学为主。
4．主要教学媒体的使用与学时分配
内容
序号 1 2 3 4 5 6 7 8 9 10 11 12 13 14
第1章 Dreamweaver基础
第2章 网页设计语言基础
第3章 文本和图像处理
第4章 表格与页面布局
第5章 创建超级链接
第6章 层与层动画
第7章 框架与框架网页
第8章 创建ＣＳＳ样式表
第9章 资源、模板和库
第10章 媒体对象的应用
第11章 表单处理
第12章 创建Web站点
第13章 制作动态网站
第14章 网站的维护和上传
2学时 3学时 3学时 3学时 2学时 3学时 2学时 3学时 2学时 3学时 3学时 2学时 3学时 2学时
教学内容 理论学时
合计
36学时
第三部分 教学内容和教学要求
第1章 Dreamweaver基础（2学时）
教学内容：
Dreamweaver 的历史和简介
Dreamweaver 的安装过程
Dreamweaver 的全新界面
改进的设计与开发环境
主菜单介绍
对象控制面板介绍
教学要求：
掌握：Dreamweaver的基本特点、新增功能及界面组成。基本操作，如安装、新建、打开、导入、保存、关闭等。
理解：新增功能、界面组成的优点。
了解：Dreamweaver可以为我们做些什么。
第2章 网页设计语言基础（3学时）
教学内容：
HTML及XHTML语言介绍
常用的网页语法标记
教学要求：
理解：HTML及XHTML语言介绍，常用的网页语法标记
第3章 文本和图像处理（3学时）
教学内容：
文本属性面板
编辑文本和插入对象
设置文本的格式
编号与项目符号
在网页中插入图像
图像的应用
教学要求：
掌握：设置文本属性和格式；编号与项目符号的使用；插入、编辑和排版图像。
理解：如何进行图像调整。
第4章 表格与页面布局
教学内容：
表格的基本操作
单元格的基本操作
表格的自动套用格式
表格的创建
表格的编辑
创建布局单元和表格
教学要求：
掌握：如何插入、编辑表格，创建布局单元和表格。
理解：表格在网页排版中的作用。
了解：使用页面布局模式进行网页排版的方法。
第5章 创建超级链接（2学时）
教学内容：
（3学时）
链接分类
创建超级链接
链接的四种状态
创建Email链接
管理超级链接
教学要求：
掌握：创建超级链接和Email链接，会设置链接的各种状态。
理解：超级链接几种状态之间的差别和共同点。
了解：创建Email链接中的各种技巧。
第6章 层与层动画（3学时）
教学内容：
层的概念
创建层
层操作
层与表格的相互转换
层动画的概念与设计
教学要求：
掌握：层的概念与使用
理解：层动画的概念与设计
第7章 框架与框架网页（2学时）
教学内容：
框架的基本概念
创建框架和框架集
框架的使用
框架和框架集的属性设置
教学要求：
掌握：框架和框架集的创建；框架的使用。
理解：使用框架的优缺点。
第8章 创建ＣＳＳ样式表（3学时）
教学内容：
CSS层叠式样式表
定义CSS样式表
创建并链接到外部CSS样式
设置CSS样式的格式化参数
设置超链接显示状态
添加各种ＣＳＳ效果
教学要求：
掌握：内部ＣＳＳ和外部ＣＳＳ的添加方法，编辑ＣＳＳ属性，使用ＣＳＳ进行页面的排版，创建各种ＣＳＳ效果。
理解：使用CSS排版的优点。
了解：如何使用ＣＳＳ控制背景、鼠标以及添加其它特殊效果。
第9章 资源、模板和库（2学时）
教学内容：
资源管理
模板的创建
模板的编辑
定义模板可编辑区域
创建，管理和编辑库项目
教学要求：
掌握：模板的创建，模板的编辑，定义模板可编辑区域
理解：资源管理
了解：创建，管理和编辑库项目
第10章 媒体对象的应用（3学时）
教学内容：
插入Flash对象
插入Shockwave对象
插入视频
插入ActiveX控件与Java小程序
填加声音
教学要求：
掌握：插入Flash对象、插入Shockwave对象、插入视频、插入ActiveX控件与Java小程序、填加声音
第11章 表单处理（3学时）
教学内容：
表单概述
表单对象
创建表单
处理表单
创建动态表单
教学要求：
掌握：创建表单、处理表单和设置表单参数。
理解：表单的概念和作用。
了解：如何使用表单创建交互式界面。
第12章 创建Web站点（2学时）
教学内容：
站点规划
在Dreamweaver8中创建站点
管理站点与站点文件
使用站点地图
为网站指定服务器技术
教学要求：
掌握：规划站点、建立和管理站点；使用站点文件和地图。
理解：创建站点的必要性。
了解：服务器技术的指定。
第13章 制作动态网站（3学时）
教学内容：
Access数据库基础
ODBC数据源设置
ASP与Web服务器配置
Dreamweaver8动态网站设计
创建与数据库连接
教学要求：
掌握：数据源的设置，如何配置Web服务器，如何创建与数据库的链接。
理解：数据库在动态网站设计中角色的重要性。
了解：设置数据源和创建数据库链接的技巧
第14章 网站的维护和上传（2学时）
教学内容：
在本机中测试网站
预览网页效果
网站的查错
发布网站到服务器
教学要求：
掌握：Dreamweaver8的测试、预览和发布设置。
理解：网站排错的必要性。
了解：如何发布网站到服务器。
实训内容
（实训分为必做和选做内容，可根据实际的实验条件选做。实验总计54学时）
实训1：建立Web网页（必做）
实训2：文本及其格式化（必做）
实训3：图像（必做）
实训4：超级链接（必做）
实训5：表格和页面布局（必做）
实训6：框架（必做）
实训7：层（必做）
实训8：模板与库（必做）
实训9：表 单（必做）
实训10：行 为（必做）
实训11：多媒体组件的插入、使用代码设计网页与站点管理（必做）实验12： 动态网站制作（选做）
实验13：ASP与SQL Server数据库相连（选做）
第四篇：Dreamweaver网页设计实验报告
实验报告
专业
XXXXXX
班级
XX 班
学号
XXXXXX
姓名
XXX
报告完成日期
2012-12-26
指导教师
XXX
评语：
成绩：
批阅教师签名：
批阅时间：
一、制作时间
2012年12月18日至2012年12月26日。
二、实习内容
1、使用Dreamweaver制作网站，该网站为福建工程学院网站
2、网站不少于8个页面，主页和各模块相关页面；
3、页面中包含文字、图片；
4、使用CSS实现网页相关页面设置，要求在实现网页内能够显示文字，图片等信息；
5、使用网页浏览器进行网站测试。
三、实习环境
1、硬件环境：计算机一台；
2、软件环境：Dreamweaver cs4；
3、测试环境：IE、firework等网页浏览器。
四、网站总体设计
1、网站主题
本网页是以福建工程学院网站为主题，针对不同的年龄阶段的人给出了不同的学院的信息。
2、设计思路
首先构思了基本网页的布局，主页采取了常用的1-（1+1+1），附页采用了1-（1+1），上了多个网 最后决定参照福建工程学院的官方网站进行制作，但是布局并不相同 素材取自福建工程学院官方网站，部分图片取自百度，网站包括1个主页7个子页，子页包含了所有的学校状况，分别为：学校简介、现任校领导、教学机构、管理机构、校纪校训校歌、校园风光、新校区建设；采用了较难的二级菜单 和 JVAV技术实现导航栏上面的图片进行4张轮播。
五、制作步骤
1.首先确定网页的主题后，从网上查看各名校的网站，并从中寻找思路开始做网页。经过长时间的浏览，最终选择福建工程学院作为参照（网址：http://www.xiexiebang.com）
2.受福建工程学院主页的影响我自学了图片轮播和二级菜单，从而制作了轮播图片和二级菜单。
3.由于对于JVAV和表单的知识并不是非常了解所以有些地方需要实现的实现不出来放弃了，期中研究了最久的就是 导航轮播和下面的有块区域的图片轮播，结果因为不知道如何同时初始化2个JVAV函数 最后以失败告终 只好放弃
4.本次制作最难的地方是导航菜单的二级菜单和图片轮换
在制作过程中，遇到很多次的制作混乱，最后还是老师帮忙解决的。
5.原计划那些JVAV代码因为无法同时初始化他们放弃了 只好以一些列表代替
6.最后，将一些小细节的东西做了些处理，最后打包上交。
六、实习总结
这次是我们web的期末考试制作，通过这一次的制作，不仅巩固了以前学过的知识，还学会很多课堂上未教授的东西。通过老师的讲解、查阅资料，解决了很多制作上的困难，这一点我在这要好好感谢我们的XX老师和我们宿舍的学姐，谢谢她们帮我很大的忙。
七、参考文献
《HTML+CSS网页设计与布局》 《PHP编码》
第五篇：Dreamweaver网页设计+授课教案
Dreamweaver教案一(一课时)
教学目的：初步了解Dreamweaver的操作
教学重点：Dreamweaver的界面
教学难点：各个面板的调用
一、引入
为什么要用Dreamweaver而不用Frontpage？
Dreamweaver是Macromedia公司的出品，它以程序小、运行速度快、所制作网页代码少这些优点，赢得了网页制作人员的喜爱。
例一：m1.htm和f1.htm的大小比较
例二：frontpage安装程序和dreamweaver安装程序的大小比较
例三：frontpage运行和dreamweaver启动比较
二、Dreamweaver的安装
三、Dreamweaver的界面
1．文档窗口：主菜单、工具栏、底部启动条、文档编辑区
2．对象面板：标准、表格、表单、框架、特殊、文件头、隐藏、字符
3．启动面板：站点管理、代码检查、HTML样式、CSS样式、行为、历史记录、资源管理
4．属性面板：随目前对象不同而内容不同
四、作业
1．写出Dreamweaver对象界面中所有对象的名称
2．新建一个空白网页，写出空白网页的HTML代码
Dreamweaver教案二(一课时)
教学目的：回忆原来学过的网页的文字知识，熟悉 Dreamweaver的操作，熟悉属性面板的 1
使用，掌握页面属性、文本属性的设置
教学难点：向导图片、预格式化、图片的路径
教学重点：常用属性
一、复习引入
1．输入文本
2．回车键的作用
3．如何输入换行符：Shift+ENTER，或者是对象面板à符号
4．换行符对应的HTML标记
二、设置页面属性
1．打开页面属性对话框：右击页面，选择页面属性（page properties）
2．设置标题显示（Title）：
3．设置页面背景（Background image）：选择背景图像，注意路径
4．设置背景颜色Background：
5．设置本页面中文字的颜色Text：在没有设置其它的字体颜色前，这个文字颜色发生作用，一 旦对具体的文字设置颜色，这个设置就不起作用了
6．设置链接的各种颜色（Visited Links、Active Links、Links）
7．设置页面边界（Left Top）：使内容与边框没有空隙
8．设置文档字符集（Document Encoding）：gb2312
9．设置向导图片（Tracing Image）：用于设计时，下面的滑动条用于设置这个图片的透明度（Transparent）
三、设置文本属性
1．格式（Format）：
（1）样式：段落（Paragraph），标题（Heading1）、„„预先格式化的（preformatted）
*预先格式化的：可以输入空格，可以按文本原来的样子排列，缺点是不能实现自动换行
（2）字体：Default Font
（3）大小：Size
（4）颜色：
（5）其它：加粗、倾斜
（6）对齐：
2．链接（Link）：链接到文件，链接到地址，*相关（Relate to）：文档（Document），站根目录（SiteRoot）
3．目标（Target）：打开链接的目标_blank、_self、_parent、_top
4．项目符号、编号和缩进
四、作业
根据示例网页，制作一个网页
Dreamweaver 教案三(两课时)
教学目的：掌握网页中图片的相关操作
教学重点：dreamweaver中设置图片的属性
教学难点： 图像处理软件的使用
一、复习引入 1．网页的页面背景颜色和文本颜色在HTML代码中是如何表示的？
RGB方式表示颜色：红绿兰，0表示最弱，255表示最强 一共可以表示：256╳256╳256=16777216种 颜色 由于浏览器的关系，只有216种颜色能在浏览器中正常显示，多于这个范围的颜色，有的浏览器显 示时就可能发生偏差，不能正常显示。这个范围我们称之为网页安全颜色范畴 2．网页中运用颜色原则l 切忌采用过多的颜色；
l 背景颜色不要太深；
l 要保持整个网页的色调统一；
l 要围绕网页主题选择颜色
二、网页中的图像格式 *BMP：位图格式 1． GIF：Graphics Interchange Format可交换的图像格式 特点： l 只支持256种颜色 l 支持透明效果 l 可以交错下载 l 可以实现动画效果 l 文件所占用空间小 l 不能支持渐变色彩 l 更改图片大小要从原文件改起 2． JPEG：Joint Photographic Experts Group联合摄影专家组文件格式 特点： l 支持24位图像 l 有损压缩 3． GIF与JPEG比较
三、插入图像 1． 插入图像：InsertàImage；对象面板 2． 图像 属性： l 宽（W）高（H）：默认为图片的大小，可以设置 其它尺寸，但图片会变形 l 源文件（Src）： l 对齐（align）： l 链接（Link）：链接到的图片 l 替代（Alt）：图像注释，当浏览器不能正常显 示图片时所出现的文字提示 l 地图（Map）：制作映射图 l 垂直边距（V space）：与上边界的距离 l 水平边距（H space）与左边界的距离 l 目标（Target）：当链接项有设置时发生作用 l 低品质源（Low Src）：低分辨率副本文件 l 边框（Border）： l 编辑（Edit）：启动图像处理软件来对图像进行 编辑 l 重设大小（Reset size）：当用其它工具修改了 图片大小时，如果不重设图片的大小，则会变形或者在不小心改变了图片的大小时使用此项
四、使用图 像处理软件
1、转换图像格式：打开，另存为
2、更改图像尺寸：
3、更改图像品质：另存为
五、作业 l 下列文件均放于同一文件夹下： 1． 在网上寻找透明背景的GIF图片5张，JPEG图片5张，其中，GIF要有动画的至少一张，JPEG要有一 张风景的。2． 将找到的图片放置在背景为蓝色的页面上 3． 改变第一 张GIF图片的大小 4． 设置第二张GIF图片的替代文字为“试一试” 5． 设 置第三张GIF图片的链接为第三张JPEG图片 6． 设置第四张GIF图片的垂直边距为5，水平边距为9 7． 对第一张JPEG图片设置映射4个，分别链接到第二、三、四、五张JPEG图片 8． 运用图像处理软件，制作风景JPEG图片的低品质图片，并对网页中该风景图片设置低 品质源 l 不看电脑，写出下列RGB值对应什么颜色 #FF000 #00FF00 #0000FF #FFFF00 #FF00FF #00FFFF
Dreamweaver教案四(三课时)
教学目的：掌握dreamweaver中表格的应用 教学难点：表格对应的HTML代码
教学重点：表格的编辑
一、复习引入
1． 文字的定位：空 格、回车
2． 图片的定位：垂 直边距、水平边距
二、表格
1． 插入表格：插入（Insert）à表格（table），或者在对象面板
2． 行数（row）
3． 列数（column）
4． 边距（cell padding）：单元格中的内容与单元格边框之间的距离
5． 间距（cell spacing）：单元格之间的距离
6． 宽度（width）：可以是像素（pixel）或百分比为单位（percent）
7． 边框（boder）：
8． 属性面板：只有 在选定整个表格时才出现表格属性
9． 在表格中也可以 通过右击，调出的快捷菜单中选择表格来对表格进行设置
10． 清除行高和列宽按钮
11． 改变列宽单位按钮
12． 背景颜色：
13． 边框颜色：设置整个表格的格线颜色
14． 背景图像：
三、表格所对应的HTML代码
1．表格：
2．行：
3．列：
四、选定
1． 单击表格左上角 或边框线
2． 在表格内单击表 格任一处，右击，选择表格（table）à选定表格（select table）
3． 选择所有单元格
4． 在文档窗口的左 下角选择标记
5． 选定行
6． 选定单元格
五、表格的编辑
1． 表格的嵌套
在网页中，要进行复杂的定位，一般需要用到嵌套表格。不过，一般不超过三层。
2． 复制剪切粘贴
3． 插入行、列，删 除行列
4． 合并单元格，拆 分单元格
5． 改变行、列、表 格的大小：拖放，属性面板精确定义
6． 表格模板：命令（command）à格式化表格（format table）
六、导入表格数据
1． 文件导入导入表格数据
2． 数据文件
3． 定界符
4． 表格宽度
5． 单元格边距和间距
6． 格式化首行
7． 边框
七、学习网页制作的方法
1． 学习网页制作，要先模仿
2． 在浏览到合适的 网页时，用“另存为”保存，再用dreamweaver来打开
八、作业
1． 将数据文件1.txt转为表格
2． 模仿此页制作页面
Dreamweaver教案五(两课时)
教学目的： 掌握框架
教学难点： 框架的编辑
教学重点： 框架的HTML代码
一、复习引入
回忆：Frontpage中的框架应用
二、框架的应用
1． 重复出现在不同 网页文档中的元素：网页标题、导航栏等等
三、建立框架
1． 将对象面板切换 到框架页（Frame）
2． 插入不同的框架，一个区域对应于一个页面
3． 在框架中打开原 有网页：文件（File）à在框架中打开（Open in Frame）
四、保存框架
1． 选择文件（File）/保存所有框架（Save Frameset），先保存框架文件，接着会出现提示，逐个保存框架中的网页
2． 保存时注意名称
五、框架编辑
1． 框架面板：窗口（Windows）à其它（Other）à框架（Frame）调出框架面板
2． 选定框架组：单 击整个框架组的边框；或在框架面板中单击整个框架的边框
3． 框架属性：名称、源文件，滚动否，是否可以调整大小，是否有边框，边框颜色，边界宽度，边界高度等
4． 拆分框架：按 Alt键，拖动边框；修改（Modify）à框架页（Frameset）à拆分左/右/上/下（split frame top/bottom/left/right）
*注意区别：插入一个新的框架与拆分框架的区别
5． 链接打开的目标
六、框架所对应的HTML代码
1． 框架组：
2． 通过设置：rows 或cols来设定是横的还是竖的，是顶部还是底部
3． 框架组属性： frameborder框架是否有边框，border边框的宽度多少，framespacing框架间距
4． 框架项：
5． 框架属性：src 指向的页面，name框架名，scrolling是否有滚动条，noresize不能由用户改变大小
6． 无框架提示