《网页设计》课程教学大纲.docx

1、网页设计课程教学大纲网页设计课程教学大纲课程编号：英文名称：WebPages Designing课程类型：专业选修课学时/学分：24+24/2授课对象：专科生先修课程：计算机文化基础课程简介：网页设计是一门重要的信息管理专业的选修课程。本课程讲述了网站创建、网页制作基本知识、Dreamweaver网页制作集成工具使用的方法等内容。通过本课程的学习，使学生掌握构建网站的基本知识，熟悉网页开发平台的使用，能够独立的创建个人网站。教学目的和要求：通过学习，使学生了解网页网站的基础知识；掌握网页三剑客的使用方法，以便能够正确应用和维护网站。与此同时，通过对Web页制作技术和制作工具的学习，使学生对于网

2、页设计中所涉及的相关知识有一个全面的了解。教学内容：第1章 网页设计快速入门（2）1、教学内容：1.1 在Internet上安个家 1.2 知识要点 1.2.1 有关网页设计的概念 1.2.2 网页设计软件 1.2.3 网页制作过程 1.2.4 企业建立网站的过程 1.2.5 网页设计与HTML 1.3 本章小结 2、教学重点：网页设计的概念、网页制作过程。3、教学难点：网页设计与HTML。第2章 Dreamweaver MX快速入门（1）1、教学内容：2.1 制作网站电子相册 2.2 知识要点 2.2.1 认识Dreamweaver MX中文版基本界面 2.2.2 认识窗口项目 2.2.3

3、面板组 2.3 本章小结 2、教学重点：Dreamweaver MX中文版基本界面。3、教学难点：面板组的使用。第3章 用Dreamweaver MX设计首页（1）1、教学内容：3.1 一个简单首页设计的例子 3.2 知识要点 3.2.1 页面属性 3.2.2 文本属性 3.2.3 表格属性3.2.4 单元格属性 3.2.5 图像属性 3.3 本章小结 2、教学重点：设置文本、表格和图像的属性。3、教学难点：页面属性的设置。第4章 Dreamweaver MX的CSS样式（2）1、教学内容：4.1 制作动态链接效果 4.1.1 Microsoft中国公司主页的动态链接效果 4.1.2 为网页制

4、作动态链接效果 4.2 知识要点 4.2.1 什么是CSS样式 4.2.2 CSS样式与HTML样式 4.2.3 CSS样式控制面板 4.2.4 定义CSS样式 4.3 本章小结 2、教学重点：CSS样式控制面板的使用、定义CSS样式的方法。3、教学难点：定义CSS样式的方法。第5章 表格应用（2）1、教学内容：5.1 用表格实现一个系部主页的设计 5.1.1 网页结构分析 5.1.2 设计页眉区 5.1.3 设计导航栏区 5.1.4 设计信息区 5.1.5 设计版权区 5.2 知识要点 5.2.1 标准视图中的表格与布局视图中的表格 5.2.2 标准视图模式下表格的应用技巧 5.2.3 布局

5、视图模式下表格的应用技巧 5.3 本章小结 2、教学重点：标准视图模式下表格的应用。3、教学难点：布局视图模式下表格的应用。第6章 Dreamweaver MX图层应用（2）1、教学内容：6.1 一个弹出式菜单设计的实例 6.1.1 设计弹出式菜单的效果图 6.1.2 设计弹出式菜单的过程 6.2 知识要点 6.2.1 创建层 6.2.2 选择层 6.2.3 插入层对象 6.2.4 移动层 6.2.5 对齐层 6.2.6 层与表格相互转换 6.2.7 设置层属性 6.3 本章小结 2、教学重点：层的基本操作和层的属性设置。3、教学难点：层与表格的转换、行为和事件。第7章 Dreamweaver

6、 MX时间轴（2）1、教学内容：7.1 制作一个动态地址导航图 7.2 知识要点 7.2.1 时间轴控制面板 7.2.2 时间轴的基本应用 7.3 本章小结 2、教学重点：时间轴的基本应用。3、教学难点：录制层路径。第8章 表单操作（2）1、教学内容：8.1 制作一个网上报名表单 8.1.1 制作网上在线报名表单 8.1.2 预览网上在线报名表单 8.2 知识要点 8.2.1 插入表单 8.2.2 插入文本对象表单 8.2.3 插入按钮 8.2.4 插入复选框 8.2.5 插入单选按钮 8.2.6 插入列表/菜单域 8.2.7 插入文件字段 8.2.8 插入图像域 8.2.9 插入隐藏域 8.

7、2.10 插入跳转菜单 8.3 本章小结 2、教学重点：表单和常用表单域的用途和使用方法。3、教学难点：插入隐藏域和跳转菜单。第9章 Dreamweaver MX综合应用（2）1、教学内容：9.1 一个网站建立的实例 9.1.1 建站准备 9.1.2 制作网站 9.2 知识要点 9.2.1 网站的设计构思 9.2.2 资源面板的应用 9.2.3 行为面板的应用 9.2.4 站点管理器的应用 9.3 本章小结 2、教学重点：网站的设计构思、资源面板的应用。3、教学难点：行为面板的应用。第10章 Flash MX快速入门（0.5）1、教学内容：10.1 制作一个移动的圆 10.2 知识要点 10.

