第一篇：动态网页设计实训任务书(宋海民)

《动态网页设计》课程实训任务书

课程名称：动态网页设计

专业方向：计算机信息管理

指导老师：XXX

设计时间：1周学生人数：40人

一、实训的目的1.进一步巩固和加深《动态网页设计》课程的基本知识，了解动态网页设计知识在实际中的应用。

2.综合运用《动态网页设计》课程和先修课程的理论及生产实际知识去分析和解决问题，进行的相关训练。

3.了解和掌握通用数据库的连接、数据的相关操作或网站的设计过程和进行方式，培养正确的设计思想和分析问题、解决问题的能力，特别是网站功能规划的能力和实现相关功能的能力。

4.培养动态网页设计的基本技能。

二、实训的内容

1.实训题目

选择与动态网页设计课程的主要教学内容相结合的设计课题。实训的课题是“网络导航条”，其具体内容如下：

①.匿名用户可以随意添加、删除、修改；

②.利用数据库查询数据；

③.编写相关代码主界面、附界面、利用数据库系统；

2.备选题目

①.网络留言版；

②.网络聊天室；

③.BBS论坛；

④.新闻发布系统；

⑤.在线购物系统；

⑥.图书馆管理系统。

三、实训的环境

1.前台开发工具：Dreamweaver CS4Flash CS4、Photoshop CS4。

①.利用Dreamweaver制作网站主页及其各链接层次的页面。

②.利用Flash制作网页所需用的动画。

③.运用Photoshop进行图像编辑处理。

2.后台开发工具：ASP、SQL Server

①.ASP动态服务器网页：建立网络数据库的链接，控制操作的流程。②.SQL Server：建立网络数据库和编辑查询网络数据库的语句。

四、实训的步骤

1.确定网站的主题、内容及功能；

2.网站的整体设计；

①.网站版式设计；

②.网站的目录结构和导航栏的设计；

③.数据库的设计；

④.功能设计。

3.网页的详细设计；

①.功能设计；

②.界面设计；

③.数据库设计；

④.处理过程设计。

4.网站的测试与发布；

5.网站的更新与维护。

五、实训的验收

学生必须将设计的所有资料送交指导老师验收。具体验收内容如下：

1.该题目的所有程序。

2.实训报告及设计说明书。

编写好之后，应交指导教师审阅，然后学生按规定的格式撰写。实训报告及设计说明书一律用A4打印纸正反两面打印，要有必要的插图、表格等，并装订成册。一般不少于3000字。

第二篇：动态网页asp实训报告

安徽商贸职业技术学院经贸系电子商务

(202_级)

动态网页设计

设计时间：202_年6月14日 至 6月18日

设计地点：电子商务实训室二班级：电子商务082班姓名:周 海 强

一、实训目的与意义

通过实验教学主要培养学生的动手能力，提高学生运用ASP编程工具编写动态网页能力的水平，掌握ASP网页下HTML标记、普通文本和脚本命令等的使用。利用ASP可以向网页中添加交互式内容（如在线表单），也可以创建使用HTML网页作为用户界面的web应用程序和CSS语言的应用，掌握在创建连接的“插入、查询、修改”与数据库连接等方法。综合运用所学ASP编程知识进行网页材料准备，并建设一个小型的电子商务网站。

二、实训时间

6月14日——6月18日

三、实训地点

电子商务实训室二

四、实训进度与计划

第一天：查看实训要求了解做什么网站，然后上网查看他人网站，之后规划自己的网站。

建一个文件夹，收集相关素材，并利用PhotoShop、Flash等多媒体制作软件

创作出一些多媒体作品，为网页制作进行网页的充分材料准备。

第二天：创建数据库，建立相关数据表，并连接图片地址等素材和输出的相关信息。1

第三天：编写主页页面的内容信息及其他导航栏的相关内容。

第四天：继续编写相关网页内容并做出最后的测试工作。

第五天：验收通过并提交网站作业。

五、实训步骤

1.构思网站总体规划及布局。

2.创建数据库，建立相关数据表。

