收藏 分销(赏)

电商系统设计报告.doc

上传人:天**** 文档编号:3545784 上传时间:2024-07-09 格式:DOC 页数:40 大小:2.26MB
下载 相关 举报
电商系统设计报告.doc_第1页
第1页 / 共40页
电商系统设计报告.doc_第2页
第2页 / 共40页
电商系统设计报告.doc_第3页
第3页 / 共40页
电商系统设计报告.doc_第4页
第4页 / 共40页
电商系统设计报告.doc_第5页
第5页 / 共40页
点击查看更多>>
资源描述

1、电子商务系统报告目录一、系统总体结构设计1.1系统外部接口1.2系统组成结构1.3系统设计原则二、系统信息基础设施设计2.1IT基础设施规划定义2.2IT基础设施规划内容 三、支持平台设计3.1网站建设目的3.2项目基础分析3.3网站功能栏目3.4网站框架图3.5网站开发预算四、应用系统设计4.1应用软件系统与子系统的划分4.2数据库与数据结构设计4.3输入输出设计五、网页设计5.1首页制作5.2商品展示页面制作5.3登陆界面的制作5.4注册页面的制作5.5结账页面的制作一、 系统总体结构设计1.1系统外部接口从上图中可以看到,系统有4个接口,分别是通过浏览器和用户的接口、通过浏览器与图书供应

2、商的接口、公司内部的接口、通过专门的软件和银行及其他支付平台的接口。1.2系统组成结构 零食销售的系统由商业逻辑和应用服务器组成,其中,应用服务器又由Web表达层应用、支持平台、互联集成工具等几个部分组成。1.3系统设计原则由于本网站是基于C2C模式的零食销售,因此,本系统设计的原则有:(1)系统的可扩展性 系统设计除了可以适应目前的网站的需要以外,应充足考虑用户日后的业务发展需要,为业务发展提供接口。例如,假如网站还要扩充一些娱乐功能,系统可以轻松的进行扩充,从而减少未来的管理成本。(2)技术即时性 兼顾系统成熟性和先进性的技术,才干保证现有系统的先进性,使计算机系统发挥最大的效率,并使之随

3、着技术的发展不断升级。(3)系统的稳定性 采用计算机系统管理的目的就是为了提高公司运作效率,网站必须保持24*7的工作方式(天天24小时、每周7天),从而保证交易的即时性。 (4)电子交易的安全性 安全性是整个电子商务解决方案中最重要的方面,因此,在系统设计时,需要充足保证对系统安全性的规定,通过支付密码技术、安全用户授权体系等技术来实现系统安全性。(5)用户界面的和谐由于本网站重要侧重于网上交易,因此系统建设应当注重用户的感受,将用户的个人空间和交易界面设计的更加和谐和个性化。二、 系统信息基础设施设计 信息化基础设施(IT基础设施)建设也需要进行规划。假如只是盲目地花钱,增长硬件、软件投资

4、,表面上看起来好看,但是会存在很多问题。再者,当今技术的发展也远超过了人们的预期,即使刚建设两三年的基础设施也不可避免地面临一些新的挑战,如新出现的分布式业务系统非常复杂,它就会对基础设施提出新的规定,尚有大量结构化数据的出现使得存储介质、存储结构都会发生很大的变化。因此,公司的这些基础设施期待重新进行规划,以适应新的发展2.1、IT基础设施规划定义 所谓IT基础设施规划,就是合理规划和安排各项信息化基础设施,使之形成良好的IT环境,让各种业务解决方案、应用系统和数据都能不受约束地在其上实现有效配合。这些基础设施涉及网络、硬件设备和基础软件。网络规划涉及数据流量及约束条件分析、网络选型、拓扑结

5、构设计、网络安全方案、网络建设方案等;硬件设备规划涉及服务器、路由器、互换机、集线器、台式机、笔记本、打印机、手持设备等的规划和配置等;基础软件规划涉及操作系统软件、数据库软件等软件的规划等等2.2、IT基础设施规划内容网络规划 现在,公司和事业单位基本上建设有自己的网络系统,但是随着业务需求的增长和技术的发展,都不得不面临优化、扩容和升级的问题。 在进行网络的相关规划 时,重要侧重几个方面,一是提出公司和事业单位的LAN/WAN(局域网/广域网)的网络拓扑结构的建设/改良方案;二是拟定合理的网络协议;三是评估现有的结构化布线系统的容量、网络设备、广域网数据链路带宽是否满足未来新业务的需求,否

