网站建设实训报告样本.doc

网站建设实训报告样本

25
2020年4月19日
文档仅供参考
实训要求
5个人一组,每个组员分工合作完成一个公司的网站,例如
组员1负责:网站总设计,公共文件,设计公司LOGO,图片
组员2负责:用户浏览模块
组员3负责:系统管理模块
组员4负责:数据库设计
组员5负责:网站内容编写
每组确定一个公司的名字,定这个公司的主营产品展示,公司简介,新闻中心,企业文化等内容,联系我们页面就写每个组员的名字
1．站点结构与命名。
站点文件夹为班级学号姓名(如:网络061(华为)50张强)
站点文件夹中所包含文件夹:Images (存放图片文件)
Templates(存放模版文件)
Library (存放库文件)
other(存放其它文件)
source (存放自己设计的图形、动画文件)
其余视文件夹需要而添加,全部用英文命名
站点文件夹中所包含文件: index (首页)
*.css (样式表文件)
其文件余视需要而添加,全部用英文名
2.页面布局合理,色彩和谐,链接正确,图文并茂并茂。网站页面大小应该满足800*600分辨率的客户,兼顾1024*768分辨率。
主要图片和动画为原创(保存有源文件),主页标题图片(动画)必须为原创。
实训报告格式

<网站建设实训报告>

班级: __ 网络091___________
姓名: _ 王旭____ _