3.在数据表中连接图片地址和输出的相关信息。

4.编写网页top头部的logo、导航栏和banner的相关信息。

5．运用ASP编写左边left的二级目录内容和底部boot的建站信息连接及

相关内容连接。

6.在主页主体main内容通过数据库输出相关的产品内容及信息和导航栏其他页面的内容。

7.编写注册/登陆、购物车、FAQ和留言系统等网页。（必要时建设后台管理系统）

8.测试网站并完善主页及各个子页，对不足之处做出相关改进的工作。

9.验收通过并提交网站作业。

六、实训心得与体会

经过一周的实训练习让我学到了许多知识,也有了很大的收获。这次实训让我明白了我们实训的主要目的是让我们通过不断的上机实习以及使用它来解决实际的问题，才能更好的掌握所学技能。实践出真理，在这一周的实训中确实很累但是累得有价值。学海无涯，好多好多的东西还在等待我们去努力的开发学习。我坚信，用血泪去做自己认为应该做的事，努力的开拓我们的极限，没有什么是不可能的。希望自己可以真正的化解这些知识为我所用！在以后的工作、生活和学习中，发展自己的优势，弥补自己的不足和缺陷。

七、合理化建议

对自己而言，多提升独立完成工作的能力和团队的合作能力。提升自我的审美能力，加强“美”的判断，提升网页的整体优化意识。多思考，多动手。学校可再提高机房的电脑的利用率，多置些“好”的机子，减少学生实训过程中的机子故障，提高效率。

以上报告内容会因实际情况而不同，但基本上就是这样的。2

第三篇：网页设计实训

网站名称：微言微语个人主页

班级：J09301班，J09302班

学生姓名：

指导老师：李向

实训时间：202_.12.6—202_.12.22

202_年下期网页设计课程实训报告

一、实习目的：

通过教学实习掌握站点制作、站点测试与发布技术。会综合利用Fireworks、Flash和Dreamweaver三个软件进行静态网站的设计。

二、实习内容：

1.用Fireworks处理图片。对图片裁剪、钝化、高斯模糊。设置图片的GIF动画格式，制作标题动画。对文字应用效果。利用Fireworks制作导航条并导出格式为html。

2.用Flash制作标题动画。首页中的动画不超过20M。制作按钮来超级链接到其他页面。

3.使用Dreamweaver布局视图，设置本地站点。在标准视图和布局视图模式相互转换。建议使用布局视图，在标准模式中插入层对象制作层动画，利用行为面板添加鼠标行为，制作翻转动画，使用CSS样式统一网页中文字样式，插入Fireworks中的GIF 文件及导入Flash中的SWF文档，设置文档间的超级链接。

三、具体要求：

1、利用Dreamweaver制作一个静态网站，要求网站有特色，整个网站的内容和形式要统一，应能够反映一个简单的主题。可以选择制作《个人网站设计》、《企业网站设计》、《文化网站的设计》、《娱乐网站设计》或者其他自己认为适合的网站。

2、作一个主页面，至少5个次页面。

3、必须用到框架、表格或层排版技术、Flash技术和图像处理技术，使网站具有合理的外观和功能。

4、主页基本要求：

页头Logo，准确无误地标识站点和企业标志；

网页标题动画，可以制作成GIF动画或者Flash动画；

导航条；

E-mail地址，用来接受用户垂询；

联系信息，如普通邮件地址或电话；

版权信息。

5、制作一个表单页面。

6、某个页面有滚动字幕。

7、为一个页面添加背景音乐。

8、至少添加一种行为效果。

9、整个网站各页面之间保持风格一致，页面之间要有合理的超级链接。

10、进行站点测试后申请免费空间并发布到网络。

四、网站设计思路：

本站应该算是一个人主页的小型网站。关于本站站名的来源：微言微语个人主页，因为，我觉得这个网站里面的所有文字都是像一个人在自言自语，在低声地向某人诉说着什么，没有主题，没有目的。取这个站名，是做了网站的大概构思后才取的，觉得，这个名字与网站的图片、背景音乐还有文字都很相符。

