馨然家居装饰有限公司网站毕业设计说明书

1、许昌职业技术学院信息工程系2010级毕业实习报告目 录第一章 绪 论31.1 设计背景31.2 设计工具及技术31.2.1 dramweaver简介41.2.2 js技术简介41.2.3 iis技术简介41.2.4 access简介5第二章 需求分析62.1 总体需求分析62.2 核心功能分析72.3 预期目的7第三章 系统设计83.1 网站总体设计83.1.1 网站首页83.1.2 公司简介83.1.3 后台管理83.2 数据库技术8第四章 网站的实现104.1 主界面设计104.1.1 首页104.1.2 公司简介154.1.3 新闻中心154.1.4 推荐商品154.1.5 产品展示16

2、4.1.6 最新活动164.1.7 招贤纳士174.2 后台管理界面设计174.2.1 后台管理界面174.2.2 后台管理界面174.2.3 后台退出界面17第五章 总结与展望19致 谢20第一章 绪 论1.1 设计背景随着中国的入世和国际互联网使用的迅速普及，企业建立网站已成为和商标注册同样重要的大事。由于因特网具有传播信息容量极大、形态多样、迅速方便、全球覆盖、自由和交互的特点，已经发展成为新的传播媒体，现在很多的大学和社会其他部门都已经建立了网站，通过计算机网络实现宣传、交流及资源的整合。所以企业要想树立自己的形象和加快发展的步伐，一个好的网站是不可缺少的。馨然家居装饰有限公司网站会给

3、公司带来的效益有：网站是公司的“商标”。 在这个高度信息化的社会里，建立自己网站是最直接的宣传手段。网站的超时空特性，不仅能让地区内的人们了解企业，更可让世界了解公司。提升公司形象。公司网站的建立可以为公司树立公司良好的形象，提高公司层次。无论是从互联网上还是通过传统方式与客户接触，拥有网站的您当然比还没有建立网站的企业更具竞争力，是否拥有网站亦是一种公司实力的象征。宣传公司服务内容。国际互联网作为一个信息传播的媒介，能够充分的为您宣传企业和产品。在全世界任何一个地点，在任何时间，您的公司和产品都能够吸引客户的眼球。这与您在报纸上刊登通栏广告的效果和费用相比，具有无法比拟的优势。馨然家居装饰有

4、限公司网站的建立，使公司的工作方式,效率发生改变,为宣传公司起到一个促进作用,同时可以成为一个与客户交流的平台,是客户对公司信誉的提高的途径之一。1.2 设计工具及技术本设计的主要任务是在线浏览网站的设计与实现，整个网站的设计工作主要分三大步进行，首先是相关资料的收集和与相关人员的沟通和交流，随后是网站的实质性设计，最后是网站的测试工作。整个工作从4月中旬开始，至5月底基本结束。网站的图片资料及其各种信息都有馨然家居装饰有限公司提供，网站的网页主要由dream weaver8.0结合js技术设计，以flash8.0为辅助作图工具，其中后台数据库为access 2003，asp网页和数据库的链接

5、采用vbscript脚本语言，整个系统以windows xp+iis作为web服务器。在这个网站中，我对网站的要求进行了详细的研究,并查阅了大量的资料,然后提出了设计方案。系统分为前台和后台两部分,前台主要作用是图片、搜索。后台主要作用是用户管理、信息管理。采用动态网页及数据库相结合的方法来进行设计,鉴于js在设计动态网页上的优势地位及其对数据库的良好支持,因此选择它来制作动态页面。1.2.1 dramweaver简介创建网页的工具有很多，最原始的如记事本，还有微软公司的frontpage，等等。在本网站设计过程中，所用到的是macromedia公司的dreamweaver。使用dreamwe

6、aver这一网页编辑器，省去了很多代码的编写工作，使得设计者不必编写html代码，便可以制作出精美的网页。macromedia dreamweaver是一款优秀的“所见即所得”的网页编辑器，dreamweaver的可视化特征使用户可以直接在页面上添加和编辑元素，而不用写一行代码。例如通过鼠标拖曳来添加图像、表格等元素，在文档中直接输入输入文本，还有直接插入一些常用的符号和对象等等。我们在没有输入代码的情况下完成了这些工作，dreamweaver自动将结果转换为html源代码，在代码视图中进行修改，这点是为专业人士考虑的，同时也方便初学者学习掌握html语言。1.2.2 js技术简介javasc