6、则就要进行相应的扩充和升级等。 储系统规存划 存储系统的规划遵循以下原则:(1)存储架构必须满足数据集中的规定 存储架构可以适应大存储容量的需求,又可以对存储资源进行集中运用(2)存储架构可以对原有的投资进行保护 存储架构是一个长期的架构,而如今存储设备的升级速度也非常迅速,进行存储架构规划时要考虑到对客户现有设备的投资保护,在保证不断提供功能和性能提高的同时,存储架构在较长的时间内可以保持相对稳定。(3)存储设备必须具有瞬间数据复制功能 运用完全基于存储设备的数据复制功能,可以在不影响主机工作的情况下在最短的时间对数据进行快照式复制。(4)存储设备必须具有远程数据复制功能运用该功能 存储设备

7、可以提供与主机无关的数据级远程劫难备份,对于一些不支持远程劫难备份的主机系统,可以运用存储进行远程灾备。(5)高性能 集中的存储系统将支持多种核心应用,连接几台甚至十几台同时工作的服务器,存储系统必须有高的性能才干胜任。(6)高可用性与高数据安全性 数据中心是核心应用的最终保障,必须可以保证7X24全天候运营,存储系统必须有高可用性,以保证应用系统对数据的随时存取。 (7)灵活的扩展性 存储系统必须有强大的扩展性来满足这种高速发展的规定。 备份系统规划 备份系统应以不影响业务系统正常运作为前提。在业务系统遭受非法入侵、介质损坏、人为误操作等因素引起的数据丢失后,备份系统应能提供快速的数据恢复手

8、段。 要真正保证系统高效的运营以及提高当劫难出现时的抵御与恢复能力,就必须做好数据的备份。一般来说,各种操作系统所附带的备份程序都有着这样或那样的缺陷,所以若想对数据进行可靠的存储备份,必须选择专门的存储备份软、硬件,并制定相应的存储备份及恢复方案。 系统管理规划 互联网、操作系统、数据库等新技术的应用,组成了复杂而互相依存的IT系统。机构与公司在享受新技术带来的便捷的同时,也面临着复杂的系统和应用管理问题。 系统管理是以服务质量战略为核心,运用针对业务应用管理的新技术,对整个分布式网络环境进行统一监控和管理,使之逐步整合成为一个安全、可靠的网络体系,实现集中管理、全面防护的目的。 一般来说,

9、系统管理规划设计如下内容:(1)一体化网络和系统管理平台,改善了网络和系统管理;(2)功能强大的管理报告解决方案,随时了解网络和系统的运营情况;(3)端到端资源和性能管理解决方案,做到IT资源的远程监控、分发和变更管理;(4)具有实时诊断和监控功能的工具;(5)提供可全面管理系统可用性与性能的综合性产品; (6)对服务器与数据库的性能和可用性进行管理的产品,保证数据库的稳定性和可用性等。 安全规划 安全问题已经变得比以往任何时候都重要。为了保障数据、网络等的安全,人们纷纷进行相关安全技术的研究,由此,目录产品、加密技术、认证技术、病毒防护技术、入侵检测技术、防火墙技术等营运而生。而在信息化基础

10、设施规划中,有关安全产品与技术的规划也越来越占据重要地位。 操作系统规划 操作系统通过很长时间的发展,从单用户、单任务的操作系统,如CP/M、C-DOS、M-DOS、TRS-DOS、S-DOS和MS-DOS等,发展到多用户多道作业和分时系统,其典型代表有UNIX、XENIX、OS/2和Windows操作系统等,以及自由软件Linux操作系统。每次操作系统的更新都经历了多个版本的升级,如DOS经历的7次大的版本升级,Windows的几次大升级等。 在进行操作系统规划时,既不能因循守旧,也不能一味从新。最佳策略是:结合机构或者公司的实际情况,在对各种操作系统进行综合评估比较的基础上,谨慎选择是否升