8、2.1 Flash MX的界面 10.2.2 主菜单项目 10.2.3 常用工具栏 10.2.4 时间轴面板 10.2.5 绘图工具栏 10.2.6 其他重要栏目 10.3 本章小结 2、教学重点：Flash MX的工具栏和时间轴面板。3、教学难点：时间轴面板的使用。第11章 Flash MX的绘图功能（0.5）1、教学内容：11.1 制作一个网页广告 11.2 知识要点 11.2.1 绘图工具 11.2.2 指针工具 11.2.3 填充工具 11.2.4 文本工具 11.2.5 颜色设置 11.2.6 图片的使用 11.3 本章小结 2、教学重点：绘图工具的使用。3、教学难点：图片的使用。第

9、12章 Flash MX动画制作初步（1）1、教学内容：12.1 制作动态文字的实例 12.2 知识要点 12.2.1 图层（Layer） 12.2.2 帧（Frame） 12.2.3 使用图符、实例和库 12.2.4 用Sound面板引入和编辑声音 12.2.5 文件预览 12.3 本章小结 2、教学重点：使用Flash MX制作简单动画。3、教学难点：帧的基本操作、在动画中添加声音。第13章 Flash MX动作的应用（1）1、教学内容：13.1 图像动画实例 13.1.1 制作可供控制播放的循环动画 13.1.2 制作按钮元件 13.1.3 设计场景 13.1.4 舞台播放区背景的制作

10、13.1.5 在场景上创建Daughter影片剪辑的实例 13.1.6 后台控制程序 13.2 知识要点 13.2.1 ActionScript的基本概念 13.2.2 用动作面板编辑对象动作 13.3 本章小结 2、教学重点：动作面板的使用。3、教学难点：用动作面板编辑对象动作。第14章 Flash MX的综合应用（1）1、教学内容：14.1 制作一个网站的门户广告动画 14.1.1 设计构思 14.1.2 素材准备 14.1.3 制作过程 14.1.4 发布过程 14.2 知识要点 14.2.1 文件的导入与导出 14.2.2 文件的发布及发布设置 14.2.3 发布预览 14.3 本章小

11、结 2、教学重点：文件的导入和导出、文件的发布。3、教学难点：Flash MX动作的应用。第15章 Fireworks MX应用基础（1）1、教学内容：15.1 Web按钮制作实例 15.2 知识要点 15.2.1 Fireworks的基本概念 15.2.2 Fireworks的编辑模式 15.2.3 Fireworks的工具详解 15.2.4 Fireworks中的对象 15.2.5 Fireworks的层 15.3 本章小结 2、教学重点：Fireworks的工具详解。3、教学难点：Fireworks的层。第16章 Fireworks MX进阶操作（1）1、教学内容：16.1 一个简单的动

12、画 16.2 知识要点 16.2.1 Fireworks的蒙版 16.2.2 Fireworks的颜色混合模式 16.2.3 Fireworks的热点和切片 16.2.4 Fireworks实用技巧16.3 本章小结 2、教学重点：Fireworks实用技巧。3、教学难点：Fireworks的蒙版、热点和切片。第17章 站点的发布、宣传推广与维护（2）1、教学内容：17.1 站点的发布 17.2 网页的测试 17.2.1 下载时间测试 17.2.2 浏览器兼容性测试 17.2.3 拼写检查测试 17.3 站点宣传与推广的一般方法 17.4 站点的维护与更新 17.5 本章小结 2、教学重点：站

13、点的发布。3、教学难点：CuteFTP的使用方法。实验内容：实验一 (使用HTML语言制作简单网页)（2）1、实验目的：熟悉HTML语言的常用标记，学会在记事本环境下用HTML语言编辑简单的网页。2、实验内容：用记事本输入下面语句，另存为网页文件，并在浏览器中浏览。一首诗一首唐诗夜雨寄北李商隐君问归期未有期，巴山夜雨涨秋池。何当共剪西窗烛，却话巴山夜雨时。3、实验方案：学生上机前预习HTML的语法和常用标记，上机时根据实验内容完成实验任务。实验做完后要写出实验报告并交老师批改。实验二 (Dreamweaver中简单网页的设计)（2）1、实验目的：熟悉Dreamweaver MX环境，掌握制作网

14、页的方法。2、实验内容：（1）网页的新建，保存，预览，关闭，打开； （2）向网页中添加页面元素.（3）设置网页属性。3、实验方案：学生上机前预习Dreamweaver MX基本界面的使用和使用Dreamweaver MX制作网页的基本操作，上机时根据实验步骤完成实验内容。实验做完后要写出实验报告并交老师批改。实验三 (CSS样式的应用)（2）1、实验目的：使学生掌握CSS样式的设计方法并能熟练在网页中设置效果。2、实验内容：（1）创建一个网页。重定义标签h2(仅对该文档有效)，要求样式定义为：字体为隶书，字号为12磅，颜色为黄色，居中，字间距4pt，背景为蓝色。在网页中输入文字“友情链接”，