个人主页，一般都会包括首页，相册，链接，一些个人喜欢的文字加图片，我的个人主页也不例外，包括次首页（个人喜欢的的文章加图片），我的作品（里面包括自己做的三个FLASH动画），文章（一些自己喜欢的文章），相册（Firworks处理过的相册），关于（关于自己的文字，关于本站的一些说明），链接（世界著名网站的有关链接），反馈表（浏览者信息反馈表）。

五、网站设计过程：

把所有的素材都整理好（图片，文章，相片），开始布局。此站大多数用的是“三”字型的，三字型是我给它取的名字，因为，最开头是一张带有导航条的图片，用Firworks处理过的HTML文件，中间一大片用于放正文，下面就是版权信息，E-mail地址用来接受用户垂询；联系信息，如普通邮件地址或电话，像被分开的三个部分，所以我叫它三字型。这种布局方式看起来比较的整齐，简洁美观。

首页本想做一个动态网页，由于时间有限所以还没完全成功。只好用了一张与次页面一样的背景图片做背景，加上从下向上的滚动字幕，背景图片是用Firworks处理过的图片，大片的灰色墙壁加上颜色艳丽的钮扣图案，首页加了状态栏逐字出现的效果，加了“加入收藏”、“设为首页”等代码。

次页面包括如下些内容：首页、作品、文章、相册、关于、链接以及反馈表。这些页面是用模板做的，上面的图片，导航条以及下面的版权联系方式是不用改变的，都保持着首页的风格，背景图一样，字体与样式一样，图片风格一样。中间是两个可编辑区域。

在所有的页面导航条下面，插入层对象制作了一个层动画，来回移动的层，里面存放日期，利用行为面板为此层添加了鼠标行为，单击此层，会出现对话框，“欢迎您访问我的个人主页！”，做布局大多使用表格布局，使用了少量的css样式，字体，字号，颜色都统一套用相应的样式。

首页中添加背景音乐，小说音乐《我在那一角落患过伤风》，一边看慢慢上移的文字，一边听这轻柔的音乐，给人一种意境美。其实次页面添加《虫儿飞》，轻快而活泼。首页禁止右键复制功能，右键单击没有反应。