学号: _____27______________
指导老师: 鲁志萍
时 间: 6月 13日 —— 6月 24日
一、 实训目的
1. 进一步熟悉和掌握网站建设的基本流程和技术规范;
2. 巩固运用Dreamweaver网页制作软件制作网页、特别是制作动态网页的知识;
3. 巩固运用Fireworks图像处理软件进行网页中图形制作和运用flash动画制作软件设计网页中动画的知识;
4. 巩固综合运用Dreamweaver、Fireworks、flash三个软件完成网站建设任务的方法,能独立设计一个内容完整、图文并茂、技术运用得当的网站;
5. 具备独立撰写实训报告等科技文件的基本能力;
6. 在网页设计的实践中培养分析问题、解决问题的能力,培养协作、交流的能力,培养创新能力和团队意识;
7. 为今后从事网站开发、维护和管理奠定基础。
二、 总体设计
一、明确建立商业网站目标及用户需求
　　在互联网中,建设一个网站的目的,应该大家都明白的,在Web站点设计展现企业形象、介绍产品和服务、体现企业发展战略重要途径,因此必须明确设计站点的目的和用户需求,从而做出切实可行的设计计划。要根据消费者需求、市场状况、运营模式、企业自身情况等进行综合分析,牢记以”消费者(customer)”为中心,而不是以”美术”为中心进行设计规划。在这里想与大家说说一下,不论网站制作师设计什么类型的网站时,都要考虑到网站是以客户体验为中心来建设的,而不是考虑到个人的想法或为了追求好看而去设计一些对用户体验很差的网页,要以中小企业的发展及企业的产品风格去设计。
　二、网页设计:
展现企业形象,充分结合企业的CI(Corporate Identity),突出企业形象。
三、设计主题鲜明:
在目标明确的基础上,完成网站的构思创意即总体设计方案。对网站的整体风格和特色做出定位,规划网站的组织结构。做到主题鲜明突出,要点明确,以简单明确的语言和画面体现站点的主题。
整体布局合理,流畅,表示和谐;
在网站设计中,网站的整体布局是至关重要的一环,这将关系到浏览者能否清晰地、容易地找到所需的信息和内容的关键。每一个栏目、每一幅页面之间的相关性、连接都要充分考虑。
四、网站版式设计
　　网页设计作为一种视觉语言,要讲究编排和布局,虽然主页设计不等同于平面设计但它们有许多相近之处,应充分加以利用和借鉴。 版式设计经过文字图形的空间组合,表示出和谐与美。一个优秀网页设计者也应该知道哪一段文字图形该落于何处,才能使整个网页生辉。 多页面站点页面的编排设计要求把页面之间有机联系反映出来,特别要处理好页面之间和页面内的秩序与内容的关系。为了达到最佳视觉表现效果,应讲究整体布局合理性,使浏览者有一个流畅的视觉体验
五、使用软件,硬件和技术分析说明
对专业网页图像设计的FIREWORKS,三者被MACROMEDIA公司称为DREAMTEAM(梦之队),足见市场的反响和MACROMEDIA公司对它们的自信。说到DREAMWEAVER我们应该了解一下网页编辑器的发展过程,随着互联网(Internet) 的家喻户晓,HTML技术的不断发展和完善,随之而产生了众多网页编辑器,从网页编辑器基本性质能够分为所见即所得网页编辑器和非所见即所得网页编辑器(则原始代码编辑器),两者各有千秋。所见则所得网页编辑器的优点就是直观性,使用方便,容易上手,您在所见即所得网页编辑器进行网页制作和在WORD中进行文本编辑不会感到有什么区别,但它同时也存在着致命的弱点。
最佳的制作效率
　　Dreamweaver能够用最快速的方式将Fireworks,FreeHand,或Photoshop等档案移至网页上。使用检色吸管工具选择荧幕上的颜色可设定最接近的网页安全色。对于选单,快捷键与格式控制,都只要一个简单步骤便可完成。Dreamweaver能与您喜爱的设计工具,如Playback Flash,Shockwave和外挂模组等搭配,不需离开Dreamweaver便可完成,整体运用流程自然顺畅。除此之外,只要单击便可使Dreamweaver自动开启Firework或Photoshop来进行编辑与设定图档的最佳化。
网站管理
　　使用网站地图能够快速制作网站雏形、设计、更新和重组网页。改变网页位置或档案名称,Dreamweaver 会自动更新所有连结。使用支援文字、HTML码、HTML属性标签和一般语法的搜寻及置换功能使得复杂的网站更新变得迅速又简单。
无可比拟的控制能力
　　Dreamweaver是唯一提供Roundtrip HTML、视觉化编辑与原始码编辑同步的设计工具。它包含HomeSite和BBEdit等主流文字编辑器。帧(frames)和表格的制作速度快的令您无法想像。进阶表格编辑功能使您简单的选择单格、行、栏或作未连续之选取。甚至能够排序或格式化表格群组,Dreamweaver 支援精准定位,利用可轻易转换成表格的图层以拖拉置放的方式进行版面配置。所见即所得 Dreamweaver成功整合动态式出版视觉编辑及电子商务功能,提供超强的支援能力给Third-party厂商,包含ASP, Apache,BroadVision, Cold Fusion,iCAT, Tango与自行发展的应用软体。当您正使用Dreamweaver在设计动态网页时,所见即所得的功能,让您不需要透过浏览器就能预览网页。梦幻样版和XML Dreamweaver将内容与设计分开,应用于快速网页更新和团队合作网页编辑。建立网页外观的样版,指定可编辑或不可编辑的部份,内容提供者可直接编辑以样式为主的内容却不会不小心改变既定之样式。您也能够使用样版正确地输入或输出XML内容。
Dreamweaver还集成了程序开发语言,对ASP、.NET、PHP、JS的基本语言和连接操作数据库,都是完全支持的。
Access的优点
(1)存储方式简单,易于维护管理 Access管理的对象有表、查询、窗体、报表、页、宏和模块,以上对象都存放在后缀为(.mdb或.accdb)的数据库文件中,便于用户的操作和管理。 　　
(2)面向对象 Access是一个面向对象的开发工具,利用面向对象的方式将数据库系统中的各种功能对象化,将数据库管理的各种功能封装在各类对象中。它将一个应用系统当作是由一系列对象组成的,对每个对象它都定义一组方法和属性,以定义该对象的行为和外国,用户还能够按需要给对象扩展方法和属性。经过对象的方法、属性完成数据库的操作和管理,极大地简化了用户的开发工作。同时,这种基于面向对象的开发方式,使得开发应用程序更为简便。 　　
(3)界面友好、易操作 .Access是一个可视化工具,是风格与Windows完全一样,用户想要生成对象并应用,只要使用鼠标进行拖放即可,非常直观方便。系统还提供了表生成器、查询生成器、报表设计器以及数据库向导、表向导、查询向导、窗体向导、报表向导等工具,使得操作简便,容易使用和掌握。 　　
(4)集成环境、处理多种数据信息 　　Access基于Windows操作系统下的集成开发环境,该环境集成了各种向导和生成器工具,极大地提高了开发人员的工作效率,使得建立数据库、创立表、设计用户界面、设计数据查询、报表打印等能够方便有序地进行。 　　
(5)Access支持ODBC(开发数据库互连,Open Data Base Connectivity),利用Access强大的DDE(动态数据交换)和OLE(对象的联接和嵌入)特性,能够在一个数据表中嵌入位图、声音、Excel表格、Word文档,还能够建立动态的数据库报表和窗体等。Access还能够将程序应用于网络,并与网络上的动态数据相联接。利用数据库访问页对象生成HTML文件,轻松构建Internet/Intranet的应用。
(6)支持广泛,易于扩展,弹性较大 　　能够将经过链接表的方式来打开EXCEL文件、格式化文本文件等,这样就能够利用数据库的高效率对其中的数据进行查询、处理。还能够经过以Access作为前台客户端,以SQL Server作为后台数据库的方式(如ADP)开发大型数据库应用系统。总之,Access是一个既能够只用来存放数据的数据库,也能够作为一个客户端开发工具来进行数据库应用系统开发;即能够开发方便易用的小型软件,也能够用来开发大型的应用系统。
六、网站空间的构成和虚拟现实
　　网络上的虚拟空间是一个假想空间,网站只能经过这个空间来把她展现到互联网上,让每一个人都能在网络上看到你的网站设计与网站中的信息,这种空间关系需借助动静变化.图像的比例关系等空间因素表现出来。 制作网站的同时,都要上传页面中,图片、文字位置前后叠压,或页面位置变化所产生的视觉效果都各不相同。图片、文字前后叠压所构成的空间层次当前还不多见,网上更多的是一些设计比较规范、简明的页面,这种叠压排列能产生强节奏的空间层次,视觉效果强烈。
　　七、多媒体功能的利用
　　传统的宣传也就是永远不可缺少的,多媒体宣传方面真正是一个品牌宣传的不重要模式,同时网络资源优势之一是多媒体功能。要吸引浏览者注意力,页面内容能够用三维动画、FLASH等来表现。但要注意,由于网络带宽限制,在使用多媒体的形式表现网页内容时应考虑客户端的传输速度。
　　八、网站内容要每天保持更新
　　一个网站建设已完成了,那要如何去增加和丰富网站的内容呢!也要企业Web站点建立后,要不断更新内容。站点信息的不断更新,让浏览者了解企业的发展动态和网上职务等,同时也会帮助企业建立良好形象。 在企业Web站点上,要认真回复用户的电子邮件和传统的联系方式如信件.做到有问必答。最好将用户用意进行分类,如售前一般了解.售后服务等,由相关部门处理,使用站访问者感受到企业的真实存在并由此产生信任感。 注意不要许诺你实现不了的东西,在你真正有能力处理回复之前,不要恳求用户输入信息或罗列一大堆自己不能及时答复的电话号码。 如果要求访问者自愿提供其个人信息,应公布并认真履行个人隐私保承诺。
网站地图:

