毕业生网站设计之雅芳产品汇编网

1、61/71石家庄邮电职业技术学院毕业设计 毕业设计毕业生网站设计雅芳产品大全网站 2009 届 电信工程 系专业 计算机通信 学号 50405414 姓名 谷红玉 指导教师 杨延广 完成日期 2008年石家庄邮电职业技术学院毕业设计任务书姓 名谷红玉学号50405414专 业计算机通信班 级04五年制计通4毕业设计题目企业产品销售网站制作-雅芳产品大全网指导教师姓名杨延广职称或职务教授工作单位石家庄邮电职业技术学院电信工程系毕业设计内容、差不多要求、重点研究问题、要紧设计方法（或步骤）：一、 设计内容用所学的网页设计知识，制作一个雅芳产品销售的网站，通过网站能够宣传企业产品、公布销售信息，通过

2、在线语聊或留言的方式，及时的了解顾客的需求，客户能够通过网站了解企业产品，网站功能应包括产品扫瞄、购物车、产品收藏、在线语聊或留言等。上传购买信息等，企业能够方便更新产品信息。二、 差不多要求1查阅相关技术资料。2完成系统需求分析、系统总体设计、详细设计。3完成网站的调试和实现购买产品的目的。4按要求的格式完成毕业设计报告。三、 重点研究问题B/S网站开发技术，产品展示，产品购买实现途径。四、 要紧步骤确定需求、设计总体方案、制作网页、调试、撰写报告。要紧参考文献、资料：1 庄王健，网页设计三剑客白金教程，北京电子出版社。2006年2 张祖鹰，网页制作有用技术Dreamweaver，大连理工大

3、学出版社，2007年3 丁群，网页设计与制作，中国打算出版社，2008年4 胡崧，Flash8标准教程。北京青年出版社，2006年打算进度毕业设计要求在2008年12月底完成，2009年1月初答辩，进度安排：10月：与老师沟通，明确设计任务，确定总体思路。11月： 查资料，需求分析、 系统总体结构设计、数据库设计、功能设计12月： 详细设计、网站上机调试实现，撰写毕业设计报告11月下旬：中期检查12月下旬：提交正式毕业设计和报告要求每时期向老师汇报进展情况。指导教师签字： 年 月 日石家庄邮电职业技术学院毕业设计评定书姓 名谷红玉学 号50405414专 业计算机通信班 级04五年制计通4毕业

4、设计题目企业产品销售网站制作-雅芳产品大全网指导教师评语：指导教师建议成绩（60）指导教师签字： 年 月 日答辩小组建议成绩（40）组长签字： 年 月 日答辩委员会最后审定成绩主任签字： 年 月 日备注摘 要自计算机应用于治理领域以来，信息系统的开发与应用获得惊人的进展，网上购物也应运而生，并得已迅速推广，它不但能够扩大商家的规模和市场阻碍力，而且能够减少企业的经营成本，提高工作效率。给当今的传统型企业或者是现代型企业都带来了巨大的冲击和无限的商机。本文首先介绍了网上购物系统的现状及开发背景，然后论述了系统的设计目标，系统需求和总体设计方案，较详细的论述了系统的详细设计和实现。最后，本文对网上

5、购物系统进行了系统检测并提出了还需要改进的问题。本系统要紧为用户提供了会员注册，购物车治理，商品收藏，在线留言，为治理员提供了商品治理，用户信息治理。在设计方面，本系统采纳Deamveaer8.0， Photoshop css8.0， Photoshop css10.0， flash关键词：网上购物系统 开发背景AbstractSince the application of computer management, information systems development and application of access to the amazing development of o

6、nline shopping has come into being and has been a rapid promotion, it will not only expand the business scale and market influence, but also reduce business Costs and improve efficiency. To todays traditional or modern business enterprises have an enormous impact and unlimited business opportunities

7、. This article first introduced the on-line shopping system, the status quo and development background, and then discusses the design goals, system requirements and design programs, a more detailed discussion of the detailed design and realization. Finally, on-line shopping system for the detection