11、级版本或更新操作系统.数据库系统规划 数据库技术和产品在不断地的发展,重要体现在以下几个方面: (1)数据模型是数据库发展的主线。由于硬件技术飞速发展,支持64个CPU和64GB RAM的并行计算机使数据库系统扩展性大大提高,也使查询优化的参数空间发生改变;(2)数据库技术与其他计算机技术的结合及互相渗透是数据库发展的重要特性;(3)应用需求是推动数据库技术不断发展的动力。数据库被广泛地应用到ERP、CRM、CIM、OA、GIS等系统中。当前,数据库应用已经从OLTP向OLAP,从数据管理向内容管理的广度扩展。至于数据库产品与技术方面的竞争,重要在Oracle、IBM DB2和Microsof

12、t SQL Server之间展开。从目前的情况看,Oracle占据了第一的位置,其后是IBM DB2,Microsoft SQL Server尽管仍位居两者之后,但是发展势头迅猛。在进行数据库方面的规划时,一方面要确认机构或公司内外的数据类型、数据内容、数据量。假如已有数据库,也要对原有数据库的软件结构、系统结构、数据流程、业务情况、使用情况、系统性能进行一系列的综合分析和测试。在此基础上,就可以根据用户的实际情况,综合考虑系统提供服务的用户数、信息量、业务需求和服务级别,提供系统的、合理的、综合的硬件,系统和数据库规划建议。 备份系统规划 备份系统应以不影响业务系统正常运作为前提。在业务系统

13、遭受非法入侵、介质损坏、人为误操作等因素引起的数据丢失后,备份系统应能提供快速的数据恢复手段。 要真正保证系统高效的运营以及提高当劫难出现时的抵御与恢复能力,就必须做好数据的备份。一般来说,各种操作系统所附带的备份程序都有着这样或那样的缺陷,所以若想对数据进行可靠的存储备份,必须选择专门的存储备份软、硬件,并制定相应的存储备份及恢复方案。 系统管理规划 互联网、操作系统、数据库等新技术的应用,组成了复杂而互相依存的IT系统。机构与公司在享受新技术带来的便捷的同时,也面临着复杂的系统和应用管理问题。系统管理是以服务质量战略为核心,运用针对业务应用管理的新技术,对整个分布式网络环境进行统一监控和管

14、理,使之逐步整合成为一个安全、可靠的网络体系,实现集中管理、全面防护的目的。 一般来说,系统管理规划设计如下内容: (1)一体化网络和系统管理平台,改善了网络和系统管理; (2)功能强大的管理报告解决方案,随时了解网络和系统的运营情况; (3)端到端资源和性能管理解决方案,做到IT资源的远程监控、分发和变更管理; (4)具有实时诊断和监控功能的工具; (5)提供可全面管理系统可用性与性能的综合性产品; (6)对服务器与数据库的性能和可用性进行管理的产品,保证数据库的稳定性和可用性等三、支持平台设计 食品行业在我国国民经济中占有举足轻重的地位,2023年1至五月份中国食品工业产值实现1082万亿

15、元产值,14.6%的增速,高出全国工业增长值速6.57个百分点,尽管在金融风暴的冲击下,我国经济增速放缓,但食品产业荏苒保持强大定力,逆势上升。由此可见食品产业所面对的巨大市场。从2023年开始,以信息化和网络经济为代表的全球新经济飞速发展,吸引了各个行业商家的眼球,引领着各个行业的经营理念。食品产业同样在这场变革中引入了电子商务经营模式。 网络作为第四媒体,具有一定的特殊性。网络不仅具有广泛地宣传范围,并且还具有操作上的互动性以及数据传输的及时性。网络在最大限度上缩减了交易的成本,缩短了交易的时间,扩大了客户群,加快了信息流通速度俨然已经成为了联系生产者及消费者的最方便的桥梁。公司和用户实现