15、应用该样式。（2）在文字“友情链接”下面，输入三行文字： XX 新浪 QQ网站要求字体为楷体，5号字，加项目符号，给每行文字建立超链接，分别链接到、。修改超链接样式，使超链接不带下画线。3、实验方案：学生上机前预习CSS样式的设计方法，上机时完成实验内容。实验做完后要写出实验报告并交老师批改。实验四 (使用表格布局网页)（2）1、实验目的：使学生掌握标准视图模式下表格的应用技巧。2、实验内容：制作如图1所示的表格。表格中的图像可从网上获得或用其他图像代替。图1 制作的表格3、实验方案：学生上机前预习标准视图模式下表格的基本操作，上机时根据实验步骤完成实验内容。实验做完后要写出实验报告并交老师批

16、改。实验五 (使用图层布局网页)（2）1、实验目的：掌握图层的基本操作，能够熟练使用图层布局网页。2、实验内容：使用图层制作如图2所示的欢迎页面，页面中的图像可从网上获得或用其他图像代替。图2 制作的欢迎页面3、实验方案：学生上机前预习图层的基本操作，上机时根据实验步骤完成实验内容。实验做完后要写出实验报告并交老师批改。实验六 (使用时间轴创建动画)（2）1、实验目的：掌握使用时间轴创建动画的方法。2、实验内容：使用时间轴制作层的直线运动动画。3、实验方案：学生上机前预习时间轴的使用方法，上机时根据实验步骤完成实验内容。实验做完后要写出实验报告并交老师批改。实验七 (交互表单的应用)（2）1、

17、实验目的：掌握创建表单网页的基本操作。2、实验内容：创建一个用户注册的表单网页。3、实验方案：学生上机前预习插入表单和插入表单域的基本操作，上机时完成实验内容。实验做完后要写出实验报告并交老师批改。实验八 (制作网站)（6）1、实验目的：掌握创建站点的过程，能够综合运用前面所学知识制作网站。2、实验内容：建立一个网站（主题自拟）。要求网站中所包含网页个数至少5个，并且其中有一个是表单网页，每个网页必须用层或表格布局，网站中必须设计一个时间轴动画，并且用CSS样式表来控制网站主页的外观。3、实验方案：学生上机前预习创建站点的基本操作和资源面板的使用方法，并且完成网站的构思，上机时搜集素材并完成网

18、站制作。实验做完后要写出实验报告并交老师批改。实验九 (使用Flash制作动画)（2）1、实验目的：掌握使用Flash制作动画的基本操作。2、实验内容：使用Flash制作纸飞机绕引导线运动的动画。3、实验方案：学生上机前预习Flash的界面和使用Flash制作动画的基本操作，上机时完成实验内容。实验十 (使用Fireworks制作图片)（2）1、实验目的：熟悉Fireworks的使用方法。2、实验内容：使用Fireworks制作小吊牌。3、实验方案：学生上机前预习Fireworks的界面和使用Fireworks制作图片的基本操作，上机时完成实验内容。教学环境条件：课堂讲授采用多媒体教学与传统教

19、学相结合，并且课堂讲授与学生上机实验相结合；课堂教学需要在教师机上安装Windows 2000操作系统、Dreamweaver MX 2004、Flash MX 2004、Fireworks MX 2004软件。实验教学需要为每个学生提供一台配备相关软件的微机，采用边学习边实验的方法，加深学生对操作课的理解，进一步提高学生的实践能力。考核方式：考试方式：平时与实验相结合。包括平时到课表现、作业、实验报告、实验作品等部分内容。总评成绩：平时成绩占30，平时成绩根据学生的到课表现和上交作业、实验报告情况产生；实验成绩占70%，实验成绩根据期末学生所制作的作品情况产生。课程主持人：（副教授及以上职称

20、的教师）主讲老师：康梅娟主要教材：网页设计实用教程，刘小伟、蒙坪、新夫、梁丽明，中国铁道出版社参考教材： 1 网页设计师教程for Dreamweaver MX 2004，邱炳城主编，北京：机械工业出版社，2005.42 Dreamweaver MX 2004中文版基础教程，王锦等编著，北京：机械工业出版社，2004.103 Flash MX 2004课堂，杨小平等编著，北京：清华大学出版社，2004学习指导方案：1、课外自学指导方案：阅读参考书的相关内容，并进行练习，遇到问题可及时和任课教师联系进行答疑。2、课外训练指导方案：布置作业题，并让学生做课后练习题，遇到问题可及时和任课教师联系进行答疑。大纲制定人：康梅娟大纲审核人：大纲制定日期：2006 年 7 月 18 日