8、system and the need to improve. The present system is mainly to provide users with a membership registration, shopping cart management, collection of goods, online messages, merchandise manager provided management, information management users. In terms of design, this system uses dreamveaer8.0,. Ph

9、otoshop css8.0,. Photoshop css10.0, flashKey words: on-line shopping system development background目 录 TOC o 1-3 h z u HYPERLINK l _Toc218051866 绪论 PAGEREF _Toc218051866 h 1 HYPERLINK l _Toc218051867 1 网上购物系统概述 PAGEREF _Toc218051867 h 1 HYPERLINK l _Toc218051868 1.1 网上购物的进展 PAGEREF _Toc218051868 h 1

10、HYPERLINK l _Toc218051869 1.2 系统实现的目标 PAGEREF _Toc218051869 h 1 HYPERLINK l _Toc218051870 1.3 系统的开发意义 PAGEREF _Toc218051870 h 2 HYPERLINK l _Toc218051871 2 网上购物系统分析 PAGEREF _Toc218051871 h 2 HYPERLINK l _Toc218051872 2.1 网站的设计目标 PAGEREF _Toc218051872 h 3 HYPERLINK l _Toc218051873 2.2 网站的可行性分析 PAGERE

11、F _Toc218051873 h 3 HYPERLINK l _Toc218051874 2.3 本网站的功能 PAGEREF _Toc218051874 h 3 HYPERLINK l _Toc218051875 2.4 网站设计的特点 PAGEREF _Toc218051875 h 4 HYPERLINK l _Toc218051876 2.5 网站开发的设计思想 PAGEREF _Toc218051876 h 4 HYPERLINK l _Toc218051877 2.6 系统设计的总体规则 PAGEREF _Toc218051877 h 4 HYPERLINK l _Toc21805

12、1878 3 系统的开发技术及要紧构架 PAGEREF _Toc218051878 h 5 HYPERLINK l _Toc218051879 3.1 开发技术的选择 PAGEREF _Toc218051879 h 5 HYPERLINK l _Toc218051880 3.2 系统的要紧构架及开发模式 PAGEREF _Toc218051880 h 5 HYPERLINK l _Toc218051881 4 详细设计与制作 PAGEREF _Toc218051881 h 5 HYPERLINK l _Toc218051882 4.1 网站包含的要紧功能 PAGEREF _Toc2180518

13、82 h 5 HYPERLINK l _Toc218051883 4.2 网站总结构的设计 PAGEREF _Toc218051883 h 6 HYPERLINK l _Toc218051884 4.3 网站各页面设计 PAGEREF _Toc218051884 h 6 HYPERLINK l _Toc218051885 4.4 在线留言系统 PAGEREF _Toc218051885 h 11 HYPERLINK l _Toc218051886 5. 系统使用讲明 PAGEREF _Toc218051886 h 11 HYPERLINK l _Toc218051887 6. 总结 PAGER

14、EF _Toc218051887 h 12 HYPERLINK l _Toc218051888 致 谢 PAGEREF _Toc218051888 h 13 HYPERLINK l _Toc218051889 参考文献 PAGEREF _Toc218051889 h 14 HYPERLINK l _Toc218051890 附录 PAGEREF _Toc218051890 h 15 HYPERLINK l _Toc218051891 /用户注册界面的代码实现/ PAGEREF _Toc218051891 h 15绪论目前，网上购物正以一种前所未有的冲击力在阻碍着人类的活动，包括人类的生产和日常

15、生活。网络的诞生和进展，颠覆了传统的信息传播方式，冲破了存在于传统交流方式中时刻和空间的种种壁垒，极大地改变了人类从物质到精神、从形式到内容、从生产到生活的各种活动，同时给人类带来了新的机遇和挑战。中国互联网络信息中心(CNNIC)公布第22次中国互联网络进展状况统计报告中显示，截至2008年6月底，我国网民数量达2.53亿，首次大幅超过美国跃居世界第一位，此外，依照CNNIC统计显示，我国网民中接入宽带比例为84.7%，宽带网民数已达到2.14亿人，宽带网民规模为世界第一。网络购物是互联网作为网民有用性工具的重要体现，随着中国整体网络购物环境的改善，网络购物市场的增长趋势明显。目前的网络购物