16、了直接接轨,屏蔽了多级中间商。 对于食品行业从事电子商务公司的运营模式,目前有B To B,B To C,C To C三种模式,目前网络市场的重要形式则是B To B。尽管互联网时代的到来为大型食品公司和中小型食品公司在不同的方面都带来了新的商机,但是食品行业的特殊性值得公司家们的特别关注。食品行业是与老百姓平常生活关系最密切的、相关公司最多的、投入最大的行业之一。并且就目前中国食品行业的现状而言,在规模及管理上都存在着巨大差异。因此,选择恰当的经营模式是各公司成功发展的重要环节。电子商务也许为一个公司发明巨大商机和财富。也也许成为一个公司增长开销,导致资源浪费的源头。3.1网站建设目的 通过

17、互联网这个平台销售有机绿色食品,推广公司的品牌,采用网上商城系统、新闻发布系统、会员管理系统、电子支付系统相结合的运营平台,才是长期的、可行的、省钱的方案。建立一个完整的食品网站,突出食品特点,有美观的界面设计。重要功能:1.用户可以浏览各种食品的信息,同时可以查询食品的信息,在线留言。注册等功能。2.网站有一定数量食品相关信息可供解决,方便顾客了解食品各种相关信息,同时有助于食品管理部门的管理,加强双边的沟通与协作,以提高和改善管理水平,使顾客通过网站的浏览可以对食品有比较真实和丰富的了解,对食品自身做一个比较好的宣传和推广。3.管理人员登陆系统后,将各种烦琐的管理工作通过网站来管理,用最少

18、的人力和物力提高管理水平,方便发布各种旅游信息,解决游客所碰到的各种问题,及时了解对食品管理部门的意见,通过数据分析可以了解顾客的基本情况,突出食品特点,具有美观的界面设计,保证网站安全稳定的运营。3.2项目基础分析 我们根据对网络营销项目的初步了解,对网络营销项目进行了系列基础分析:1 业务定位 网络营销项目的重要业务定位是: 网上零售 品牌形象推广2 网站定位 网站为公司实现网上营销,完毕如下职能: 1网上销售产品 2推广自己品牌(通过活动和推广提高品牌知名度) 3 客户定位 网站的目的客户群体定位是:1重要目的客户群:终端买家2次要客户群:代理商,批发商 4赢利模式定位 1网上直销收入:

19、网站的重要赢利来源,重要为产品个人零售收入 2网上招商收入:代理商分站 为网站辅助赢利来源,包含收取产品加盟商的加盟费、产品代理分销收入3.3网站功能栏目A.产品展示 客户可以以多种分类方式浏览产品,并拥有强大的产品搜索功能可以最快速地帮助客户锁定感爱好的产品;管理员在后台可轻松完毕对商品信息的添加、记录、查询等管理和维护过程A.1产品发布(后台)管理员可在线发布各种产品资料,含产品图片(支持大图、小图)、价格(支持多级价格)、简介等A.2产品查询客户可按产品关键字、产品分类、用途等多种查询条件,快速锁定感爱好的产品A.3产品推荐可按精品推荐、新品推荐、人气产品、畅销产品四种方式进行产品推荐排

20、行A.4产品评论产品评论可为客户采购提供客观的参考意见。客户(或管理员)可对产品发表评分,或评论意见、用户见证A.5产品关联产品介绍页面中,可以看到与当前产品有关的其他产品列表A.6产品管理(后台)管理员可在线轻松进行各类产品资料的修改、删除、排序、查询记录等编辑操作。特色功能:客户可对产品图片进行放大或缩小查看B.产品订购 配备简朴快捷的全套订购系统,能有效地保障客户快速完毕订购过程,提高网站成交率B.1在线订购(购物车)客户一方面必须进行会员注册,才可进行在线订购系统。客户可选择配送方式和支付方式B.2直接订购客户也可选择直接订购的便捷方式:无需会员注册,直接打免费电话或在线填写订单订购B

21、.3订单查询客户可在线查看和修改自己的网上订单和交易记录B.4订购指南涉及订购方式、配送方式、售后服务、常见问题、付款方式等说明B.5在线支付支持网上银行、支付宝等多种在线支付方式B.6订单管理(后台)管理员在后台可轻松实现客户在线订单的查询、记录、跟踪、编辑等功能C.公司介绍客户更也许的从多方面了解本公司,将有力提高本公司的品牌形象和网上销售的可信度C.1公司概况公司概述、发展历程等,常规采用文字+公司形象照片形式(可选购“公司视频介绍”功能)C.2主营业务公司重要经营的产品与服务项目简介C.3使命愿景 公司的经营宗旨、价值观、使命宣言、发展愿景C.4公司风采生产基地可重点展示绿色有机食品的

