网页设计与制作教学大纲.doc

网页设计与制作教学大纲一、课程的地位与性质“网页设计与制作”是高职电子商务专业的职业技能课，重点讲述网页设计与制作的基础知识、基本理论和基本技能，是一门包含了网页、网站的概念、网页主要工具软件HTML、dream weaver中文版的使用以及网页制作的拓展内容（Flash、Firework）等诸多知识的操作性极强的技能型应用课程。“网页设计与制作”以“电子商务信息技术与应用”、“计算机辅助平面设计”为前期基础课程，也是“电子商务网站规划与管理”和“动态网页设计与制作”等课程的前期基础课程。二、课程的任务与目的通过对网页设计与制作基础知识和技能的学习,使学生系统了解网页、网站的概念、网页主要工具软件dream weaver的使用等基础知识，掌握网页制作的拓展内容Flash、Firework，熟练运用网页制作的工具软件，使学生具有网页、网站制作的知识与能力，具备应用电脑独立开发网页、网站并将网站上传并测试的技能，具备解决网页设计、网站开发中出现各种问题的能力。本课程培养学生的职业素养和创新能力，为日后走向工作岗位打下理论与实践基础。通过本课程的学习实现学生思想过硬、理论基础扎实、实际工作能力强的教学目标。三、课程总体结构、教学环节和课时分配章课程内容课 时小计讲授实验案例其他1概述2202HTML10463Dream weaver基础2114网页中的基础元素6335网页页面布局164126表单的应用4227网页中的层和时间轴2118在网页中使用行为4229CSS样式使用82610网页中的多媒体应用21111模板和库21112站点测试和发布21113Flash 简介2081214Fireworks8简介可选学生自学合计803248四、教学内容第一章 概述 2学时教学目的：了解网页及网站基本概念及网页的基本要素分析教学重点与难点：网页、网站设计流程，网页基本要素第一节 网页和网站 0.5学时一、网页二、网站三、网页的基本功能第二节 网页中的主要元素 0.5学时一、文本二、图像三、链接标志四、其他的基本要素第三节 网页制作工具 0.5学时一、网页编辑工具二、网页图像编辑工具三、动态网页技术第四节 网页设计的基本流程 0.5学时一、网站的设计流程二、网页的设计与制作三、网页的测试四、网页上传和发布第二章 HTML语言基础 4学时教学目的：了解HTML文件的基本结构，掌握HTML中文本的编辑及图像的语法，掌握HTML中各种设置超级链接的语法，掌握HTML中表格和框架的基本语法。教学重点与难点：HTML的语法结构、超级链接的语法、表格和框架的基本语法。第一节 HTML概述 （与第二节合为1学时）一、HTML简介二、HTML语法结构第二节 文本的编辑 一、段落标记二、文本标记三、标题显示等级四、列表第三节 图像编辑 1学时一、插入图像二、使用背景图像第四节 建立超链接 1学时一、建立超链接二、使用书签三、标记新窗口和基准链接第五节 表格与框架 1学时一、建立表格二、表格属性三、建立框架四、框架属性第三章 Dream weaver基础 1学时教学目的：了解DW8的操作界面及常用命令，掌握规划和创建站点的操作，掌握基本的网页操。教学重点与难点：规划站点的结构、网页的基本操作第一节 Dream weaver 8工作界面 学时一、启动和退出Dreamweaver二、Dreamweaver8操作界面第二节 规划与创建站点 学时一、规划网站的整体结构二、建立本地站点三、管理本地站点第三节 网页文件的基本操作 学时一、新建网页二、保存网页三、关闭网页四、打开网页五、预览网页第四章 网页中的基础元素 3学时教学目的：通过本章的学习可以掌握在网页中的文本和段落的设置方法，掌握图像的插入及其属性的设置的方法，熟悉页面属性的设置，熟悉各种超级链接及设置。教学重点与难点：文本和段落的设置文本、图像的插入及其属性的设置、超链接第一节 在网页中插入文本 1学时一、插入文本二、设置文本格式三、段落格式的编辑四、设置列表五、简单的CSS样式应用第二节 在网页插入图像 （与第三节合为1学时）一、插入图像二、设置图像属性三、编辑图像四、图像外部编辑五、鼠标经过图像六、创建导航条第三节 插入其他网页元素 一、水平线二、日期和时间第四节 设置网页的页面属性 （与第五节合为1学时）一、打开页面属性对话框二、设置网页的标题三、设置网页的背景四、设置网页的文本五、设置网页的边界第五节 设置超级链接 0.5学时一、超链接的路径二、创建基本超链接三、锚点链接四、热区链接五、电子邮件链接第五章 页面布局规划 4学时教学目的：学会运用表格进行数据展示及进行网页布局，学会使用框架结构建立网页。教学重点与难点：表格的插入、表格的编排和设置、利用表格进行布局第一节 表格的基本操作 1学时 一、插入表格二、添加内容三、选择表格四、设置表格属性五、编辑表格的基本操作第二节 表格布局 2学时一、布局视图二、绘制布局表格和布局单元格三、编辑布局表格和布局单元格第三节 框架布局 1学时一、建立框架二、框架面板三、设置框架的属性四、保存框架五、框架中的超链接第六章 表单的应用 2学时教学目的：表单，可以收集用户的信息和反馈意见，是网站管理者与浏览者之间沟通的桥梁，在本章将学习如何使用表单创建描述表单信息的网页。教学重点与难点：创建表单、处理表单的方法第一节 创建表单一、表单概述二、表单对象三、插入表单四、表单属性第二节 创建表单对象一、创建文本域二、创建复选框三、创建单选按钮四、创建列表/菜单五、创建文件域六、创建跳转菜单七、创建按钮八、创建单选按钮组九、创建图像域第三节 处理表单一、使用行为验证表单二、利用邮件传送表单第七章 网页中的层和时间轴 1学时教学目的：通过教学，使学生掌握Dream weaver层的概念、层的操作方法；时间轴的概念、时间轴中各元素的功能及时间轴的常用操作方法。教学重点与难点：层的操作方法、时间轴操作方法第一节 层 一、创建层二、层的基本操作三、层与表格的转换第二节 时间轴 一、认识时间轴二、创建动画第八章 在网页中使用行为 2学时教学目的：通过教学，使学生掌握Dreamweaver中行为的概念，熟练掌握使用行为面板对行为的各种操作方法。使用Dreamweaver 的内置行为为网页对象添加各种常用的行为。教学重点与难点：使用Dreamweaver 的内置行为为网页对象添加各种常用的行为第一节 认识行为 1学时一、认识行为二、使用行为面板三、增加行为的基本步骤四、修改行为第二节 使用Dreamwerver8内置的行为 1学时（可根据课时来安排是否完全讲授）一、播放声音二、打开浏览器窗口三、弹出消息四、转到URL五、设置状态栏文本六、拖动层七、显示隐藏层八、检查浏览器九、改变对象属性十、控制Shockwave或Flash第九章 CSS样式使用 2学时教学目的：通过教学，使学生掌握CSS样式表的基本概念，会使用CSS样式面板。掌握创建CSS样式表的方法，新建CSS样式表，设置CSS样式定义对话框，创建外部CSS样式表，使用和编辑自定义CSS样式表。教学重点与难点：新建和和应用CSS样式表，CSS经典应用（大字、下划线）、滤镜的作用。第一节 CSS样式概述一、认识CSS样式二、CSS样式的类型三、CSS样式面板第二节 使用CSS样式一、创建CSS样式二、附加外部CSS样式三、应用CSS样式四、编辑CSS样式五、删除CSS样式第三节 CSS样式设置（可根据课时来安排是否完全讲授）一、类型二、背景三、区块四、方框五、边框六、列表七、定位八、扩展第四节 CSS样式经典实例 一、改变鼠标形状二、更改超链接的样式三、应用CSS滤镜第十章 网页中的多媒体应用 1学时教学目的：通过教学，使学生掌握在Dreamweaver中插入音频文件的方法，掌握在Dreamweaver中插入Flash文件的方法，掌握在Dreamweaver中嵌入视频文件的方法。教学重点与难点：在Dreamweaver中插入音频文件、Flash文件、嵌入视频文件的方法。第一节 在网页中插入音频 一、链接到音频文件二、在网页中嵌入音频文件三、在网页加入背景音乐第二节 在网页中插入Flash动画 一、插入Flash文本二、插入Flash按钮三、插入Flash动画第三节 在网页中插入视频 一、链接到视频文件二、在网页中嵌入视频文件第十一章模板和库 1学时教学目的：通过教学，使学生了解Dreamweaver8模板和库的作用，掌握模板和库项目的创建操作，能够应用模板和库设计网页，掌握利用模板和库更新页面的方法。教学重点与难点：应用模板和库设计网页，利用模板和库更新页面。第一节 模板一、创建模板二、删除模板三、编辑模板四、由模板创建网页五、更新模板第二节 库一、创建库项目二、删除库项目三、应用库项目四、更新库项目第十二章 站点测试和发布 1学时教学目的：通过教学，使学生掌握站点测试的内容与操作，掌握定义远程站点的方法，使用Dreamweaver发布站点的操作。教学重点与难点：站点测试、定义远程站点及发布站点。第一节 测试站点 一、浏览器兼容性测试二、超链接测试第二节 发布站点 一、申请空间和域名二、发布网站三、站点推广第十三章 Flash 简介 8学时教学目的：通过本章的学习，能够熟悉Flash的操作界面，掌握动画制作的基本流程，掌握各类动画的制作方法，掌握在Flash中绘制图形、建立元件等基本操作。教学重点与难点：在Flash中绘制图形、建立元件等基本操作，各类动画的制作方法。第一节 认识Flash 1学时一、Flash的操作界面二、Flash 的主要术语三、文件的基本操作第二节 Flash8 的基本操作 1学时一、绘制基本图形二、文本的编辑三、建立元件四、导入位图五、动画制作流程第三节 制作Flash动画 6学时一、文字特效二、逐帧动画三、运动补间动画四、形状补间动画五、引导层动画六、遮罩动画七、导出和发布动画第十四章 Fireworks简介（拓展内容，可根据学生的接受程序及教学进度来安排是否讲授）教学目的：通过本章的学习，能够熟悉Fireworks的操作界面，了解Fireworks 中的常用面板，并掌握Fireworks 中基本工具的使用方法。教学重点与难点：Fireworks的基本操作、Fireworks图像处理的基本操作。第一节 认识Fireworks一、Fireworks8操作界面二、文件的基本操作第二节 Fireworks基本操作一、编辑图像的基本操作二、绘制和编辑位图对象三、绘制与编辑失量对象四、添加与编辑文本五、样式的应用六、制作网页导航实例第三节 Fireworks进阶一、图像的优化与导出二、切片的应用三、创建Gif动画五、教学建议1、必须以实际出发，密切联系当前网络的实际情况，要按照洋为中用、外为我用的精神，认真学习网页设计知识，加强动手能力的培养，不断提高解决实际问题的能力。2、在学习中不仅要注重HTML和dreamweaver基本知识的掌握，还要对Flash 的主要概念和操作内容进行模拟和训练，通过课堂学习、课后练习和模拟实验、实训及到业务部门实习，使基本技能的训练得到加强，培养学生实际操作的能力。3、考试：本课程采取期末考试和