16、用户人数差不多达到6329万人，有25.0%的网民青睐网上购物，跻身十大网络应用之列。 1 网上购物系统概述1.1 网上购物的进展 近年来，随着Internet的迅速崛起，互联网已日益成为收集提供信息的最佳渠道并逐步进入传统的流通领域。因此电子商务开始流行起来，越来越多的商家在网上建起在线商店，向消费者展示出一种新颖的购物理念。网上购物系统作为B2B,B2C（Business to Customer,即企业对消费者），C2C（Customer to Customer,即消费者对消费者)电子商务的前端商务平台,在其商务活动全过程中起着举足轻重的作用。本文要紧考虑的是如何建设B2C的网上购物系统。

17、网上购物是一种具有交互功能的商业信息系统。它向用户提供静态和动态两类信息资源。所谓静态信息是指那些比经常变动或更新的资源，如公司简介、治理规范和公司制度等等；动态信息是指随时变化的信息，如商品报价，会议安排和培训信息等。网上购物系统具有强大的交互功能，可使商家和用户方便的传递信息，完成电子贸易或EDI交易。这种全新的交易方式实现了公司间文档与资金的无纸化交换。1.2 系统实现的目标现在流行的网上购物系统不仅要有漂亮的网页，更要有严谨的规划，注重每一个细小的环节。如此才能使得在电子交易时幸免不必要错误发生。我们将使用Dreamweaver等技术辑网页，Dreamweaver能够用最快速的方式将F

18、ireworks，FreeHand，或Photoshop等档案移至网页上。使用检色吸管工具选择荧幕上的颜色可设定最接近的网页安全色。关于选单，快捷键与格式操纵，都只要一个简单步骤便可完成。Dremweaver能依照自己喜爱的设计工具，如 Playback Flash，Shockwave和外挂模组等搭配，不需离开Dremweaver便可完成，整体运用流程自然顺畅。除此之外，只要单击便可使 Dreamweaver自动开启Firework或Photoshop来进行编辑与设定图档的最佳化。本设计在实际应用中的解决方案是建立网站, 以及自己的即时通信工具，使得所需商品信息能够及时的保存、更新，能够更好的

19、及时了解商品买卖的情况。1.3 系统的开发意义Internet的进展，为改变传统的商业运作模式提供了一种技术上的可行性的方案：利用Internet的技术和协议，建立各种企业内部网Intranet，企业外部网Extranet，通过廉价的通讯手段，将买家与卖家、厂商和合作伙伴紧密结合在了一起，消除时刻与空间带来的障碍，从而大大的节约了交易成本，扩大了交易范围。而在实际的生活中，这种方案差不多被广泛的运用到了实际的商业活动中了，人们将这种交易模式称为：电子商务。当今比较流行的网上购物系统国外有“淘宝(HYPERLINK /)”，国内有“当当(HYPERLINK /)”。它们差不多上相当优秀的电子商务

20、网站，对其他的网站提供了良好的典范。设计中能够学习参考他们的思想，了解和熟悉整个网站的开发流程及完整的电子商务网站应有的功能和注意事项。设计和完成一个电子商务网站的，将会牵涉到许多技术上的问题，如：动态网页制作技术的，后台数据库的设计和治理，通过实际的制作个网站，能够幸免纸上谈兵，在实践中掌握上述技术的使用。2 网上购物系统分析系统分析是平台开发的一个不可缺少的环节，为了能够使本系统更好、更完善地被设计出来，就必须先进行调查研究。在系统调查的基础上，对新系统的功能进行细致的分析，从而才能够开发出完整的系统设计。2.1 网站的设计目标本平台利用现在比较广泛的Dreamweaver软件制作网站来实