22、生产环境和过程,让消费者放心;公司可展示办公室景象照片等D.会员管理客户可通过“会员注册”来提交自己的简介资料,管理员也可以此收集网站访问者的联系资料。管理员可对注册会员资料进行记录、查询、编辑等操作D.1会员注册客户通过“会员注册”,输入公司名称、姓名、联系方式、省份城市等资料,注册成为本站会员D.2会员登录会员注册后,可使用会员登录功能登陆公司网站,才可使用本站的多项会员服务功能D.3会员资料管理(会员中心)会员登录后即进入会员中心,可查看和修改自己的会员注册资料(简介、密码、联系方式等)、会员状态(会员积分、会员级别等)D.4会员信息管理会员在“会员中心”中,可发布和管理自己的简介信息、

23、订单信息、资讯信息等类别信息D.5会员权限管理(后台)管理员可设立多种会员类型,对不同类型的会员可设立不同的服务权限。(例如可设立普通会员、高级会员,享有不同的产品定价折扣和不同的产品信息或资讯文章的浏览权限)E.联系我们 网站必须提供尽量多元化的联系方式,尽量方便客户以最便捷的方式,和我们产生交流,有力的提高网上招商成功率和服务品质F.管理员权限管理(后台) 网站系统提供多种管理员权限设立功能,不同级别的管理员具有不同的后台功能管理权限,不能越权操作其他功能模块,保证网站后台系统的管理安全3.4网站框架图产品管理行业新闻促销新闻新闻中心选送货方式在线支付生成订单选支付方式放入购物车会员登录在

24、线订购会员服务参数管理产品图片价格管理添加产品类别管理账单查询会员登录会员注册首页公司介绍公司目前状态公司未来发展详见下文产品知识意见回馈送货地址我的礼品我的资料投诉建议我的收藏我的订单购物车账户查询会员登录会员注册会员服务购物指示支付配送联系我们常见问题解答关于我们新手指导帮助中心加盟与招聘3.5网站开发预算项目说明单价数量价格网站开发建设网页设计网站首页首页设计采用客户的既定标准色,注重协调各区域的主次关系,以营造高易用性与视觉舒适性的人机交互界面为终极目的;100011000网站栏目页(一级栏目页)根据网站结构及信息类别的分类,拟定需要独立设计的频道栏目。设计中兼顾并继承首页的设计风格,

25、保障版面在各具体页面中的合用性和灵活性。(活动&促销、产品、新闻、会员管理、购物车、购物帮助、积分、关于我们)40083200网站内容页(二级及以下栏目页)根据上级页面的设计风格与内容页元素组成进行设计,出具设计稿图形文献。150101500数据库系统开发产品展示多级分类功能;自行添加修改删除数据;产品关键词指定;图片关键词及标签(Tag)设定;优先显示排序功能,搜索分为模糊搜索和高级搜索2种形式,模糊搜索结合网站整体数据库,对网站所有信息进行关键字模糊搜索精确搜索应用于网站版块,可实现多层级精确搜索,针对模糊搜索可进行再次细化搜索202312023产品订购系统购物车记忆功能,防止顾客掉线丢失

26、购物车商品信息;购物车提醒功能:可让顾客随时查看购物车内商品和金额,客户可以在订单中添加备注内容9001900订单管理可以查看管理订单信息,可以按多种方式对订单信息进行列表管理员可以定义订单的解决状态,如正在解决、已确认、无效等,可以自由修改订单的状态可以按类别、关键字检索订单信息9001900积分管理会员可以查看自己的积分情况、消费额(经验值)情况;用户可以用积分兑换商品管理员可以修改积分,可以按类别管理积分兑换或者附赠礼品的管理6001600网上支付系统支付宝、易宝、财付通等6001600留言板留言表格设立合理,可多人管理;用户发送留言后,留言将自动发至指定邮箱;网站管理员可以删除留言内容

