《网页设计与制作》实训项目大纲及实训方案

本实训项目的目的与任务是使学生根据问题的要求， 构思一个主题，并运用网页制作工具，制作和发布网页，并对此进行更新和维护，掌握网站发布的工作流程，了解域名申请、空间申请的方法，能在校园网及英特网上发布网页。实训学时数：125（5周）课外学时数：100适用方向：办公自动化、 电子商务执笔者：王平露编写日期：2006年4月一、实训教学的目的与任务本实训项目的目的与任务是使学生根据问题的要求，构思一个主题，并运用网页制作工具，制作和发布网页，并对此进行更新和维护，掌握网站发布的工作流程，了解域名申请、空间申请的方法，能在校园网及英特网上发布网页。通过设计、编辑和发布网页全过程的实际训练使学生对网页整体设计流程有一个深刻的认识，并且熟练掌握网页制作工具（DreamweaverMX）的使用，初步掌握HTML、CSS语法格式，能借助手册看懂代码，能进行简单的代码改写工作，了解客户端脚本和服务端脚本区别， 了解在网页上进行简单代码的嵌入与改写，会与其他工具结合使用以便实现更高效高质量的网页效果， 进一步提高办公自动化效率和水平。二、实训项目的基本要求及考核标准基本要求：（一）网页内容要求：1、主题内容：创意突出，体现校园园区精神文明 建设体现本班级大学生风貌，学习气氛浓厚，作品内容健康。严禁发布反对 政府、宣传迷信、传播色情、系统破坏、黑客教程等违法信息。2、具体内容：标徽、标题、各链接页具体内容，站内搜索、计数器、留言系统、电子邮件地址、弹出窗口、漂浮广告、背景音乐、网页特效、友情链接、版权信息等。（二）制作基本要求:I、至少有10个页面，链接结构应有三层，下一层必须有返回上层的按钮或链接。有整体框架结构，导航栏，表格定位，布局合理，色彩搭配协调统一。2、主页的文件名为：index,htm。文件名一般用英文小写字母。3、网页中要有文本、图像、表格、交互与链接、层与动画、表单。4、网页主要建立站内链接，尽量少建立外部链接，至少建立一个 E-mail链接至你的邮箱。5、要有flash控件、Frieworks图像，至少各出现一处,使用CSS样式；6、为页面元素添加行为（调用DreamweaverMX内置的脚本程序）.7、相关图片清晰，单张图片大小不超过 200K（三）、网页性能要求：1、每一张网页，显示分辨率以800*600状态为准，网页对不同浏览器兼容性较好；2、在不考虑兼容性问题时，不出现乱码或错误的表格等内容；3、结构清楚，便于浏览、查找。没有空链接或错误链接；4、界面链接方便；（四）测试和网页发布要求：1、测试链接和兼容性；2、预览网页；3、申请免费二级域名和免费空间；4、申请计数器和留言版5、发布网页6、推广网站加入搜索引擎。评分标准：以下列出每项内容的满分，根据实际情况可酌情加、减分。(20)1、网页内容健康（有非法内容责任自负），主题鲜明，且按前面各项要求不缺少。(20)2、网页中有框架、导航、布局合理。（ 10）3、网页中有三层，下一层有返回上层的按钮或链接。 （5+5+5）4、采用了至少一幅Flash动画，一处Fireworks图像。（5+5）5、使用CSS样式和内置脚本程序。（5+5）6、内外链接和E-mail链接正确无误，且无空链接。（ 5）7、网页性能测试兼容性和发布（5+5）8、主页采用编码语言如ASP,PHP,JSP等技术都给予适当加分（10）o9、综合分：（10'）内容丰富、自己设计制作的素材较多；文件夹、文件名命名规范；文件存放位置合理；网站的功能较强，程序编制合理，功能强；色彩及布局合理美观、用户访问方便；采用各种特效、并且运用合理。《网站设计与制作》实训方案

号J训项内容提要训时要求同数1、简介网站设计的流程和使用工具1、\解Dreamvever的起始页界面的三个区域的2、启动、退出Dreamvever作用；T3、了解起始页的应用2、掌握文档编辑界面的元素组成：注意与其21W介绍)4、掌握Dreamvever软件的界面组成它软件界面的区别要掌握（1）对象面板下5、设计一个简单的网页拉列表的选择及各个对象的功能；（2）属和简性面板的使用及上下文敏感性；（3）其它单使活动面板的功能和使用方法；（4）文档三种用3、视图的切换及用途；（5）文档工具栏的使用。能熟练地调出各种面板和工具；课堂练习：编辨一个简曲的网市像在斗田 TF拓监1、在网上申请空间域名；4、能独立地利用搜索引擎成功申请一个免费空2、站点的功能；间；3、站点管理器的使用方法；2、掌握利用DW中的站点管理器定义一个本地站4、利用站点管理落定义本地站点并将站点（明确定义站点过程中各信息的含点内容上传到远程服务器，发布网页。2.义，会填写各信息）的方法；3、熟练掌握使用站点管理器建立目录结构来规范管理不同内容不同类型的文件并会建立和占管理及网页发布古4、5、编辑各个网页（明确网站首页的文件名要求）。会使用站点地图来宏观控制站点内各个网页的链接关系；课堂作业：会使用站点管理器向网上发布网页。 （将自己做好的一个网页上传（己申请的服务器）后，并能根据网址访问到自己的网页）（课堂检查评分）1、页面整体属性的设置1、掌握下到页面属性：2、文本元素的输入和属性设置（1）外观:文字大小、颜色、页面背景色、3、特殊字符的输入和属性设置2背景图片、元素的位置确定（2）链接：4、图像元素的输入和属性设置4链接的文字、颜色、访问过的颜色、下划线去5、列表项的输入和属性设置留等（3）标题：设置不同级别的标题样式16、7、8、水平线和竖直线及颜色滚动字幕的设置时间和日期的设置9、设计一个包含上述元素的网页2、（4）文档标题和编码（5）跟踪图像。掌握下面的页面元素的输入及属性设置。（1）文本：输入和格式（2）特殊字符的输入（如空格、商标、数学符号、单位符号等）（3）插入图像（位置、大小、边框，面和元素属性瓦3、注意与背景图像的区别）（4）有序列表和无序列表项的设置（5）水平线和竖直线高度和宽度的及颜色的设置（ 6）滚动字幕的标签〈marquee）（7）插入时间和时期，并能设置日期格式和字体字号及颜色。课堂作业设计出一个包含文本、特殊字符、图片、列表项、滚动字幕、水平线和整个页面有背景图像的比较美观的网页（课堂检查评分）乐链接的种类和功能2、明确链接的分类和各种链接的功能