7、ript是一种基于对象和事件驱动并具有相对安全性的客户端脚本语言。同时也是一种广泛用于客户端web开发的脚本语言，常用来给html网页添加动态功能，比如响应用户的各种操作。它最初由网景公司（netscape）的brendan eich设计，是一种动态、弱类型、基于原型的语言，内置支持类。javascript是sun公司的注册商标。ecma国际以javascript为基础制定了ecmascript标准。javascript也可以用于其他场合，如服务器端编程。完整的javascript实现包含三个部分：ecmascript，文档对象模型，字节顺序记号。netscape公司在最初将其脚本语言命名为l

8、ivescript。在netscape在与sun合作之后将其改名为javascript。javascript最初受java启发而开始设计的，目的之一就是“看上去像java”2，因此语法上有类似之处，一些名称和命名规范也借自java。但javascript的主要设计原则源自self和scheme3。javascript与java名称上的近似，是当时网景为了营销1考虑与sun公司达成协议的结果。为了取得技术优势，微软推出了jscript来迎战javascript的脚本语言。为了互用性，ecma国际（前身为欧洲计算机制造商协会）创建了ecma-262标准（ecmascript）。现在两者都属于ecm

9、ascript的实现。尽管javascript作为给非程序人员的脚本语言，而非是作为给程序人员的编程语言来推广和宣传，但是javascript具有非常丰富的特性。1.2.3 iis技术简介因特网信息服务器iis（internet information server）是microsoft公司的一种集成了多种internet服务（www服务、ftp服务）的服务器软件，利用它，可以很容易的构造web站点。由于同一家公司的产品，iis和windowsxp/2000紧密地集成在一起，可以充分利用windowsxp/2000的多种功能，其安全机制也以windowsxp/2000的ntfs安全机制为基础，

10、因此可以实现用iis构建web站点的安全性。1.2.4 access简介microsoft office access是由微软发布的关联式数据库管理系统。它结合了 microsoft jet database engine 和 图形用户界面两项特点，是 microsoft office的成员之一。其实access 也是微软公司另一个通讯程序的名字，想与 procomm 以及其他类似程序来竞争。可是事后微软证实这是个失败计划，并且将它中止。数年后他们把名字重新命名于数据库软件。另外，access还是c语言的一个函数名和一种交换机的主干道模式。access的优点存储方式单一，access管理的对象

11、有表、查询、窗体、报表、页、宏和模块，以上对象都存放在后缀为（.mdb）的数据库文件种，便于用户的操作和管理。 面向对象，access是一个面向对象的开发工具，利用面向对象的方式将数据库系统中的各种功能对象化，将数据库管理的各种功能封装在各类对象中。它将一个应用系统当作是由一系列对象组成的，对每个对象它都定义一组方法和属性，以定义该对象的行为和外国，用户还可以按需要给对象扩展方法和属性。通过对象的方法、属性完成数据库的操作和管理，极大地简化了用户的开发工作。同时，这种基于面向对象的开发方式，使得开发应用程序更为简便。 界面友好、易操作：access是一个可视化工具，是风格与windows完全一

12、样，用户想要生成对象并应用，只要使用鼠标进行拖放即可，非常直观方便。系统还提供了表生成器、查询生成器、报表设计器以及数据库向导、表向导、查询向导、窗体向导、报表向导等工具，使得操作简便，容易使用和掌握。 集成环境、处理多种数据信息，access基于windows操作系统下的集成开发环境，该环境集成了各种向导和生成器工具，极大地提高了开发人员的工作效率，使得建立数据库、创建表、设计用户界面、设计数据查询、报表打印等可以方便有序地进行。 access支持odbc（开发数据库互连，open data base connectivity），利用access强大的dde（动态数据交换）和ole（对象的联

13、接和嵌入）特性，可以在一个数据表中嵌入位图、声音、excel表格、word文档，还可以建立动态的数据库报表和窗体等。access还可以将程序应用于网络，并与网络上的动态数据相联接。利用数据库访问页对象生成html文件，轻松构建internet/intranet的应用。access的缺点 access是小型数据库，既然是小型就有他根本的局限性，以下几种情况下数据库基本上会吃不消：数据库过大，一般access数据库达到50m左右的时候性能会急剧下降！ 网站访问频繁，经常达到100人左右的在线。 记录数过多，一般记录数达到10万条左右的时候性能就会急剧下降！第二章 需求分析2.1 总体需求分析本企业