27、;5001500资讯发布系统管理和发布新闻类文章内容;每栏目信息可以按类别显示,方便浏览者浏览与查找;系统可以提取最新的信息在首页或栏目首页显示;管理员可以按类别、关键字查询信息,方便管理;140011400会员管理系统浏览者在线填写注册表,即时成为网站全员;会员可自行维护个人注册信息;后台设立会员管理界面,管理员可对会员信息进行分类查询、对无效会员进行删除;会员登录后可以查看、管理自己的信息;会员可以查看自己的订单、积分值;会员可以查看自己的历史交易记录;会员可以查看自己的收藏夹;150011500权限管理设立不同后台模块的管理权限,可实现多人共同管理的目的9001900网站开发费用总计:1

28、5000元,网站优惠价:12023元域名注册.com100元每年,三年共计300元,双线全能虚拟主机4GB,1900元每年,三年可享8折优惠,即三年只要4560元,可省1140元网站配套服务在线客服交流客户可直接在线与公司交流赠送1赠送在线流量记录可直接从网上看到网站的询问情况赠送1赠送网站维护服务终身免费技术维护赠送1赠送网站设计排版网站名称 输入内容搜索会员服务 首页主食休闲食品 调料 干货 酒类 方便食品公司介绍产品展示 新闻中心在线订购帮助中心版权所有四、应用系统设计4.1应用软件系统与子系统的划分应用软件系统按逻辑划分 应用软件系统的网络接入设备室系统活动开展的前提,有设备的接入才有

29、之后各项操作的完毕,当然保证安全是必要的,所以要考虑网络接入的安全接入系统,服务器部分重要针对信息的发布等相关内容。中间件重要是控制系统服务器等相关的中间件安全系统。数据存储部分是数据的管理,分析应用等。开发维护部分是对系统的研究开发维护,保证系统的安全运营。按子系统的划分休闲食品网店用户子系统管理员子系统会员注册、登陆商品选购购物车管理网站推荐管理员登陆客服管理订单管理商品管理查看订单休闲食品网站:总体上一个对外的版面,一切依据此来展开。用户子系统:一个有关于用户的相关操作系统,涉及有用户在该的网站活动,相关信息的查看等等。管理员子系统:该网站相关人员的活动,对用户的及时反馈,自身系统的管理

30、。4.2数据库与数据结构设计 数据库与数据库服务器建立连接是对数据的有效运用,数据服务器与(应用逻辑)基于web的应用服务器通过请求、响应联系实现对数据的逻辑表达,基于web的应用服务器与浏览器客户机通过请求、响应联系来实现对用户的规定。 众多服务器互相作用互相联系共同服务于公司网站,web服务器、应用服务器、事务服务器、数据库服务器互相之间作用服务于总体系统。4.3输入输出设计输入输出设计重要针相应用软件的输入输出数据的格式、内容、方法等方面的设计,保证期间的合理合法等。输入输出重要是用户通过键盘完毕在线的浏览、购买、支付等过程,以及交易之后的相关事宜等。五、网页设计首页用户登陆验证商品分类

31、用户注册验证进口零食特产零食饮料罐头糖果巧克力肉类零食坚果炒货饼干糕点膨化食品支付网页验证否否否是是是系统流程图3-1具体设计与实现5.1首页制作打开dreamweaver8 选择站点,然后点击新建站点,在显示出来的页面输入站点的名称,如下图所示。图4-1站点建立然后点击确认,就会建立一个叫“零食网”的站点文献夹,可以在dreamweaver8的右下角看到,如图图4-2文献夹视图在右下角的零食网文献夹出,右键点击该文献夹,选择新建文献夹,命名为CSS,用来存放建立的CSS样式文献。然后同理新建文献夹命名为images,用来保存建立网页所需要的相关媒体文献。点击左上角的新建选项,然后新建一个网页

