《网设计与制作教案》由会员分享，可在线阅读，更多相关《网设计与制作教案（5页珍藏版）》请在金锄头文库上搜索。
1、授课周次第2周授课时间年 月 日至 年 月 日课程章节第1次课：创建、规划站点第2次课：管理站点教学目的第1次课：掌握利用Dreamweaver CS6 软件创建站点的方法第2次课：熟练站点管理的各项操作技能内容提要 及板书设计第1次课： 1.网站站点的分类；2.网站站点的制作流程；3.利用Dreamweaver cs6创建站点；第2次课： 1.网站的组织结构；2.站点管理的技能；3.站点内容管理的技能；重点、难点 及解决方案第1次课： 重点：了解网站制作流程；掌握建立站点和测试站点的技能难点：创建本地站点解决方案：学做合一，实践任务第2次课： 重点：理解管理本地站点的作用；掌握站点管理和站点
2、内容管理的技能难点：站点内文件和文件夹的管理操作解决方案：学做合一，实践任务教学内容 时间分配序号教 学 内 容学时分配1创建、规划站点902管理站点90345教学手段第1次课：多媒体教学第2次课：多媒体教学教学形式（在右栏勾选）理实一体（）理论教学（ ）实验（ ）实训（ ） 上机（）作业作业完成方式书面（ ）电子（）教学后记第1次课：第2次课：附页：序号具体内容（课堂组织和教学过程设计）授课改进意见及实时教学效果记录测试站点第一次课 创建、规划站点第一步，问题导入（10分钟）以问题“大家已经知道了网页是放在网站里的，那么网站站点是怎么建立的呢？网站作为网页的内容集合体，在创建初期需要进行合理
3、布局和规划吗？前面所介绍的Dreamweaver软件可以用来创建站点吗？可以的话，该如何做呢？”为引入，与学生互动，引出本节课内容。第二步，知识讲解（35分钟）知识讲解要点如下：一、站点也称“网站”，用来定位网站上的所有文件，是一系列通过超链接而相互联系的网页集合。包括3类 ：远程站点本地站点二、本地站点的制作流程1.规划站点。2.素材准备。3.用网站编辑软件创建站点。4.制作WEB页面。5.测试站点。6.上传发布站点。 三、新建本地站点网站的站点，好似一个班级，应该首先为班级起一个名称，并配备一个班主任，然后再陆续的加入一些学生。这其实就是我们站点创建时应该为站点起一个名字，并设置一个首页，
4、增加更多的超链接。 1、利用Dreamweaver软件建立一个本地站点的操作步骤 Step1：打开Dreamweaver cs6 软件，在菜单栏中选择“站点”或利用快捷按钮ALT+S打开站点菜单栏。 Step2：点击“新建站点”或按键盘“”键打开“站点设置对象”面板。在“站点名称”栏输入站点的名称，中、英文名称都可以。接着在“本地站点文件夹”栏输入用户为新建的站点预先准备好的文件夹路径（如左图 所示），也可以点击该栏右边的文件夹形状图标，选择站点的根目录文件夹（如右图所示）。站点目录文件夹最好是英文命名的。 Step 3：点击“站点设置对象”面板右下角的“保存”按钮，完成本地站点的创建。Ste
5、p 4：站点创建信息保存完毕后就可以在Dreamweaver软件的右下角看到本地站点的“文件”面板视图了，包括站点的名称，站点文件夹内的子文件夹等信息。 2、利用DW创建本地站点的优点。3、建立站点注意问题： （1）用文件夹进行分类存储：如网页文件存放在html文件夹中，图像文件存放在images文件夹中。嵌套文件夹的层数不要太多，最多不超过三层，否则超链接时会出错。 （2）文件命名要合理：建议全部使用小写的文件名称，不要用中文文件名。文件夹的名称最好用顾名思义的英文，方便以后修改维护。文件名也要符合规范，比如首页一般命名为index.html或default.html。四、站点目录站点的目录
6、是指在建立网站时创建的文件目录。这个目录的主要功能是管理和存储网站的所有文件，这些文件包括网页文件、图片文件、音视频文件和服务器端处理程序等。 五、目录结构设计原则1.不要将所有文件都存放在根目录下。（避免文件管理混乱，上传速度慢） 2.按栏目内容建立子目录。 3.在每个主目录下都建立独立的images目录。 4.目录的层次不要太深。 （目录下一级层次结构建议不要超过3层）5.目录内文件夹命名要简洁。1）不要使用中文命名。2）不要使用空格及“、&、*、$ ”等特殊字符命名。3）不要使用过长名称。4）尽量使用意义明确的名称。六、常见网站目录内的文件夹名称Manager、 audio、backup
7、 、css、images、source、video、zip、database 第三步，课堂实践（35分钟）1、利用Dreamweaver软件建立一个属于自己的本地站点。站点名称为自己的姓名，站点内有 images和css两个文件夹。最后将站点“文件”面板截图保存上交。2、请仔细观察以下文件名称，并把它们归类到相应的文件夹内。Top.jpg, logo.png, logout.jsp, body.css, end.flv, toolbar.gifLogin.jsp, title.css, app.zip, news.mov, list.rar, aboutme.rmvb文件夹名称文件名image
8、scssvideozipsource第四步，教师总结（10分钟）总结本次课内容，回顾如何利用DW建立本地站点，强调站点目录的设计原则。第二次课 管理站点第一步：课堂演练（20分钟）结合上次课所学，建立一个简单的个人网站。网站栏目：l 主页indexl 关于我aboutl 相册photol 作品worksl 日志diaryl 留言本message第二步，问题导入（10分钟）引导学生回顾上次课的知识点，以问题“大家知道本地可以建立多个站点，那这些站点和站点里面的文件内容怎么管理呢？”为引入，与学生互动，引出本节课内容。第三步，知识讲解（15分钟）知识讲解要点如下：一、管理本地站点的作用二、Drea
9、mweaver CS6软件“站点管理”界面介绍运行Dreamweaver CS6软件后，在菜单栏中选择“站点”或按快捷键，在下拉菜单中单击“管理站点”或按键，打开“管理站点”对话框。三、本地站点管理操作 主要指站点的创建、复制、编辑、删除、导入和导出等的管理。 四、站点内容管理的作用 五、本地站点内容管理操作- Dreamweaver CS61.创建文件夹 2.创建文件 3.文件或文件夹的移动和复制 4.删除文件或文件夹 第四步，课堂实践（35分钟）1、利用Dreamweaver软件建立一个本地站点，对站点分别进行复制、编辑、导出和删除四项操作，每项操作截一张图保存并上交。2、用Dreamweaver软件建立一个名为“站点文件管理操作”的新站点，在“文件”面板里新建index.html文件和images文件夹，并在images文件夹内新建一个page子文件夹，并把index.html文件复制到该文件夹内。操作完毕后对“文件”面板进行截图并上交。 第五步，教师总结（10分钟）总结本次课的内容，特别是利用Dreamweaver软件进行站点建立和管理过程中应注意的问题。教师查看学生提交的作业，总结本次课堂练习中学生出现的问题，提出在操作中应该注意的事项。
