网页设计与制作课程大纲.doc

课程大纲 一、 课程说明（一）、编制依据本大纲依据“计算机应用技术专业教学计划（2006级）”所编制。（二）、课程性质及任务本课程是计算机应用技术专业教学计划（2006级）专业课之一。通过本门课程的学习，使学生了解并掌握有关网站设计与网页制作的发展现状、及其应用，网站设计与网页制作的基本概念、构建网站的基本流程，网页设计制作有关的知识， Web基本工作机制，以及网页制作软件 “网页三剑客”（DREAMWEAVER、FLASH、FIREWORKS）的使用，并使学生具有解决一般网页制作问题的能力。与此同时，通过对Web页制作技术和制作工具的学习，使学生对于网页设计中所涉及的相关知识有一个全面的了解。通过理论教学与实践模拟训练，和后续课程的学习，引导学生考“网页设计师”证书并使学生具备构建静态网站的基本知识和基本技能。课时安排：理论43学时，实践21学时。（三）、本课程同其他课程的关系本课程是计算机应用技术专业课程之一。同时也为后续课程打下基础。（四）、教学内容的设置本课程教学内容主要根据“计算机应用技术专业三年制教学计划(2005级)”的培养目标和“网页设计师”证书考试的要求来设置。（五）、教学方法与教学手段的采用本课程主要讲解式、讨论式、实验实习和多媒体教学的形式进行教学，同时注重实际动手、实际操作能力的培养。（六）、教材的选用根据教学大纲的规定，选用中国铁道出版社出版的网页设计实用教程作为教材。二、教学时数及分配表章 次课程内容总学时理论学时实验学时第1章 网页设计快速入门844第2章Dreamweaver MX快速入门422第3章用Dreamweaver MX设计首页422第4章Dreamweaver的 css样式422第5章表格应用422第6章 Dreamweaver MX图层应用422第7章 Dreamweaver MX时间轴422第8章 表单操作633第9章 Dreamweaver MX综合应用844第10章 Flash MX 快速入门844第11章 Flash MX的绘图功能844第12章 FlashMX动画制作初步 844第13章 Flash MX动作的应用844第14章 Flash MX的综合应用844第15章 Fireworks MX应用基础844第16章 Fireworks MX进阶操作844第17章 站点的发布、宣传推广与维护633合计 1085454 三、 教学内容第一章 网页设计快速入门教学目的：理解、掌握网页设计及网站建设、HTML的概念和入门知识，使学生对平时在上网过程中接触到的网页有一定的了解，明白其原理和制作方法，激发学生学习设计网页的兴趣。教学要求：理解、掌握网页设计及网站建设、HTML的概念和入门知识重点难点重点：网页制作过程、HTML基础知识难点：网页制作过程、HTML基础知识主要内容1-1 在Internet上安个家 21-2 知识要点 51-2-1 有关网页设计的概念 51-2-2 网页设计软件 71-2-3 网页制作过程 101-2-4 企业建立网站的过程 111-2-5 网页设计与HTML 141-3 本章小结 19作业测验 （1） 解释网页、网站、URL、FTP、HTML、HTML编辑器、服务器、动态HTML、HTTP等术语。 （2） 常用的WEB图像格式有哪些？它们各自有何特点？（3） 简述网页和网站建设的基本过程？复习思考内容 1、在网页设计中文字、图像、颜色的组合搭配应该注意哪些问题？第二章 Dreamweaver MX快速入门教学目的：通过dwermweaver来制作一个电子相册的事例引导学生对dwermweaver的初步了解,认识dwermweaver的各个功能面板。教学要求：引导学生对dwermweaver的初步了解，会制作一个电子相册,认识dwermweaver的各个功能面板。重点难点重点：认识DW中文版的基本界面和各个功能面板。难点：制作一个电子相册主要内容2-1 制作网站电子相册 222-2 知识要点 242-2-1 认识Dreamweaver MX中文版基本界面 242-2-2 认识窗口项目 252-2-3 面板组 292-3 本章小结 31作业测验1、熟悉Dreamweaver的各个面板2、收集资料制作一个网站电子相册第三章 用Dreamweaver MX设计首页教学目的：掌握网站的定义和管理以及页面属性、文本属性、表格属性、单元格属性、图像属性的设定重点难点重点：网站的定义、页面属性、文本属性、表格属性、单元格属性、图像属性的掌握难点：网站的定义和管理主要内容3-1 一个简单首页设计的例子 343-2 知识要点 383-2-1 页面属性 383-2-2 文本属性 403-2-3 表格属性 413-2-4 单元格属性 423-2-5 图像属性 433-3 本章小结 44作业测验1根据3-1范例，自己操作设计做一个简单首页，并且连接到自己制作的电子相册的主页。2自己选择题材制作一个网站，要求定义站点，创建一个首页，4个二级页面。第四章dreamweaver 的 css样式教学目的：通过制作动态链接效果的网页，使学生初步感受css样式的应用，逐步引导学生把css样式应用在网页制作中，从而设计制作出更精美的网页作品。教学要求：逐步引导学生把css样式应用在网页制作中重点难点重点：创建css样式，制作不同的css样式难点：css样式的进阶操作主要内容4-1 制作动态链接效果 484-1-1 Microsoft中国公司主页的动态链接效果 484-1-2 为网页制作动态链接效果 494-2 知识要点 514-2-1 什么是CSS样式 514-2-2 CSS样式与HTML样式 534-2-3 CSS样式控制面板 544-2-4 定义CSS样式 554-3 本章小结 57作业测验1）、设计一个内嵌式css样式，并用于本页文本。2）、为一个做了链接的普通网页添加文字链接的动态效果。3）、创建一个外部css样式文件，并将之应用于两个以上的网页。4）、设置段落文字，每一段都要这样：将第一行设成黄色，第二行设成红色，第三行设成蓝色，第四行设成绿色第五章表格应用教学目的：通过表格设计网页的示例使学生了解表格在网页设计布局、排版时所起的重要作用教学要求： 学生了解表格的相关操作，使用表格对网页进行布局、排版重点难点重点：表格属性、布局及排版难点：设置表格参数、应用网页布局排版主要内容5-1 用表格实现一个系部主页的设计 605-1-1 网页结构分析 605-1-2 设计页眉区 615-1-3 设计导航栏区 625-1-4 设计信息区 635-1-5 设计版权区 655-2 知识要点 665-2-1 标准视图中的表格与布局视图中的表格 665-2-2 标准视图模式下表格的应用技巧 685-2-3 布局视图模式下表格的应用技巧 715-3 本章小结 75作业测验1、参照本章范例用表格设计一个系部主页。 第六章Dreamweaver MX 图层应用教学目的：通过本章弹出菜单的设计，对层的概念、基本操作、层的应用技巧等作进一步的了解。教学要求： 了解层的概念，掌握层的操作和应用。重点难点重点：弹出菜单的设计，层的基本操作和应用难点：弹出菜单的设计，设置层属性。主要内容6-1 一个弹出式菜单设计的实例 786-1-1 设计弹出式菜单的效果图 786-1-2 设计弹出式菜单的过程 786-2 知识要点 806-2-1 创建层 816-2-2 选择层 826-2-3 插入层对象 836-2-4 移动层 836-2-5 对齐层 836-2-6 层与表格相互转换 846-2-7 设置层属性 856-3 本章小结 86作业测验1、 如何创建层？2、 怎么样设置层的大小并定位层？3、 层包含哪些属性，各属性具体含义是什么?4、 层对齐的操作有哪几种情况？操作题：1、按照书本上的步骤，设计一个弹出式菜单。2、用CSS样式对以上设计的弹出式菜单进行修饰。复习思考内容1、设计一个弹出式菜单（包含多级弹出选项）。 第七章Dreamweaver MX 时间轴教学目的：使学生了解时间轴的概念相关知识，利用它与层和行为面板结合，设计出许多精彩特技效果的网页。教学要求：了解时间轴的概念相关知识，制作动画效果。重点难点重点：利用时间轴制作动画难点：编辑时间轴动画，加入行为事件。主要内容7-1 制作一个动态地址导航图 907-2 知识要点 957-2-1 时间轴控制面板 957-2-2 时间轴的基本应用 967-3 本章小结 99作业测验1、制作一个时间轴动画（包含直线移动和曲线运动）2、按照书上的步骤，制作本书的时间轴动画范例。3、 为一个页面制作一个飘浮的广告。第八章表单操作教学目的：通过一个范例的学习和操作，使学生掌握Dreamweaver MX关于表单的基本操作教学要求： 掌握Dreamweaver MX关于表单的基本操作重点难点重点：表单对象面版上表单域的使用及其属性难点：在网页上设计表单主要内容8-1 制作一个网上报名表单 1028-1-1 制作网上在线报名表单 1028-1-2 预览网上在线报名表单 1058-2 知识要点 1068-2-1 插入表单 1068-2-2 插入文本对象表单 1078-2-3 插入按钮 1088-2-4 插入复选框 1098-2-5 插入单选按钮 1098-2-6 插入列表/菜单域 1098-2-7 插入文件字段 1108-2-8 插入图像域 1108-2-9 插入隐藏域 1118-2-10 插入跳转菜单 1118-3 本章小结 112作业测验1、怎样才能让表单以电子邮件的方式提交。2、“列表/菜单域”与“跳转菜单”有何区别？3、“文本域”与“文件域”有何区别？4、表单对象面板包含哪些对象？5、如何设定一个可以输入5行文字的文本域。操作题：1、在网上以“跳转菜单”表单方式设计一个有链接的“推荐站点”表单。2、设计一个表单，以电子邮件方式实现提交。3、设计一个表单，以一个图象“提交”按钮替代文字“提交第九章Dreamweaver MX 综合应用教学目的：掌握有关网站构架设计、网站制作中各资源面板的使用及网站上传等知识。教学要求：掌握网站构架设计，利用软件建设一个网站重点难点重点：网站的建设及资源面板的使用难点：网站的构架设计及建设主要内容9-1 一个网站建立的实例 1169-1-1 建站准备 1179-1-2 制作网站 1189-2 知识要点 1249-2-1 网站的设计构思 1249-2-2 资源面板的应用 1259-2-3 行为面板的应用 1289-2-4 站点管理器的应用 1299-3 本章小结 130作业测验1、就你所看到的网站，从风格上可以分为哪些类型？2、在规划网站时，应如何设置好网站3、如何设置网站的本地信息与远程信息？4、设计一份网站制作规划的报告。操作题：1、设计制作一个与本章实例相类似的网站。要求：（1）、设计一份网站制作规划的报告。（2）、网站所包含的页面不得少于10页。（3）、设计好之后上传到网上的免费空间。第十章 Flash MX快速入门教学目的：通过用flash软件制作一个简单的移动动画，使学生理解、掌握Web动画的基础知识，激发学生学习flash动画软件的兴趣。教学要求：理解、掌握Web动画的基础知识和flash软件的简单操作。重点难点重点：Web动画的基础知识和flash软件界面的操作难点：flash软件界面的操作主要内容10-1 制作一个移动的圆 13410-2 知识要点 13610-2-1 Flash MX的界面 13610-2-2 主菜单项目 13710-2-3 常用工具栏 13910-2-4 时间轴面板 13910-2-5 绘图工具栏 14010-2-6 其他重要栏目 14110-3 本章小结 143作业测验1 设计一根线条由短变长的运动动画。2 上机设计一个运动的球，按指定的方向进行运动。第11章 Flash MX的绘图功能教学目的：通过本章知识的学习，使学生掌握Flash MX中文版的绘图功能教学要求：通过范例的操作和实践，使学生掌握Flash中工具的使用重点难点重点：颜料桶工具填充着色，墨水瓶工具描边，用点滴器获得对象的填充色及边线属性。难点：通过浮动面板的颜色设置对动画中的对象进行颜色修饰，以及向动画中加入图片的方法主要内容11-1 制作一个网页广告 14611-2 知识要点 14811-2-1 绘图工具 14811-2-2 指针工具 15111-2-3 填充工具 15111-2-4 文本工具 15211-2-5 颜色设置 15211-2-6 图片的使用 15311-3 本章小结 155作业测验1、说明指针工具中箭头工具和选取工具的区别。2、说明绘图工具中的铅笔工具和钢笔工具的用法有什么不同？3、用Flash MX绘图功能绘制一个广告。 第12章 Flash MX动画制作初步教学目的：通过理论知识和实践操作的学习，让学生掌握Flash MX 中层和帧的概念及应用，图符的转换。教学要求：掌握Flash MX 中层和帧的概念及应用，图符的转换及引导线动画和遮罩动画的制作技术。重点难点重点：层和帧的应用以及引导线动画和遮罩动画的制作技术难点：引导线动画和遮罩动画的制作技术主要内容12-1 制作动态文字的实例 15812-2 知识要点 16112-2-1 图层（Layer） 16112-2-2 帧（Frame） 16212-2-3 使用图符、实例和库 16312-2-4 用Sound面板引入和编辑声音 16412-2-5 文件预览 16512-3 本章小结 166作业测验1、说说图库中的符号和实例的区别。2、简要述说图层和帧的关系。操作题：1、上机制作动态文字，要求文字从左向右显示动画效果。2、制作一个逐帧动画3、制作一个引导线动画4、制作一个遮罩动画5、在flash动画中插入一段mp3音乐。第十三章 Flash MX动作的应用教学目的：让学生熟练掌握Flash动画设计时动作面板的应用以及按钮和简单动作命令，一般交互式动画的制作方法.教学要求：掌握按钮和简单动作命令,学会一般交互式动画的制作方法.重点难点重点：按钮制作和简单动作命令、按钮控制动画播放的命令设置。难点：交互式动画的设置以及 “播放”“快放”, “慢放”, “回放”,“停止”按钮来控制动画。主要内容13-1 图像动画实例 16813-1-1 制作可供控制播放的循环动画 16813-1-2 制作按钮元件 17013-1-3 设计场景 17013-1-4 舞台播放区背景的制作 17113-1-5 在场景上创建Daughter影片剪辑的实例 17113-1-6 后台控制程序 17213-2 知识要点 17913-2-1 ActionScript的基本概念 18013-2-2 用动作面板编辑对象动作 18013-3 本章小结 183作业测验1、什么是ActionScript?2、本章第一小节的交互式动画制作过程,设计一个类似的Flash动画.3、制作一个具有动感效果的按钮。4、制作多个场景，设计按钮在不同的场景之间转换。第十四章Flash MX的综合应用教学目的：掌握Flash MX的综合应用能力和Flash动画的发布知识教学要求：掌握Flash动画的构思及软件的综合应用能力，具备制作一个综合动画的能力以及掌握动画的发布知识重点难点重点：Flash MX综合的应用难点：Flash MX综合的应用、文件的发布主要内容14-1 制作一个网站的门户广告动画 18614-1-1 设计构思 18614-1-2 素材准备 18614-1-3 制作过程 18914-1-4 发布过程 19714-2 知识要点 19814-2-1 文件的导入与导出 19814-2-2 文件的发布及发布设置 19914-2-3 发布预览 20414-3 本章小结 205作业测验操作题：1、收集资料制作一个和本章实例类似的网站门户广告动画。2、制作一个多场景动画。3、将制作的一个动画文件的任一帧导出成一张图片。4、将一个动画文件逐帧导出成连接的JPEG文件。5、制作一个按钮，并为按钮加入声音。第十五章Fireworks MX应用基础教学目的：要对网页中的图片和文字进行组合排版就需要软件对图片和文字进行处理，fireworks就是这样的软件，通过制作范例理解、掌握Fireworks的基本概念及工具的操作。教学要求： 理解、掌握Fireworks的基本概念及工具的操作重点难点重点：Fireworks的主要编辑模式、工具箱、对象和层的有关概念和应用方法难点：Fireworks的主要工具的操作主要内容15-1 Web按钮制作实例 20815-2 知识要点 21215-2-1 Fireworks的基本概念 21215-2-2 Fireworks的编辑模式 21515-2-3 Fireworks的工具详解 21515-2-4 Fireworks中的对象 21915-2-5 Fireworks的层 22015-3 本章小结 221作业测验（1） Fireworks可以同时对（）和（）进行编辑，其对象也保持相当好的（）性。（2） 位图格式的图像使用点来记录（），每个点被称为一个（），无数个点组合在一起就形成了一幅图像。（3）矢量格式的图像使用（）和（）来记录文件信息，采用了这种方式的图形无论被放大多少倍都能（）。（4）工具箱中有的工具按钮右下角有一个小的下三角按钮，这代表这个工具还带有（）。（5）Fireworks MX中每个对象都会占据（），当这个对象创建时会同时生成一个层来容纳它自己。简答题：(1) 怎样区别Fireworks的两种编辑模式？(2) 指针工具有何作用？(3) 如何选取不规则区域？(4) Fireworks有哪4种基本的对象，它们各有何特点？（5）什么是层，Fireworks的层主要有哪儿种类型？操作题：1、 工具栏的操作2、 WEB按钮的制作3、 参考书P2