32、。在设计样式中,选择插入然后选择表格,在出现的界面中设立如下图4-3表格设立表格建立完毕后,效果如下图所示图4-4页面布局然后在每个表格中插入先前准备好的背景图片即可。表格背景设立完毕后,选择插入布局对象层,然后在出现的层中插入一张表格,用来设立主页中商品的“所有分类”选项。插入的表格设立为9行1列即可。在新建的这张表格中,填入需要设立的商品名称。然后将该层移动到最左边的大表格中即可。接着制作在主页中需要显示的部分商品的展示图片,制作方法如下:打开photoshop工具,新建一张图片,大小设立为283*283,接着插入3张静态的图片,在photoshop中找到导航栏中的窗口选项,然后选中动画,

33、在动画窗口新建3张新的动画图片,在第一张新建动画中只显示插入的第一张图,然后,在第二张新建动画中只显示第二张插入的图片,最后,在第三张中只显示插入的第三张图,效果如图所示图4-5GIF图片制作然后设立播放动画的时间为1秒,如图所示图4-6动画最后,保存为gif格式,同理,创建其他需要的图片即可。在首页相应的位置插入制作好的图片,然后在最右边的大表格中填入商品的名称和资料,完善页面的布局。接着对字体和页面的背景设立CSS样式然后设立3个热点区域,分别在登陆、注册和联系的位置并设立到链接,其中在联系的链接中,我们输入mailto:用于测试。完毕后的页面如图所示图4-7首页截图5.2商品展示页面制作

34、商品展示页面我们可以运用dreamweaver自带的模板进行修改,方法如下:选择新建一个页面,在弹出的窗口中选择如下图所示图4-8模板然后我们对新建的页面进行修改。一方面将背景颜色更改为符合我们网站风格的颜色,用鼠标点击背景的空白处,我们可以再dreamweaver的下方看见背景的属性设立菜单,然后我们只需要将里面的属性修改为我们需要的属性即可,具体的参数设立如下图所示图4-9属性然后建立一个页面,在代码栏中我们写入需要设立的CSS样式代码,里面涉及网页中文字的样式和部分背景图片的样式。然后保存为CSS后缀的文献即可。返回之前所建立的商品展示页面,在网页代码中应用建好的CSS样式,输入的代码如

35、下接着,我们在页面下方的表格中设立滚动提醒文字,输入的代码如下更多商品,添加中Ing.在网页顶部的位置,我们添加一个导航条,用于其他分类商品的链接和返回首页,从左到右输入的文字如下图4-10导航栏接着选中文字,然后在下方的属性栏中添加需要连接到的地址页面。最后对网页进行一些小的修整,完毕后的页面如下图4-11商品展示页面5.3登陆界面的制作一方面插入表格并进行分割,然后在分割好后的表格中插入事先准备好的图片,完毕界面的基本制作。接着对网页的细节进行制作,在右侧的表格中,我们选择插入表单文本域,在此我们需要插入两个表单,一个用于填写用户名称,一个用于填写用户密码,并将这两个表单分别命名为t1和t

36、2,接着在这两个表单的上方添加上文字提醒。然后在两个表格的最下方添加两个按钮,一个命名为提交,用于提交表单内容,命名为取消,用于重置表单。完毕后的效果如图所示图4-12登陆框接着我们编写一个简朴的javascript程序,用于提醒用户的登陆情况。代码如下function fun1()alert(登陆成功!);最后,我们在网页的左下角设立一个返回首页的链接,完毕后的效果如图图4-13登陆页面5.4注册页面的制作插入一张表格设立为1列5行,在第一行中我们设立一个用于返回首页的链接并设立为向右对齐,在第3行中我们输入部分的文字,用于提醒注册的用户。在第5行中,我们插入5个文本域,分别用作输入用户名称

37、,用户密码,验证密码,用户邮箱,用户昵称,然后在下面插入连个单选按钮用于用户设立性别。最后,在最下方设立两个按钮,用于用户提交表单和重置表单,完毕的效果如下图所示图4-14注册页面接着我们编写用于验证用户输入的信息是否合理的javascript程序代码,部分代码如下function checkSubmit() /用于验证用户输入的信息是否对的if(document.form2.userid.value=)/判断用户是否输入了用户名 document.form2.userid.focus(); alert(用户名不能为空!); return false;if(document.form2.use

38、rpwd.value=)/判断两次输入的密码是否一致 document.form2.userpwd.focus(); alert(登陆密码不能为空!); return false;if(document.form2.userpwdok.value!=document.form2.userpwd.value) document.form2.userpwdok.focus(); alert(两次密码不一致!); return false;if(document.form2.email.value=)/判断用户是否输入了EMAIL地址 document.form2.email.focus(); al