14、网站是公司重要的对外窗口，通过该网站，应能很好地对访问者传达企业的基本情况、展示的产品质量。本网站根据“以宣传为功能目的、以稳定性为技术目标”的设计思想进行分析，按照系统开发的基本观点对网站进行分解，从内容上可对网站作如下划分：(1)首页：设有产品查询，推荐产品等，对本网站的具体内容具基本概括。(2)家装常识：对本公司的介绍，让商家对本公司有着新的认识。(3)行业咨询：发布一些最新的数码信息。(4)推荐产品：作为卖家给各位商家的推荐产品。(5)产品展示：展示出本公司的所有商品。 (6) 联盟动态：设有来访人登录，注册等信息，可以在此网页上自由发表言论(7) 招贤纳士：招贤纳士，希望有贤之士来应

15、聘。(8)服务与承诺：服务每一位顾客，做到保质保量。功能模块如图2-1，后台功能模块如图2-2和后台系统流程图如图2-3。网站页面首页家装常识建材养护联盟商家联盟动态家装美图行业资讯招贤纳士图2-1功能模块图网站后台管理家装常识家装美图行业资讯联盟动态最新活动联系我们询盘管理招贤纳士增加产品信息删除产品信息编辑产品信息企业新品信息添加产品系列删除产品系列图2-2后台功能模块图2.2 核心功能分析新品速递是公司在网站上发布产品信息，是企业建设必须的也是最重要的。企业的产品数据会经常那个变化，以静态网页形式发布产品已经不适应这变化需求了，本网页的前台是用户可以通过页面浏览查询，后台管理可以管理个类

16、商品的价格、简介、样图等多类信息。本系统具有管理功能强大，速度快，可扩充能力等特点。2.3 预期目的为了提高装饰公司的知名度,同时也为了可以成为一个与客户交流的平台,提高数码产品的信誉，此网站对数码产品的各方面都做了详细的展示和介绍，此网站可以更好展示给大家，能得到更多消费者的亲睐。20许昌职业技术学院信息工程系2010级毕业实习报告第三章 系统设计3.1 网站总体设计3.1.1 网站首页本网站的首页别具一格，简单又好看。分为块十个主题：首页、家装常识、建材养护、联盟商家、行业资讯、联盟动态、联盟商家、行业资讯、联盟动态、家装美图、招贤纳士、最新活动、联系我们，这几块，其实首页也不用做的很复杂

17、的，只要突出主题就行了。3.1.2 公司简介企业简介页面主要介绍了企业的发展历史，以及企业的现今状况，重点突出了质量方针是: 严格控制、不断创新、品质至上、用户为先。页面清楚简单，一目了然，使访问的客户能够第一时间了解公司。3.1.3 后台管理通过后台管理员登陆后台管理界面，对访问者的留言及遇到的问题进行及时的交流与回复。如图3-1所示。开始用户登录失败重试管理所有用户的信息管理所有网站的信息管理员图3-1后台系统流程图3.2 数据库技术数据库(database)，是按照数据结构来组织、存储和管理数据的仓库，是用于查询的大量数据的存储区域。使用数据库可以带来许多好处：如减少了数据的冗余度，从而

18、大大地节省了数据的存储空间，实现数据资源的充分共享等等。近年来推出的计算机关系数据库管理系统，还具有操作直观，使用灵活，编程方便，功能强大，环境适应广泛，数据处理能力极强等诸多优点。总的来说，数据库的设计对系统的经济性、功能性和效率有很大的影响，一个好的数据库，要求在设计时尽量避免数据的多余，另外，还要尽可能提高数据的存取速度。数据库设计时速度与空间在范式上是相互矛盾的。一方面按规范化理论的要求，关系模式应尽量取高级范式，尤其对记录数较多的关系，低级范式将会造成存储的大量重复，是空间遭受严重浪费；另一方面从存取速度上考虑，应该尽量做到一个模式涉及的属性越多越好，相互运算越少越好，这样，又应取低

19、级范式。因此我们在设计数据库时要严格地探讨它的使用环境，充分了解用户的需求，清楚地掌握数据库系统的特点。经过综合的评价和分析后设计出的数据库应满足以下要求：l 数据库信息要能充分体现出用户使用系统的需求。 l 能够支持用户对数据进行的所有处理。l 能够容易被数据库管理系统运行维护。l 数据一致性、完整性好，无更新异常。许昌职业技术学院信息工程系2010级毕业实习报告第四章 网站的实现4.1 主界面设计本主界面为index.asp，通过dreamweaver 8中的功能，制作出js动态页面，它是由top.asp,ingin.asp,left.asp这些模块组成。4.1.1 首页对本网站的具体内容

20、具基本概括，如图4-1所示。首页设计的部分代码： <div class="top"> <div class="logo"></div> <div class="biaoyu"></div> <div class="link_top"> <a title="设为首页" onclick="this.style.behavior='url(#default#homepage)'this.sethom