企业网站的总体规划图:

三、 详细设计
设计实现:企业网站主要有两个模块。一是前台用户浏览模块,二是后台管理模块。前台管理模块主要作用用于企业网站的展示(公司简介,新闻中心,产品展示、企业文化)和互动(留言板、联系我们)同时提供后台管理的接口。后台管理系统包括四个方面:企业信息管理、新闻管理、产品管理留言管理。企业信息管理包括公司介绍、联系我们、企业文化。新闻管理包括新闻列表、添加新闻、产品管理包括产品类别设置、添加产品类别、产品管理、添加产品。留言管理包括留言列表。整个系统的数据库采用Access数据库,对于小型企业网络相比SQLserver来说比较合适本系统。Access相比其它数据库操作方便,简单易懂对于刚开始接触数据库的用户来说比较容易上手,能够更好的对企业内的数据进行管理。本系统数据库名为company。包含Admins、Intro、Message、New、NewsType、Product、productType数据表

个数据表的数据内容
Admins:

Intro:

Message:

New:

NewsType:

Product:

productType:

数据表之间的联系

页面的设计使用DW(Dreamweaver)进行设计开发。开发语言使用Java语言,ASP平台进行开发。
主界面
主页是一个网站的门户,一般是用户进入网站浏览的第一个页面。本系统的主页是
default.asp 文件。这个页面的上部有链接到其它页面的导航,主要位置是企业的相关介绍,
页面左侧的”网站公告”和”公司简介”两个模块分别引用的是文件l_bulletin.asp 和
l_profile.asp。点击”公司简介”下面的”公司介绍”、”联系我们”和”企业文化”相应的内容在页面的右侧显示。

