Web前端技术课程实训报告.pdfVIP

Web前端技术课程实训报告

《Web前端技术课程设计》报告

一、实训课题名称

二、课题设计目的

通过实训，应使学生巩固所学知识，把所学的理论知识运用到网

站制作实践中。

培养学生动手能力，将PS制作效果图、HTML、CSS+DIV网页

布局、JavaScript等Web前端开发技术结合起来，在实训环节中进行

运用。为以后学习动态网站打下基础。三、实现功能：

用PhotoShop、DreamWeaver等开发工具制作一个由静态网页

构成的简单网站，要求包括一个首页、至少三个子网页，按照网站开

发流程，先做网页效果图，然后制作网页素材、构建网站文件结构、

规划网页布局、制作网页动画、实现网页功能，尔后进行网站测试，

并编制出各阶段必要的文档。在编写文档时，必须严格遵照要求，最

后提交文档。

功能要求：该网站首页必须包括网站logo、导航条（带有鼠标事

件变化效果）、banner（简单flash动画）、图片、多媒体运用、文

字等主要信息展示；子网页包括用户注册（带有表单输入项本地验证

功能）、登录（用户名和密码非空验证）、子网页相关栏目。各页面

之间通过超链接切换。

最后要求提交详细的课程设计报告及网页效果图（.psd）和网站

运行文件，现场运行验收开发的系统。

四、课题设计内容：

（1）开发背景

（2）网站分析设计部分

1）客户需求分析

●网站栏目划分

●栏目内容介绍

●网站拓扑图

●网页风格创意设计

2）网站风格定位

3）网站建设方案

4）网站效果图

（3）网站制作部分

1）效果图制作

2）网页素材及网站架构制作

3）首页制作页面设计

4）子页面制作

五、体会及下一步学习方向

教师评语

参考方案：

目录

开发背景(4)

前期准备(4)

客户需求分析(4)

网站风格定位(5)

色彩(5)

排版(5)

特效(6)

网站建设方案(6)

网页风格创意设计(7)

网站栏目划分(7)

栏目内容介绍(8)

网站拓扑图(9)

实训目的(10)

实训任务(10)

实训项目(11)

网站基本介绍(11)

报名界面(10)

保存的文件位置(11)

首页展示效果图(12)

导航条展示效果图(13)

留言板表格布局(14)

网站版权的展示图(14)

国内黑客网站界面展示图(15)

黑客新闻界面展示图(16)

电影展示图(18)

黑客简介界面展示图(20)

黑客区别界面展示图(21)

黑客分类界面展示图(22)

实训中的问题和解决办法(23)

实训体会(24)

一、开发背景

如今已是信息化时代，很多网络中的强盗已经将魔爪伸向我们每

一个网民。由此可见关于了解黑客以及黑客攻防方面的知识和新闻是

很有必要的。黑客学习网一直致力于面向全球华人提供最新的黑客新

闻、最先进的黑客攻防技术，力求将黑客学习网打造成网民每天必看

的学习网站！

二、前期准备

本网站是以信息安全类为主体设计，系统的介绍了黑客攻防的新

闻的知识。

三、客户需求分析

客户需求是指客户创建本网站的目的和对网站建设提出来的特定

的要求。

了解客户的需求，是建好黑客学习网站的前提。黑客学习网站通

过互联网可以更好的开展信息技术的交流、学习和网上报名等活动。

这样可以提高网站的访问量、知名度，也是网站业务的重要来源。客

户对其拟建的黑客学习网站提出的主要要求有以下几点：

1、宣传信息安全的重要性，提高人们对信息安全的认识，增加网

站的知名度。

2、适时地发布最新黑客新闻和技术，为学习者提供最佳资源。

3、在网上发布报名表，引