39、ert(Email 不能为空!); return false;if(document.form2.uname.value=)/判断用户是否输入了昵称 document.form2.uname.focus(); alert(用户昵称不能为空!); return false;5.5结账页面的制作插入一张表格并进行分割,插入事先准备好的图片并设立好CSS样式,然后在页面表格中左侧插入一个文本域,用于输入购买的商品数量,接着在商品数量表单下面插入两个按钮,一个用于提交输入的数量并提醒购买成功操作,另一个用于取消当前的操作,完毕后的页面如图所示图4-15结账页面调试运营调试将站点文献移动到别的文献夹,进

40、行测试,这样可以检测网页中的链接是否添加对的。一方面进入站点文献夹,打开index.html文献,在浏览器中显示如下图所示图5-1首页测试我们可以发现部分图片显示不正常,因此可以鉴定有部分图片的链接添加的不对的,检查后发现无法显示的图片是由于图片的地址设立为绝对途径,因此,当文献夹的位置改变后,发生了图片显示不正常的情况。修改后的结果如下图所示图5-2首页链接修改后可以看到网页已经可以正常显示。在打开的首页中,我们点击左侧导航栏中的“进口零食”链接,进入如下页面图5-3进口零食页面发现一切正常,然后在该页面中,我们点击顶部导航栏中特产零食链接图5-4导航栏测试发现一切正常,然后我们在任意点击顶

41、部的其他任意链接图5-5其他链接测试发现一切正常,并且我们可以看到,下部的滚动文字提醒运营正常,如图所示图5-6底部效果 数据测试返回首页,然后我们进入注册页面,进入页面后,我们可以看到页面显示正常,然后我们输入数据进行测试,当我们不输入信息是,点击提交按钮,如图所示图5-7用户名提醒弹出提醒“用户名不能为空”,接着我们输入两组不同的密码数据,如图所示图5-8密码提醒弹出提醒“两次密码不一致”,接着我们输入对的的数据,成功跳转回首页,证明注册成功。在首页中,我们点击登录链接,输入任意用户账户和密码后,点击登录按钮,结果如图所示图5-9登陆提醒提醒“登录成功”,点击确认后,返回首页。当输入用户数据后,我们点击“清空”按钮,可以看到用户输入的数据已经清空。我们在商品展示页面,点击任意我们想要购买的商品后,进入结账页面,在结账页面中,我们可以看到默认的商品数量为1,接着修改商品数量,如图所示图5-10商品数量点击取消后图5-11成功提醒弹出取消成功的提醒并且商品的数量重置为1,如图所示图5-12重置结果当我们输入商品数量后,点击提交后图5-13成功提醒弹出购买成功提醒,并且返回首页。

展开阅读全文
部分上传会员的收益排行 01、路***(¥15400+),02、曲****(¥15300+),
03、wei****016(¥13200+),04、大***流(¥12600+),
05、Fis****915(¥4200+),06、h****i(¥4100+),
07、Q**(¥3400+),08、自******点(¥2400+),
09、h*****x(¥1400+),10、c****e(¥1100+),
11、be*****ha(¥800+),12、13********8(¥800+)。
相似文档                                   自信AI助手自信AI助手
百度文库年卡

猜你喜欢                                   自信AI导航自信AI导航
搜索标签

当前位置:首页 > 包罗万象 > 大杂烩

移动网页_全站_页脚广告1

关于我们      便捷服务       自信AI       AI导航        获赠5币

©2010-2024 宁波自信网络信息技术有限公司  版权所有

客服电话:4008-655-100  投诉/维权电话:4009-655-100

gongan.png浙公网安备33021202000488号   

icp.png浙ICP备2021020529号-1  |  浙B2-20240490  

关注我们 :gzh.png    weibo.png    LOFTER.png 

客服