《《网页制作》教案》由会员分享，可在线阅读，更多相关《《网页制作》教案（99页珍藏版）》请在金锄头文库上搜索。
1、湖 南 省 商 业 技 术 学 院学 期 授 课 进 度 计 划（ 二 年级 第 一 学期）课程名称 网页制作与设计适用班级 16 高 21、22制定教师 易会芝审 批 签 字教研室主任年 月 日教务科长年 月 日教务院长年 月 日2017-2018 学年第 一 学期制定课课 时时 分分 配配其 中授 课周 数周课时授 课总课时讲 课实 验复习考试机 动23期期 末末 完完 成成 情情 况况超 出 或 缺 少 课 时计 划课 时完 成课 时超 出缺 少弥 补教 学 截 至章 节 内 容备注：用蓝黑或碳素墨水钢笔填写教教 学学 计计 划划学情分析学情分析本门课程网页设计与制作的教学班级为 14
2、级计算机班，计算机班对网络知识有一定的了解，基础知识较好，同时根据实际情况，特拟定本计划。大大 纲纲 要要 求求通过本学期网页设计与制作的学习，主要要求同学们掌握网页制作的一些 基本功能和操作，为以后的一些学习和工作打下较好的基础。通过学习要求同学达 到以下要求： 1、了解 DreamweaverCS6 的详细功能及操作方法。 2、熟练掌握网页制作技巧。 3、掌握网页规范以及网页优化和网站推广的知识。 4、明确网站建设的流程和站点建设成后需要做的优化推广工作。教教 学学 重重 点点1、超级链接2、表格表单应用3、框架使用4、CSS 样式教教 学学 难难 点点1、超级链接2、用表格和框架布局页面
3、3、创建数据库教教 学学 方方 法法讲授法、演示法、项目教学法、合作学习、对话、任务驱动法、头脑风暴、小组讨 论法等教学方法。学学 期期 授授 课课 进进 度度 计计 划划 表表周次周次授授 课课 内内 容容课时课时备备 注注31.1 网站基础知识21、2 周新生军训1.2 网站建设概述2实训 新建一个网页2上机42.1 添加和编辑文本2实训 网站素材处理2上机实训 制作简单网页2上机567国庆放假6机动补周一课82.2 添加和编辑图像62.3 创建超级链接2实训 图像处理和创建超级链接2上机9实训 跳转菜单2上机2.4 使用表格布局页面2实训 表格布局实例分析2上机102.5 使用框架布局页
4、面2运动会充周三到周五运动会11实训 框架布局实例分析2上机3.3 添加动画2添加音频和视频212实训 DIV 与表格的转换2上机4.3 晃动的图片2实训 交换图像2上机13实训 拼图游戏2上机4.4 修改属性特效及动态菜单制作2实训 效果行为应用2上机14实训 图片展播实例2上机5.1 认识和编辑 CSS2实训 美化页面2上机15实训 应用 CSS 到网页中2上机5.2 类型、背景和区块样式2实训 方框、边框和导航栏2上机1616实训 超链接样式及设置技巧2上机学学 期期 授授 课课 进进 度度 计计 划划 表表6.1DIV 布局页面26.2 认识 Spry217实训 调整样式2上机6.3
5、选择服务器和使用虚拟机26.4 申请域名218实训 网站发布2上机7.1 个人主页制作27.2 策划构思及设计流程219实训 页面布局2上机7.3 制作页面头部27.4 制作中间表格内容220元旦放假2机动2充周一课22122222复习考试6教研组 意见课题课题1.1 网页制作基础知识教学课时教学课时2 课时知识目标能了解网页制作软件的特点能力目标能掌握网页制作的基本概念教学目标教学目标情感目标提高学生团结合作精神，提高学生竞争意识教学重点教学重点网页的组成教学难点教学难点网页的分类，网址与域名的区分教学资源教学资源1.教学场所：多媒体教室 2.教学设备：安装有 Dreamweaver cs5
6、 软件的计算机 3.教学资料：辅助课件.多媒体教学软件教法教法讲解法、任务驱动教学法学法学法小组讨论法教学过程教学过程课前准备导入新课讲授新课动手实践课堂小结作业布置时间分配时间分配510501555教学过程教学过程过程安排过程安排教学内容教学内容教师活动教师活动 学生活动学生活动设计意图设计意图课前准备1、教师自我介绍； 2、点名； 3、课程介绍 4、课堂要求1.自我介绍 2.按照花名册点 名 3.课程介绍 4.统计学情 5.提出期望与要 求1.班长统计座 次表 2.学生自我介 绍 3.反应学情 4.推荐课代表。使师生尽快互 相认识，并促 使学生答题了 解我们的课程。导入新课本次课是本学期第
7、一次上课，简单 介绍本课程： 1、网页设计相关级别及其薪资待 遇 2、网页设计的就业方向及其公司 类型以提问的方式了 解学生对网页设 计的认知学生之间相互 讨论，加深对 网页设计的认 识提问跟就业和 薪资有关的问 题，抓住学生 注意力。任务一 讲授新课一、网页设计介绍一、网页设计介绍1、网站是企业向用户和网民提供信息（包括产品和服务）的一种方式，是企业开展电子商务的基础设施和信息平台，离开网站去谈电子商务是不可能的。2、企业的网站被称为“网络商标”，也是企业无形资产的组成部分，而网站是Internet上宣传和反映企业形象和文化的重要窗口。二、网页设计的要点网页设计的要点1、明确建站目标和需求。
8、2、网站主题鲜明。3、网站版式设计。4、色彩在网站设计中的作用。5、网站设计形式与内容统一。三、网站设计级别三、网站设计级别1、新手入行2、跳槽阶段3、稳定阶段4、大师阶段四、网页设计公司类型四、网页设计公司类型1、门户游戏类2、企业部门类3、网站建设类4、互动设计类五、网页三剑客五、网页三剑客1、 Dreamweaver：可视化页面设计、网站管理简单介绍网页知 识提问：网页设计 要点并将学生分 组进行讨论讲述网站设计级 别，引导学生对 这个行业向往， 并鼓励学生向大 师阶段努力简单介绍学生将 来从事本行业的 范围介绍网页制作需 要的软件吸收新知识并 思考生活中常 见网页设计知 识分组讨论，并
9、 派出代表来总 结思考自己的定 位了解本行业的 现状认识软件基本 组成讲述基础知识， 为后面学习打 下基础加强学生之间 交流沟通能力， 加深学生对网 页设计要点理 解引导学生了解 这个行业引导学生了解 本行业从事范 围提前引导学生 认识 dreamweaver cs5 为后面软2、 Fireworks页面图象设计工具3、 Flash动画制作六、网页基础知识六、网页基础知识1、网页与网站的区别（1）网页是WWW系统中信息的基本单位，简单来说，就是后缀名为htm的文件。（2）网站是指存放在网络服务器上的完整信息的集合体。2、网页的组成（1）文字：最直接、通用、容易的沟通方式（2）图片：网页的一大特
10、点图文并茂（3）动画：1995年，Sun公司开发了Java语言，用户可以创建能调用图片和声音的多媒体应用小程序（4）超链接：要通过一种方式把各独立的网页整和在一起，使之构成一有机整体，而这种链接页面的功能叫超链接。（5）特殊组件：图片与动画可算是最常见的特殊组件。3、主页Homepage引导访问者浏览网站。index、main、default4、网页空间给学生灌输网页 设计的基本知识做笔记，识记 教师讲述的知 识件学习打下基 础这些知识都是 学网页设计最 基本的基础知 识，学生基础 知识薄弱，必 须了解这些才 能学习后面的 内容在Internet上申请的一个存储空间，用以存放网页。5、网址和域
11、名网址：IP地址域名：与IP地址相对应，唯一性，善于识别最右边：国家（中国cn）其次：机构（商业机构com）再次：子网名称最左边：服务器类别（web服务器www）6、网页的分类静态页面与动态页面7、认识网站门户网站：sina个人网站：明星专业网站：医疗职能网站：政府任务二 动手实践根据网页设计要点，以小组为单位确定一个网站主题，小组讨论需要的步骤以及素材巡回指导，给予 学生帮助小组讨论，相 互沟通加深学生对网 页设计要点学 习课后作业1、 按照课堂分组课后进行讨论 2、 每组确定一个网站主题方向。 3、 每组设计一个网站调查问卷。课堂小结一、网页设计师就业方向二、网站设计流程三、常见网站教学反
12、思本次课是网页设计第一次上课，主要讲述一些网页基础知识，学生基础知识薄弱，需要加强，整体来说计算机班基础知识要好于电子商务班板书一、网页设计介绍二、网页设计的要点三、网站设计级别四、网页设计公司类型五、网页三剑客六、网页基础知识课题课题1.2 网站建设概述教学课时教学课时2 课时知识目标了解做网站的准备工作，掌握站点的建立。能力目标1.能了解网站开发的基本流程。 2.能掌握网站开发的基本原则。 3.能学会站点的建立与管理。教学目标教学目标情感目标提高学生团结合作精神，增强小组合作能力教学重点教学重点站点的建立教学难点教学难点如何规划好一个网站教学资源教学资源1.教学场所：多媒体教室 2.教学设
13、备：安装有 Dreamweaver cs5 软件的计算机 3.教学资料：辅助课件、多媒体教学软件教法教法讲解法、任务驱动教学法学法学法小组讨论法教学过程教学过程过程安排过程安排教学内容教学内容教师活动教师活动 学生活动学生活动设计意图设计意图课前准备1、搜集了解网站开发的基本流程。2、网站设计、制作过程中的一些 原则、注意事项。配合学生搜索资 料及解答疑问网上搜索教师 提出问题，了 解网站设计事 项培养学生自主 学习能力导入新课 (5min)网站设计大致流程是哪些？每组派 出一个代表阐述本组课前搜集的资 料听取学生的观点 并给予一定的知 道阐述观点，组 员之间相互讨 论锻炼学生的语 言表达能力
14、和 分析能力任务一 讲授新课 (35min)一、网站设计流程任务二 分组讨论 (40min)二、网站开发原则1、 确定主题讨论：网站是靠什么赢利的？2、规划站点结构（1）结构设计（2）目录结构设计（3）形象设计（4）主页设计（5）其他页面设计（6）企业站点设计（7）为站点设计目标对象访问率1、确定网站主题 的建议 2、给网站取名 3、提示决定网站 的性质小组讨论，相 互沟通加深学生对网 页设计要点学 习架构内容信息架构内容信息搜集整理资料搜集整理资料规划网站结构规划网站结构网页制作网页制作整合网站整合网站效果测试效果测试网站上传网站上传 网站推广网站推广 更新维护更新维护三、网页版面布局设计1
15、、版面布局的原则（1）主次分明、中心突出（2）大小搭配、相互呼应（3）图文并茂、相得益彰（4）动静适度、平衡对称2、页面布局的类型（1）“国”字型（2）框架型（3）标题正文型（4）封面型（5）综合型四、规划站点1、建立站点目录2、站点规划规划站点结构是利用不同的文件夹将不同的网页内容分门别类的保存。3、创建导航草图五、搜集素材1、搜集并制作素材无论是文字素材还是图片、动画素材，都应注意其来源是否注明版权所有。网站素材要为网站主题服务。2、整理素材原始素材、编辑处理好的素材3、命名规范六、创建站点1、不使用服务器技术2、本地编辑3、不连接到远程服务器七、管理站点（1）编辑现有站点（2）删除已有站
16、点课后作业 (5min)根据这次课的内容、注意事项，构思一个明确的网站主题，并将站点结构的规划用文件 夹表示出来课堂小结 (5min)一、网站设计确定主题二、网站设计流程三、站点管理教学反思本次主要讲述站点的建立和管理，课程较简单，学生掌握较好板书一、网站设计流程二、网站开发原则三、网页版面布局设计四、规划站点五、搜集素材六、创建站点七、管理站点实训课题实训课题新建一个网页实训课时实训课时2 课时实训目标实训目标1、 熟悉 Dreamweaver cs4 界面 2、 制作简单网页实训重点实训重点1、 学会在网页中输入文字、插入图片等 2、 掌握简单代码的编写实训难点实训难点代码的编写实训方法实训方法上机实训实训准备实训准备教案、素材、案例、教材、计算机机房实训要求实训要求1.对照实习报告的要求，完成上机任务；2.任务完成后及时要求教师考评；3.完善实习报告，填写实训总结；遵守实训纪律
