项目二
网页制作基础
【项目描述】
中文版Dreamweaver8是目前比较流行的网页制作工具。
本项目主要介绍中文版Dreamweaver8的工作窗口及使用方法，以及HTML的基本结构。
【教学目标】
1.安装Dreamweaver8，介绍其工作窗口及使用方法。
2.学会定义本地站点，并讲解规划站点结构的原则，在站点中搭建模拟结构。
3.Html代码的基本结构。
【项目分配】
任务一认识Dreamweaver8。
（1课时）
任务二创建本地站点，搭建模拟结构。
（2课时）
任务三html代码的基本结构。
（2课时）
任务一：认识Dreamweaver8（1课时）
一、教材分析：
中文版dreamweaver8是目前比较流行的网页制作工具。
主要介绍中文版dreamweaver8的工作窗口以及其使用方法
二、学情分析：
本班学生都是刚接触到dreamweaver8，对于本节课知识兴趣浓厚，学习积极性高。
三、教学目标：
知识目标：初步了解中文版dreamweaver8的工作窗口、工具栏、文档窗口、浮动面板、菜单和辅助设计工具。
情感目标：通过本节课的学习使学生掌握知识的同时，提高他们的自学能力。
能力目标：通过本节课的学习培养学生动手操作能力。
四、教学重点
掌握中文版dreamweaver8的8的工作窗口、工具栏、文档窗口、浮动面板、菜单和辅助设计工具、属性面板和浮动面板显示及使用。
五、教学难点
快捷工具栏的显示及组成、使用，浮动面板的显示与隐藏菜单和辅助设计工具的作用教学方法与过程：
（一）导入新课：提问学生对网站的了解，internet网与我们生活的联系及重要性。
引发学生思考，带着颖问进入教学课题。
（二）揭示课题：网站大部分都是由Dreamweaver8 制作出来的这节课我们就来“认识Dreamweaver8”
（三）教师演示：
1.启动Dreamweaver8从开始菜单启动，出现工作区设置对话框，选择设计器工作区。
设计器是标准的工作区。
2.Dreamweaver8工作界面认识Dreamweaver8工作界面，对掌握和提高制作效率是关键的一步。
（1）标题栏：左侧有网页标题，所在位置及文件名称，右侧有最小化，最大化
和关闭。
（2）菜单栏：有“文件”、“编辑”、“查看”、“插入”、“修改”、“文本”、“命令”、“站点”、“窗口”、“帮助”。
（3）快捷工具栏：选择“查看”中的“工具栏”，勾选“插入”、“文档”、“标准”三项，完整的快捷工具栏就显示出来。
3.网页编辑窗口快捷工具栏下面的区域就是“网页编辑区域”。
在启动Dreamweaver8
时将显示一个“起始页”，包括“打开最近项目”、“创建新项目”、“从范例创建”三个方便实用的项目。
可以勾选“不再显示此对话框”使它隐藏。
用户可以在文档区域中进行输入文字，插入表格和编辑图片等操作。
4.属性面板网页设计中的对象都有各自的属性，属性面板的设置项目会根据对象不同而
变化。
5.浮动面板根据面板的特性命名，浮动于编辑窗口之外。
在窗口菜单中单击不同的命令
可以打开不同的面板。
在“窗口”中选择“排列面板”能够整齐地摆放在屏幕上，按F4可以隐藏和显示面板。
3
1.
2.在站点定义对话框中根据向导一步步操作，“输入网站名称”“是否使作服务器技
术”、“选择编辑方式（编辑网页的本地副本，完成后上传。
或使用本地网络直接在服务器上进行编辑。
）”、选“存储位置”、“配置远程站点（选无，网站建设完成后再FTP上传。
）”完成设置，在“文件”面板中显示出刚建立的站点。
（四）管理本地站点通常，dreamweaver8站点管理器都要对多个网站进行管理，这就需要专门的工具来完成站点的切换，添加、删除等操作，打开“文件”面板，在下拉菜单中选“管理站点”，可打开多站点管理面板。
用dreamweaver8编辑网页或进行网站管理时，每次只能操作一个站点，可选其它站点切换操作编辑。
在管理站点中，可复制站点，删除站点（文件保存在硬盘上不会被删），可导入，导出（导出为一个XML文件。
）
任务三 html代码的基本结构
（2课时）
一、【教学目标】
知识目标：介绍html网页的编写方法，介绍网页命名规则和html代码的基本结构。
技能目标：掌握html代码的基本结构后，能在Dreamweaver8的“代码”面板，建立第一个网页页面。
情感目标：通过本次学习后，能培养学生对网页制作软件的进一步了解，增强学生学习网页设计的兴趣和欲望，熟知网页制作软件给我们设计网页带来的便捷。
二、【教学重点】
1．Html的基本概念。
2．html网页的编写方法。
3. 建立第一个网页页面。
三、【教学难点】
html网页的编写方法。
四、【教学过程】
（一）明确项目任务（包括了导入项目任务和布置项目任务）
上节课，我们学习了创建本地站点、搭建模拟结构，我们先一起在Dreamweaver中搭建起我们的站点结构。
结构搭建好了，我们今天就一起来做网页吧！
（二）制定项目实施计划（项目实施）
1．教师讲解示范：在桌面上展示一张简单网页，查看其源代码，和学生一起来分析，看看能发现什么问题。
引出我们html代码的写法。
详细介绍网页命名规则和html代码编写规则。
2．学生活动：学生小组讨论，分析源代码的特点。
教师做好对学生的辅导检查，对做的好的学生给予鼓励。
3．教师讲解示范：制作一张简单网页。
在Dreamweaver中创建一张网页：“文件”---“新建”--“html”，在“代码”面板逐个讲解<html><head><body>作用功能，完成第一张网页。
4．学生活动：请一个小组上台演示，完成第一张网页,保存网页，在浏览器预览网页。
教师做好对学生的辅导检查，对做的好的学生给予鼓励。
5．教师讲解示范：为网页添加标题。
观察浏览器中显示出标题，引出<head>中的<title>标识，在“拆分”版面对比讲解，为网页添加标题。
完成一张完整的网页。
6．学生活动：教师演示完步骤后交由学生完成，教师做好对学生的辅导检查，对做的好的学生给予鼓励。
五、【练习巩固发展】
完成课本45页习题2，填空题的1至4。
六、【评价与反思】
Html学习起来和枯燥，我们班上的学生又比较喜欢自己动手操作，所以在第一节接触html代码的课程中，我尽量安排少一点内容，并多与学生互动，多在实际操作。
七、【学生作业及上交】
未布置作业。
7。