次首页，就是进入次页面的第一个页面。主题算是与青春有关的三种感情，三张图片，用Firworks处理，加上相应的文字。要用到两个表格，分别放在两个可编辑区域里面，一个1*2的表格，一个2*2的表格，第一个表格放一张有关于亲情的图片加一小段文字，第二个表格放一张有关于友情的图片加一小段文字,还有一张有关于爱情的图片加一小段文字。作品页面是三个FLASH动画，第一个是左右键控制的图片移动按钮，可以单击来链接到主页面（代码见附录），四个图片经过裁剪、高斯模糊。第二个是光芒四射（代码见附录），要用到ActionScript语言，长短不一的线条加上透明度的改变组成光芒四射。第三个是鼠标跟随特效（代码见附录）。文章页面，就是简单的文字页面，没有什么特别的。相册页面，上面是一个用Firworks处理后的一组图片，鼠标移到小图片上，下面做出现相应的大相片，中间有少量文字，底部是用FLASH做的一组循环滚动图片（代码见附录），图片跟着鼠标的移动而左右移动。关于页面，也是简单的文字页面，没什么特别的，“个人简历”文字链接到WORD文档“个人简历”(代码：

附录：源代码

(1)状态栏逐字出现的效果代码：

<script language=“JavaScript”>

var msg = “欢迎来到☆※◎~~~微言微语~~~☆※◎个人主页，请多提意见。谢谢!”;var interval = 120

var spacelen = 120;

var space10=“ ”;

var seq=0;

function Helpor_net(){

len = msg.length;

window.status = msg.substring(0, seq+1);

seq++;

if(seq >= len){

seq = 0;

window.status = '';

window.setTimeout(“Helpor_net();”, interval);

}

else

window.setTimeout(“Helpor_net();”, interval);

}

Helpor_net();

</script>

(2)首页收藏代码：

onClick=“window.external.addFavorite('”,“_blank”);}

六、实训中遇到的难点及解决办法：

在设计开始的时候，想的太多，不知道怎么开头，定哪个主题，背景，色调，文字，布局都没有头绪，后来，开始做，而且觉得越做越有头绪了，所以我觉得，还是不要想的太多，太复杂了，不要追求完美，不要做的网页太多，搞到最后，别人都不知道，你这个网站的主题

是什么了。

还有就是布局的时候总是不能做到很美观，后来，我把页面属性改了左过距为10，上边距为10，刚好把背景图片里面的那些亮丽的钮扣图案显示出来，改变了表格背景图的灰暗，使网页的整体看起来更美观了。

在做CSS样式表的时候，做字的颜色的时候，老是不知道用哪种颜色才搭配的起这个背景，后来，看到那个背景的钮扣颜色与灰色配起来很好看就用吸管取了钮扣的颜色了。

七、实训心得：

在我看来，设计网页，应该先策划，策划很重要，加上创意，配色很重要，技术与鉴赏能力是最主要的。建立站点的时候，各个文件夹取名的时候，最好用相应的英语，见名知意，如图片文件夹用image，网页文件夹用html。

在所有配色当中，不同的颜色传达着不同的意义也有不同的象征。如白色代表着：清洁、天真、洁净、真理、和平、冷淡、贫乏；灰色让人联想到灰尘、石头、水泥、白银，象征着中庸、平凡、温和、谦让，它给人以中立和高雅的感觉。太多的颜色会给人带来视觉上的疲劳。所以，在我下载准备素材的时候，就选择用灰色做背景颜色，灰色太贫乏，就加上亮色的钮扣起到“中和”的作用。

通过此次实训,我觉得平面设计的创意思维、版面设计、色彩配置、图形创意等方面都有很重要，对于网页制作来说，我觉得是一个以多学科设计为基础，受到包括视觉艺术、技术、内容的多种影响。网页设计的技术不算什么困难，真正困难的是网页的设计创意，文字我觉得也很重要，有些人浏览你的网页不是喜欢上你的艳丽漂亮的图片，也许是喜欢上你的文字，那种感动人心的，唯美的文字。文字与图片要搭得上调，不可能用一张美女图做背景，上面却写有关于亲情的文章。也就是整体的搭配问题。

通过此次实训，使我对于网页制作的三大软件有了进一步的了解，各功能都能够实现。提高了自己的鉴赏能力，综合搭配能力，也对以前学过的内容进行了综合的复习。

通过此次实训，我更了解到，生活中有许多色彩，搭配颜色的时候，联想到生活中的东西会做的更漂亮，给人一种亲切感，现在看到什么东西，我就会联想到做网页的时候，还有怎么布局。反正此次实训收获很多。

最后，我想，如果此次实训老师是要我们分组来做的话，也许，我们可以做得更好，因为，一个想的毕竟不全面，而且，一个人的申美有限，我们可以分工合作，一个人做一个方面的东西，也可以根据他所善长的方面来分工，善长动画制作的人做动画，善长图片处理的人做图片，善长文字与布局的就来布局。但是，也许那样，有些同学会懒的动手，推着给别人做

第四篇：网页设计综合实训

《网页制作综合实训》考核要求

一、课程考核

采用期末大作业与形成性考核相结合的方式。形成性考核占50分，视平时参加教学活动和作业完成情况而定；期末大作业考核占50分，根据期末大作业的完成而定。两方面成绩累计达到60分者为及格。

二、大作业要求

1．学生独立自主地完成源程序量（包含HTML、JavaScript、VBScript各种代码均算在内）在500行以上的动态Web程序。

2．本课程设计要求所有的脚本程序最终都可运行。

3.本课程设计中有关Web页界面设计部分可以用快速所见即所得类型的开发工具设计（比如FrontPage、Dreamweaver等）

4.可以借鉴一些源代码，但是禁止只对界面部分修改后冒充独立开发产品提交。

5.学生应按时(十六周前)、认真地完成课程设计，并作设计报告。

6.大作业电子稿上传至课程论坛/班级论坛！

第五篇：网页设计实训报告

重庆科创职业学院

《静态网站建设》 实 训 报 告

题目：

专业：班级：学号：姓名：成绩：指导教师：

完成日期：年月日

目录

一、课程设计目的....................1

二、课程设计题目描述和要求.....................1

三、课程设计报告内容...................1

3.1总体功能介绍...............................1

3.2总体框架结构设计..............................2

3.3页面设计.........................2

3.4总体测试与发布...........................2

四、结论......................2

五、结束语.........................3

六、主要参考资料....................3一、课程设计目的本课程是一门计算机科学与技术及相关专业实践性环节。以HTML和CSS为基础，全面介绍与网页设计制作有关的知识，向学生阐明Web基本工作机制，并使学生具有一般网页制作的能力。与此同时，通过对Web页制作技术和制作工具的学习，使学生对网页设计中所涉及的相关知识有一个全面的了解。通过本课程的学习，使学生全面了解网站建设与网页设计的基本概念、基本理论及业务运作模式，了解网站建设与网页设计的特点及工作过程，掌握网站的建立及网页设计制作的方法，能够完成一般性网站的建设，因此要求利用网页设计方法，设计一个网站，提高综合应用所学知识的能力，积累 Web 程序的编程经验，提高编程与调试能力，培养独立学习、吸取他人的经验、探讨技术的习惯和团队协作能力。

二、课程设计题目描述和要求

每个设计人员设计制作利用DIV+CSS网页布局方法制作的任意类型的网站（主题不限），制作网站所需的相关文字资料、图片资料等可以到相关类型的网站上进行采集或自行采集。

要求：根据上面指定的网站开发项目内容进行开发设计，网站栏目设置、网站要表达的具体内容和网站的风格根据小组确定的课题进行设计；要求根据网站设计规范和常用网制作页技术进行设计；设计的网站要求结构合理，版面美观大方，颜色合理，风格一致，并运用适当的动态网页技术进行修饰。

三、课程设计报告内容

3.1总体功能介绍

制作该网站的时代背景？该网站主要的功能是什么？可以实现哪些用途？主要使用的技术是什么？利用了哪些语言实现哪些效果……

3.2总体框架结构设计

该网站有多少个模块？层次关系是什么样子的？并且可以绘制一个流程图来进行进一步说明。

3.3页面设计

3.3.1首页（页面、设计思路、主要代码）

1．进行截图；

2．对设计思路进行说明。

3．将主要代码复制粘贴。

3.3.2各子页（页面、设计思路、主要代码）

1．进行截图；

2．对设计思路进行说明。

3．将主要代码复制粘贴。

3.4总体测试与发布

使用的测试方法是什么？

测试中遇到的问题以及解决的方法。

四、结论

写法要求：

1、概括地说明所进行工作的情况和价值，分析其优点和特色，指出创新所在，性能达到何种水平，并应指出其中存在的问题和今后的改进方向，特别是对工作中遇到的重要问题要着重指出，并提出自己的见解。篇幅不宜过长。

2、结论要简单、明确。在措辞上应严密，容易被人领会。应实事求是地介绍自己的工作成果，忌言过其实，在无充分把握时，应留有余地。

五、结束语

要求：在文章结尾处，通常以简短的文字，对设计过程中自己的收获，及工作过程中曾给自己以直接帮助的人员，例如指导老师、答疑老师及其他人员，表示自己的谢意。这不仅是一种礼貌，也是对他人劳动的尊重，是治学者应有的品质。

六、主要参考资料

[1]吴东伟等，《网页设计三剑客》，北京，清华大学出版社，202_年

[2]李宏，张敏，《网页设计与制作》，北京，化学工业出版社，202_年

[3]李桂杰，《网页设计与制作》，大连，大连理工大学出版社，202_年

[4]李英俊，《网页设计与制作》，大连，大连理工大学出版社，202_年

…………………………………………………………………………..(要求:五号字，宋体，1.5倍行距。按作者、书名、出版社、地点、出版时间格式逐一列出，中间用逗号格开)