21、epage('');" href="javascript:;">设为首页</a>| <a href="javascript:addcookie();">加入收藏</a>| <a href="call_us.html">联系我们</a> </div> <div class="jiameng_line">联盟热线lt;/div> </div><div s

22、tyle="clear:both;"></div><!-导航-><div class="menu"><div class="menu_ul"><a href="index.html">首页</a><a href="jia_changshi.html">家装常识</a><a href="cai_yanghu.html">建材养护</a><a hre

23、f="lm_shangjia.html">联盟商家</a><a href="hang_zixun.html">行业资讯</a><a href="lm_dongtai.html">联盟动态</a><a href="jia_meitu.html">家装美图</a><a href="zhao_xianshi.html">招贤纳士</a><a href="zui_huodon

24、g.html">最新活动</a><a href="lx_us.html">联系我们</a></div></div><!-中间-><div class="middle"><!-flash-><div class="flash"> <div id="cu3er_swf"> <a href=" <img src=" alt="get adobe

25、flash player" /> </a> </div></div><!-01-><div class="tab_01"> <!-图片特效-> <div class="ind_shipin_img"><div class="img_shi"> <script type="text/javascript" src="js/newspiclb_dolphin.js" ><

26、/script><div id=imgadplayer></div><div class="picfit"><script> pimgplayer.additem( "", "#", "images/r1.png"); </script></div><div class="picfit"><script> pimgplayer.additem( "", "#&quo

27、t;, "images/r2.png"); </script></div><div class="picfit"><script> pimgplayer.additem( "", "#", "images/r3.png"); </script></div><div class="picfit"><script> pimgplayer.additem( "", &

28、quot;#", "images/r4.png"); </script></div> <div class="picfit"><script> pimgplayer.additem( "", "#", "images/r5.png"); </script></div><script>pimgplayer.init( "imgadplayer", 300, 200 );$(functi

29、on() $().picfit("fill"););</script> </div> </div> <!-家装常识-> <div class="best_active"> <div class="best_active_top"><span class="best_word">家装常识</span> <span class="best_more"><a href="#&qu

30、ot;><img src="images/more.gif" width="42" height="13" /></a></span> </div><div class="best_active_middle"> <ul> <li> <div class="best_active_time">2013.5.8</div> <div class="best_active

31、_title"><a href="#">家装常识-家电类的注意事项</a></div> </li> <li> <div class="best_active_time">2013.5.8</div> <div class="best_active_title"><a href="#">家装常识-家电类的注意事项</a></div> </li> <li&

32、gt; <div class="best_active_time">2013.5.8</div> <div class="best_active_title"><a href="#">家装常识-家电类的注意事项</a></div> </li> <li> <div class="best_active_time">2013.5.8</div> <div class="best_act

33、ive_title"><a href="#">家装常识-家电类的注意事项</a></div> </li> <li> <div class="best_active_time">2013.5.8</div> <div class="best_active_title"><a href="server_pice.html">家装常识-家电类的注意事项</a></div> &

34、lt;/li></ul> </div> </div> <!-网站简介- <div class="gonggao"> <div class="best_active_top"><span class="best_word">最新活动</span></div> <div class="gg_middle"> <div class="gg_roll"> 尼尔诺移门，中国著

35、名品牌，绿色建材产品，cctv上榜品牌，活动期间，交300元定金，抵600元使用，预付定金双倍返。还在等什么，心动不如行动还在等什么，心动不如行动还，心动不如行动还在等什么，心动不如行动还在等什么【<a href="#">详细</a>】 </div></div> </div></div><!-友情-><div class="youqin"> <p> 友情链接： <a href="#">馨然家居</a>&l

36、t;a href="#">馨然家居</a> <a href="#">馨然家居</a> </p> </div></div>4.1.2 公司简介对本公司的介绍，让商家对本公司有着新的认识，如图：4-2所示。图4-2公司简介4.1.3 新闻中心发布一些最新的数码信息, 如图4-3所示。图4-3新闻中心4.1.4 推荐商品作为卖家给各位商家的推荐产品，如图4-3所示。图4-4推荐商品4.1.5 产品展示展示出本公司的所有商品，如图4-5所示图4-5产品展示4.1.6 最新活动设有来访人登录，注册等信息，可以在此网页上自由发表言论，如图4-6所示。图4-6留言反馈4.1.7 招贤纳士招贤纳士，希望有贤之士来应聘，如图4-7所示。图4-7招聘信息4.2 后台管理界面设计4.2.1 后台管理界面在对系统进行管理之前，需要通过系统的身份认证。本站中使用/site-manage/login.asp进行身份验证。只有用户名和密码正确