号/训项日丁内容提要训时数实要求种链接的设置，1文本链接锚点链接图片链接图片热区链接6、站外链接7、信箱链接2、熟练掌握链接时的目的文件的地址(知道相对路径和绝对路径的使用区别和表示方法)；；2 明确被链接的内容所出现的目标(_blank,_parent,_top,_self)知道以上是什么含义；1 会设置锚点链接(先设置锚标记，再对锚标'、记进行的链接，注意锚链接源文件的标记:URL#锚标识)5、掌握整体图片链接的方法6、掌握图片上分区域链接的方法，特别是掌握不规则图片区域的链接；7、掌握站外链接和E-mail链接的方法.注意地址：连同协议写完整.8、课堂作业：制作一个具有上述各种链接的网页.(课堂检查评分)ITML基础HTML语言简介HTML语言的基本语法结构HTML实例分析d4、明确HTML语言的功能、明确学习HTML语言的目的、学习HTML语言的方法；掌握HTML语言的语法结构：(1)页面整体结构：(2)页面元素的标签和属性：文本、图像、有序列表、无序列表、表格、行、单表格、框架、以及各自链接所使用的标记和它们的属性值：知道各种标签和属性值在代码中的语法规则；能看懂简单的HTML弋码；能够通过查看网站源文件的方式使用已有的资源加入到自己的网页中。会下载插件和使用插件；课堂作业：利用HTML编写一个简单的网页实列。并且会利用一小段计算机系网站程序的源代码插入，达到利用资源的目的。(课堂检查评分)媒体制作与应用1、利用Dreamwever自带的Flash对象、声音、电影等多媒体元素放入网页中；利用Fireworks创建和处理图片并且在Dreamwever中使用Fireworks；用Flash制作动画并应用于网页中2、 会快速插入多媒体对象：(1)会插入FLASH按钮和文本；4 (2)会插入翻转图像和导航条；4 (3)会插入FLASH电影；4 (4)会插入Shockwave电影；(5)会插入声音文件及设置背景音乐；插入以上对象时明确文件格式。2、熟练掌握Fireworks软件的功能和以下各种操作方法：(1)熟悉Fireworks软件的界面、工具箱、属性面板、层面板、混色器面板、样式面板、帧面板等；(2)能熟练创建所需的图片，会使用滤镜、效果等；(3)能根据网络传输的需求优化图片、切割图片和导出图片；(4)熟练掌握Dreamwever中直接插入、编辑Fireworks图片或简单网页动画的方法；

号训项日内容提要训时数要求3、熟练掌握Flash软件的功能和以下各种操作方法：（1）熟练掌握Flash软件的界面、工具箱、常用面板的功能；（2）理解和动画相关的一些概念（帧和时间线、舞台和工作区、符号和实例、矢量图与位图）；（3）理解动画制作的原理和过程；能利用工具画出所要的图形和和修改己有的图片并添加滤镜效果等；熟练掌握制作动画的方法；会在Dreamwever中加入Flash作品（明确使用文件的格式）。4、课堂作业：在网页中加入背景音乐，和视频文件、MP3歌曲点播;用Fireworks制作一个相框并应用于网页中；用Flash制作一个滚动球并用播放田心11钮*il冰=A・Iff库1、CSS样式的功能、定义和使用2、模板的功能、创建和使用3、库的功能、创建和使用、2、明确CSS样式的含义和功能；2、熟练掌握用CSS面板来创建和应用样式来2美化网页的方法；3、会创建和保存网页模板，并会利用模板创建统一风格的网页；4、会创建、编辑库项目并利用库项目更新网页。5、课堂作业：（1）设计一个模板并保存；将网页微标和动画放入库项目中以备使用。（2）仓U建一个CSS十件并退置一此样式，1态交，互简单设计十1、表单的功能2、表单对象的创建3、服务器的设置4、交互的脚本程序简单应用4、理解表单的功能；2、熟练掌握插入常用的表单对象的方法 （单2行文本框、密码框、多行文本框、复选框、单选钮、下拉菜单、文本域、图像域、隐藏域）；3、 掌握设置各种对象的属性；4、会利用本地机器作为服务器，安装IIS并进行相应的设置；H 涌讨筒的的南主■厢再比抻德吞万工力台B0i合实1训1、设计并制作一个内容健康的主题网站，严禁一切违法信息；写出网站设计的详尽文档说明；整体网站风格一致网站内容丰富、素材精选、实用，有价值；网页美观、生动（多媒体效果）各种链接畅通；7、网站发布和浏览畅通，兼容性好，传输速度快。02、内容要求：（任选下列之一）2 （1 ）大学生活4 （2 ）学习方法（3 ）毕业设计和专