公司简介
”公司简介”包含三项内容,分别是”公司介绍”、”联系我们”和”企业文化”,经过点
击页面左侧的导航能够在页面右侧打开。”公司简介”的三项内容存入数据库Intro 表中,要显示某一项内容,在每次调用intro.asp 文件时把字段 IntroName 的值传递给参数type,并经过语句rs("Click_Num") = rs("Click_Num")+1统计文件被访问次数。

联系我们界面

留言板界面
guestbook_add.asp 文件显示留言板页面,在这个页面用户能够在线留言。
guestbook_add.asp 采用模块化设计,页面左侧引用l_news.asp 文件和l_product.asp 文件,页面右侧引用msg.asp 文件。

企业文化

新闻中心界面
news.asp 文件的主要作用是显示所有新闻列表,包括新闻类型、新闻标题和更新时间,
对于当日新闻给予标示。
news_info.asp 文件的主要作用是显示某一新闻的详细内容,包括新闻题目、新闻内容和
发布时间及阅读次数。

管理员登陆界面
系统管理模块的主要作用是对网站信息进行管理,如对信息作添加、修改和删除等操作。
主要分为企业信息管理、新闻管理、产品管理和留言管理四个部分。
为了网站文件管理方便,在company 文件夹中创立一个新目录Admin,用于存放系统管
理模块的相关文件。
管理员登录模块主要由三个文件实现,管理员登录文件login.asp、验证管理员登录信息
文件chkadmin.asp 和检测管理员是否登录文件chklogin.asp。

产品管理界面
产品管理由八个文件实现,分别是添加产品文件 product_add.asp、查看产品列表文件
product_list.asp、修改产品文件product_modify.asp、保存修改结果文件product_save.asp、删除产品文件product_del.asp、添加产品类型文件product_type_add.asp、修改产品类型文件
product_type_modify.asp 和查看产品类型文件 product_type_list.asp。

产品类别设置界面

公司介绍修改界面
企业信息管理主要由 intro_list.asp 来实现。企业信息有三个项目,分别是公司介绍、联
系我们和企业文化。intro_list.asp 文件能够完成这三个项目内容的修改和查看。

联系我们修改界面

产品添加界面
product_add.asp 文件中设计了一个表单,用于接收产品类别、产品名称、关键字、产品
图片和产品说明等信息,并对部分表单内容进行检查。

产品类别设置界面
设计一个表单,用于接收产品类型信息,将接收的数据保存到数据库,返回产品类型列
表界面。

新闻列表界面
经过 QUERYSTRING 集合获取四个参数:page、act、type和id,根据act 参数的值判断
是否删除相应记录并分页显示新闻列表。

新闻添加界面
经过 REQUEST 对象的QUERYSTRING 集合获取两个参数:act 和type,用SQL 语句找
到添加记录的新闻类型编号,最后将记录添加到数据库中。

四、 结束语
经过这两周的实训,建设网站,其中遇到的种种问题也随着查找资料、浏览相关网站、老师的指导、同学的帮助之下完成了自己组的网站建设。从制作过程中,我运用了更多以前从未运用的技巧,这使我学到了更多的知识。而且为我自己的网站建设积累了许多经验,为我以后的工作经验,走上社会积累了一些丰富的经验。经过这次实训我获得了许多,我自己感觉在知识、技能等方面都有了不少的收获。
五、实训中遇到的问题和解决方法
这次实训让我更加进一步的了解相互合作的重要性,相互分工合作比起之前各做各的所用时间少了很多,也让我们知道相互配合的重要性,其实我遇到的问题比较多,比如打代码比较繁多,很让人耐不住性子,比如要画图,要制作数据库表的设计,很多,很麻烦,可是把这些繁重的工作做完,也蛮有成就感的,因此我的这部分工作最主要的是要耐下心来做,耐下心来时,会发现时间过得很快,这也是我以后要注重的地方。另外该网站还有许多不尽人意的地方,网站还存在以下一些问题:
(1)系统在安全性方面还有一些问题;
(2)系统的某些功能还不能够很好的实现,同时本系统还某些方面没有考虑到;
因此,以后还应加强这几个方面的工作和学习:对网站的安全管理方面的学习和加强;对一些常见的应用软件还要多熟悉;更多地加强对关于网络功能数据库知识的学习。