21、现的系统前台部分，前台治理是友好的操作界面，供用户扫瞄、查询使用。包括：用户登陆、用户注册、扫瞄商品、查询商品、购物车、商品收藏等功能。并附带在线语聊和留言软件。2.2 网站的可行性分析 随着计算机技术的进展和网络人口的增加，网络世界也越来越广博，越来越丰富，电子商务差不多成为网上的一股潮流。我们相信要不了太长有时刻，顾客就能够在网络世界上获得他们在现实世界上能够获得的所有商品和服务。通过设计目标和进行的市场调查得出以下四点的可行性分析：（1）经济可行性：该平台设计只是作为本人的毕业设计，又因为本人的设计能力有限，其功能还不能完善，因此没有什么经济效益可谈。（2）技术可行性：Dreamweav

22、er的技术差不多较为成熟。（3）法律可行性：该平台是作为毕业设计与商业无关，又因为是自主开发设计，因此可不能构成侵权，在法律上是可行的。通过以上的可行性分析，我将采纳Dreamweaver，Photoshop、flash库对网站进行建设。2.3 本网站的功能通过以上的初步调查和研究，同时确定了该平台的可行性，并决定开发本平台，为了能够对现行的平台内容进行充分了解，使所要开发的平台更具有有用性和适应性，通过两个月的实习调查和指导老师的耐心介绍，设计出该平台功能如下：（1）能够完成用户差不多信息录入的注册。（2）能够完成对网站的商品资料（商品添加、商品审查）、网站信息治理（修改删除、公告设置），以

23、及常规设置（广告添加）的功能。（3）能够通过查看购物车对所选商品进行确定、选择，通过在线联系确定商品的支付。通过前一时期的调查与研究分析，我已确定了该平台设计的要紧功能，对每个功能模块也作了具体描述，下面就来具体分析该平台的设计特点与具体思想。2.4 网站设计的特点我所设计和开发的网上购物平台是通过专门长时刻的调查和分析才开始具体实施的，它的要紧特点是改变了以往的购物只能过现实的商场才能达到的结果，采纳Web技术，借助于Internet互联网广泛应用技术，达到资源共享，提高以往购物的局限性，缩短人们的时刻和提高工作效率，具有较好的交互性，从而实现信息化，规范化，系统化，网络化的平台，使整个购物

24、活动过程简单、方便、易行。本网站运行在Windows环境运行中，操作方便，便于修改。最常用的调试是IE扫瞄器。2.5 网站开发的设计思想网上购物平台要紧是对后台治理和前台操作。后台治理是治理员对本网站的维护，通过即时软件在线联系能及时的了解用户的需求，产品的更改，用户的建议，完成再线付款等后台治理操作。前台操作是用户登录到本网站，能够进行用户注册，通过网站的精品推举，找到自己想要买的商品，装入购物车，提交定单时在线联系进行购买。网上购物平台的特点是客户和电子商品信息量专门大，治理员需要整理的信息专门多，为让治理员轻松、方便、快捷的治理，该平台采纳符合购买电子商品差不多的原则，满足宽敞客户的日益

25、增长的数量，并达到操作过程中的直观、方便、有用、安全等要求。2.6 系统设计的总体规则不管哪个网站都要有它自己的设计规则。该平台也一样，它的要紧设计规则有：简单性：在实现平台的功能的同时，尽量让平台操作简单易明白，这关于一个网站来讲是特不重要的。针对性：该平台设计是网上购物系统及后台治理的定向开发设计，因此具有专业突出和专门强的针对性。有用性：该平台能完成电子商品展示和治理员治理的差不多信息，具有良好的有用性。3 系统的开发技术及要紧构架3.1 开发技术的选择本系统要紧是Dreamweaver来编辑网站，Flash、Photoshop来辅助美化网站。Dreamweaver是一款专业的网站制作软

26、件、它与Flash、Photoshop合在一起称为“网页三剑客”，这三个软件配合使用，制作出来的网页兼容性比较好是一款：所见即所得“的网页编辑工具，它关于web站点、web页和web应用程序进行设计、编码和开发。不管是用户是情愿手工编写HTML代码时的驾驶感，依旧偏爱在可视化编辑环境中工作，Dreamweaver都会为用户提供有用的工具，拥有更加完美的Web创作体验。Flash用于制作精美的页面动画；而Photoshop用于处理页面中的图形。3.2 系统的要紧构架及开发模式系统的建设关键在于其所使用的构架，而网上购物这种基于web的系统，传统的c/s架构差不多不能满足大量用户的访问和操作，b/

27、s基于扫瞄器的架构则是目前网络系统应用的主流，它将大量的数据处理工作交给服务器端来处理，客户端只用通过一般的IE扫瞄器即可访问系统，方便快捷而且利于系统的更新和维护。4 详细设计与制作4.1 网站包含的要紧功能首先进入主页面，会员可直接登陆，否则需注册用户后登陆，登陆成功后可进行产品搜索，产品导航分为产品介绍、护肤产品、彩妆产品、护发产品、保健产品五类，选择合适的产品放入购物车内，通过在线语聊或留言进行产品的购买，付款成功以后退出雅芳大全网，具体流程如图4-1所示：图4-1 产品购买流程图4.2 网站总结构的设计本网站要紧采纳的是表格布局，使用表格布局不仅易于修改，而且能够依照自己网站的特点进

28、行个性化布局。本网站采纳上下的结构，网站上方要紧是横幅（俗称Banner）和导航，导航有五部分：产品介绍、护肤产品、彩妆产品、护发产品、保健产品，网站的下半部分要紧是产品的扫瞄。本站分类专门详细，方便用户更快捷的找到所需要的商品。在产品介绍里，本网站把各类产品进行汇总，综合介绍站内产品。比如分页的彩妆产品又专门详细的分出香水系列、唇彩系列、眼影系列、粉底系列，更能方便用户查找。4.3 网站各页面设计主页的设计是以文字叙述为主，把产品进行综合总结。因为技术有限因此本站实现的是假登陆和假注册。产品导航链接有:产品介绍、护肤产品、彩妆产品、护发产品、保健产品。页面的颜色要紧是以粉色为主，给人亲切、温

29、馨的感受，用了flash特效作为装饰，使我的网页有了动态之美。如图4-2所示：图4-2 雅芳产品大全网首页效果图 护肤产品页面的设计，每页有12个产品，分了四页介绍，详细介绍了产品的成分以及价格。本页面添加了购物车功能，但购物车实现的是假功能，在购物车的图片上添加了onclick行为，是在点击购物车时会弹出一个消息对话框，提示用户选择的产品差不多放入到购物车内，本网站真正购买是通过即时通信的方式进行购买。如图4-3所示:图4-3 护肤产品页面效果图彩妆产品页面的设计首先从视觉上给人带来冲击，采纳黑色做为背景色，给人一种奇妙的感受。如图4-4所示:图4-4 彩妆产品页面效果图点击推举产品就会链接

30、到相应系列产品的页面。在彩妆系列里增加了产品收藏功能，在“产品收藏”链接上同样添加了“onclick”行为，点击”产品收藏”会弹出“物品已加入收藏，假如想购买请与我们在线联系，感谢”的字样。实现购买的目的。护发、保健产品页面也是以暖色调为主，在保健产品页面中有温馨提示，介绍产品适宜人群和成分含量。如图4-5所示:图 4-5 护发产品和保健产品效果图4.4 在线留言系统留言系统采纳的是TQ即时通信系统，TQ是一款易于使用的网站即时通讯软件，具备了独创的网页会话功能，超强的群组沟通功能，同时能够和各类网站紧密结合，开创了即时通讯的全新领域。本网站能够依照TQ即时通信能及时了解用户所需要的产品，在线

31、购买，或留言购买。TQ有两种状态，一种是在线状态，能够直接的咨询，使用起来就像是QQ谈天，离线状态是拨打免费电话或着留言，使用起来方便快捷。如图4-6所示：图4-6 在线留言系统在线留言系统的关键代码：10src=/js/tqGetOnlineFlag.js5. 系统使用讲明本站是在Windows XP系统中进行运行与调试的，操作起来特不简单方便Windows XP系统安装程序如下：（1）区域和语言选项（2）输入个人信息（3）输入序列号（4）设置系统治理员密码（5）设置日期和时刻（6）设置网络连接 总结本网站要紧采纳的是表格布局，使用表格布局易于修改，而且依照自己网站的特点进行个性化布局。本网

32、站采纳上下的结构，网站上方要紧是横幅（俗称Banner）和导航，本站分类详细，方便用户能够更快捷的找到所需要的商品。我所设计和开发的网上购物平台是通过长时刻的调查和分析后开始具体实施的，它改变了通俗的购物方式，采纳Web技术，借助于Internet互联网达到资源共享，提高工作效率，具有较好的交互性，从而实现信息化，规范化，系统化，网络化的平台，使整个购物活动过程简单、方便、易行。 致 谢在设计和论文完成后的今天，我要特不感谢我的指导教师杨严广老师，在我整个毕业设计的过程中给予我的指导和关心，并时刻向我提出最宝贵的意见，让我能够顺利完成这次的设计和论文撰写。是他以渊博的知识和丰富的实践经验深深地

33、感染了我，给我以毫无保留的指导，促进了我对专业知识的学习掌握，使我受益匪浅。正是在他的悉心指导下，我的论文得以顺利进行。再次,我要感谢我的一些同学，感谢他们对我的关心，是他们给了我灵感和信心。我从他们那儿学到的不仅仅是专业知识，更重要的是严谨求实的治学态度和忘我的事业追求。大学就要毕业了，在那个地点我还要特不感谢教过我的所有老师。在这三年的大学生活里，他们给了我专门多关心与关怀。他们不仅教授我知识而且使我学到了专门多做人的道理。在平常的生活中，她们关怀的眼神、亲切的笑脸、真挚的言词，将永久深深的印在我的脑海里。这所有一切的一切都将是我以后生活中最宝贵的财宝。他们和我共同生活了三年，在生活和学习

34、上给了我专门大的关心。在我生病时有她们无微不至的照顾，在我孤独时有她们的相依相伴，让我时时刻刻都在享受着家的温暖。在那个地点我真诚的感谢我的这些可爱的兄弟姐妹。总之，我相信在不久的今后，我将会更加感激大学时代曾经关心我的所有老师、同学、朋友。因为是他们给予我鼓舞，给予我力量，给予我知识。因此，我以后会更加努力，更加刻苦，为我们国家，为我们社会贡献自己的一份力量参考文献1 杨选辉，网页设计基础与实例教程，北京电子工业出版社，2006年2 庄王健，网页设计三剑客白金教程，北京电子出版社。2006年3 张祖鹰，网页制作有用技术Dreamweaver，大连理工大学出版社，2007年4 丁群，网页设计与

35、制作，中国打算出版社，2008年5 胡崧，Flash8标准教程。北京青年出版社，2006年6 宋一兵，李仲。从零开始Flash基础培训教程。人民邮电出版社，2006附录/用户注册界面的代码实现/新用户注册界面 function check() var i; var sz_question,sz_answer; var sz_gateway_id; number = build_form.ACCT_NBR.value; sz_question = build_form.QUESTION.value; sz_answer = build_form.ANSWER.value; sz_gateway_

36、id = build_form.GATEWAY.value; sz_nickname = build_form.NICKNAME.value; if ( sz_gateway_id = ) alert(请选择用户类不！); return false; if ( sz_nickname = ) alert(请输入用户昵称！); return false; if (number = | number.length = 0) alert(电话号码必须输入！请输入电话号码！); return false; for(i=0;i number.length;i+) if (number.charAt(i)

37、9) alert(电话号码必须输入整数！请重新输入电话号码！); return false; if ( sz_question.length = 0 ) alert(请输入密码查询问题！); return false; if ( sz_answer.length = 0 ) alert(请输入密码查询答案！); return false; if (!check_ad_pass()return false; return true; !-todayDate = new Date();date = todayDate.getDate();month= todayDate.getMonth() +1

38、;year= todayDate.getYear();if(navigator.appName = Netscape) document.write(1900+year); document.write(年); document.write(month); document.write(月); document.write(date); document.write(日);if(navigator.appVersion.indexOf(MSIE) != -1)document.write(year);document.write(年);document.write(month);document.write(月);document.write(date);document.write(日);if (todayDate.getDay() = 5) document.write(星 期 五)if (todayDate.getDay() = 6) do