I-Do婚庆网站答辩PPT课件.ppt

Click to edit Master title style,Click to edit Master text styles,Second level,Third level,Fourth level,.,LOGO,Click to edit Master title style,Click to edit Master text styles,Second level,Third level,Fourth level,.,I Do,婚庆网站设计说明书,班 级：电子商务,100,班,学 生：汪丹丹,学 号：,2010030116,指导老师：陈萱,.,一、设计背景与设计意义,二、设计内容,三、相关技术与开发工具介绍,四、网站需求分析,五、网站总体设计,六、网站详细设计,七、网站优化推广,八、网站的更新维护,九、总结,参考文献,.,一、设计背景与设计意义,（一）设计背景,近年来，我国婚庆消费处在不断地增长之中，婚庆产业虽然发展迅速，但也存在着一定的问题。中国婚庆公司品牌成长还处在蹒跚学步阶段。市场的良莠不齐、诚信缺失，是许多新人对新婚消费充满不信任。因此，从行业规律看，婚庆市场洗牌在即，其市场有待于创新开发，要形成规模化、有序化、全方位的婚庆市场，走品牌化的道路。,其次，婚庆行业作为一个新兴行业目前发展到了一个瓶颈阶段，由于网络的发展，婚庆网站已经成为了婚庆市场的另一个战场，用好的网站来宣传自己的产品是非常好的销售模式。,.,一、设计背景与设计意义,(,二,),设计意义,俗话说：世上最美好的容颜是新娘的笑脸，人间最美好的时光是拜天地的那一刻。由此可见：“执子之手，与子偕老”的承诺需要一个美好而隆重的仪式作为凭证。现在正值婚庆高峰，几乎天天可以看到一对对的新人在这美好的季节里结成眷属。但新人们或多或少都有那么一些因工作，因时间而无法将自己的婚礼办得唯美时尚。而随着网络技术的发展，许多人们都通过网络来安排婚礼事务，所以在网上开设婚庆公司，既可以让新人省时省力，又可以为他们提供多项选择。,婚庆网站,就是一个可在线浏览婚庆新闻、婚庆习俗、婚庆案例、婚庆产品、留言交流等功能的网站系统；在信息化的今天,用户甚至可以足不出户就能把自己的婚礼计划得十分缜密。只要通过我们的网站，用户就能达到自己想要的结婚效果，享受到结婚带来的乐趣！,.,二、设计内容,（一）设计目标,1,、充分利用互联网的强大优势资源把公司的产品或服务信息,247,的发送给世界的各个角落，客户可以通过网站随时较全面的了解企业；,2,、从销售的角度来看，减少交易的中间环节，降低成本，同时也起到宣传的作用。,3,、方便与客户互动来往，交流沟通，节省时间提高效率；,4,、网站建设后，再进行有效的网络营销推广，可以进一步的主动抢占市场先机。,（二）设计要求,1,、,logo,、,flash,及导航的设计要求简单大方又要紧扣网站主题，体现该网站的特色。,2,、网站首页要求内容编排得当、页面设计美观、观赏性与实用性并存，能够体现网站的首页所能实现的基本功能。,3,、后台设计要清晰明了，方便管理员对产品信息、新闻动态等信息和服务的及时更新和管理。,.,三、相关技术与开发工具介绍,该网站的建设主要用到了,Microsfot dreamwear,、,Adobe photoshop,和,Flash,等网页设计工具。,另外，还涉及了大量的,Asp,语言、,Javascript,语言、,Access,、,Div+Css,。,.,四、网站的需求分析,（一）功能需求分析,首页功能需求：通过主页版块设置，浏览者可以初步对网站的结构和主要内容有所了解，也使浏览者对该网站的创意设计有所肯定，让浏览者更加方便快捷的了解熟悉网站信息，将大体的网站情况一目了然的展示给浏览者。,二级页面功能需求：通过二级页面将网站内容更加条理、更加详细、更加方便的展现给浏览者。二级页面中将每个版块的内容具体化、深入化、详细化，让浏览者更加深入了解网站的相关服务和信息。,.,四、网站的需求分析,（二）结构化需求分析,1,、数据流程,顶层数据流图,2,、软件结构,ASP,语言 动态页面,Dreamweaver html,静态网页,Photoshop,美化图片,Flash,动画制作,I Do,婚庆网站,企业后台,浏览者,提供信息,提供服务,.,四、网站的需求分析,（三）用户界面需求,用户界面的结构必须清晰且所有的术语要保持一致。遵循对比原则，界面对象在视觉上、感觉上和行为上应与其在现实中的表现一致。,（四）管理员界面需求,管理员界面结构要简单清晰便于管理员登陆。后台设计合理可以方便管理员对网站新闻信息、产品信息等进行及时更新，使公司能够用最少的时间办最多的事情。,.,五、网站总体设计,（一）网站框架及布局设计,网站的整体色彩以白色和淡灰色为主，色彩的搭配符合婚庆气息，给人一种清新淡雅、纯洁脱俗的感觉，更容易让不同风格的顾客接受。,主页中的各个模块的布局主要是使用,div+css,实现。,主页布局采用上中下结构，上方为,logo,、,banner,、设为首页和加入收藏等，中间是导航和,flash,下方分左中右结构，左面是成功案例和联系我们，中间部分为企业简介、新闻动态和友情链接，右面是产品展示，最下方为版权信息。,页面基本上每个图标，每个关键字都设有链接。网站的整体设计美观、大气，布局合理。,.,五、网站总体设计,Logo,设为首页、加入收藏、联系我们,首页 关于我们 新闻动态 荣誉证书 产品展示 成功案例 在线留言 人才招聘 联系我们,Flash,成功案例：,关于我们：,产品展示,：,联系我们：,新闻动态：,友情链接：,版权信息,图,5-1,主页布局,主页布局草图,.,五、网站总体设计,（二）网站的总体栏目设计,I DO,婚庆,首页,关于我们,新闻动态,荣誉证书,功成案例,人才招聘,产品展示,联系我们,在线留言,行业新闻,婚礼讲堂,I,DO,资讯,婚纱造型,潮流风尚,婚品定制,场地布置,摄像摄影,主持司仪,企业简介,总裁致辞,成长历程,组织机构,服务团队,联系我们,网站前台栏目结构图,I Do,婚庆网站管理后台,系统管理,企业信息,产品管理,成功案例,新闻管理,留言管理,荣誉管理,人才管理,友情链接,网站后台栏目结构图,.,五、网站总体设计,（三）数据库设计,网站中的数据库采用,Access,设计，数据库名为,data.mdb,包括下面图中的,30,个表及其对应关系：,表,表之间的关系,.,五、网站总体设计,(,四,),网站特色,1,、,logo,的设计新颖独特，给人以耳目一新的感觉，体现出,I Do,婚庆网站的独特之处。如图所示左侧以囍字幻化的新郎新娘形象具体的表现了一对新人，红红的囍字则散发着喜庆的气氛；右侧,I Do,表明这对新人的心声及信誓，被设计成婚钻戒的,O,字母更是使人眼前一亮。,2,、,flash,设计采用图片轮播的效果展示网站的主要产品信息，给浏览者视觉冲击力，起到宣传的作用。,3,、各页面在线交流功能的设计，给网站与浏览者的交流创造了一个很好的网络条件，浏览者可以通过,QQ,了解网站的最新信息和服务。,.,六、网站详细设计,（一）首页设计,首页布局简洁，并有所创意，将所有版块项目都整齐排列，这样既可以赏心悦目，又可以让浏览者不产生视觉上的疲劳。,.,六、网站详细设计,网站首页设计图,.,六、网站详细设计,1,、栏目设计,网站栏目主要包括首页、关于我们、新闻动态、荣誉证书、产品展示、成功案例、在线留言、人才招聘、联系我们九大模块。还有其他一些小栏目，诸如友情链接、版权信息等。,2,、,logo,及,banner,设计,采用灰白渐变色条状,banner,为背景，,logo,居左，右边则是服务热线、设为首页和加入收藏。,logo,的设计新颖独特，体现出,I Do,婚庆网站的独特之处。,.,六、网站详细设计,3,、导航设计,导航设计上采用淡灰色条状为背景，黑色字体居中，分隔符都为白色，加上凹凸设计，给人以简单大方的感觉。,4,、风格与色彩搭配,主要采用浅灰色和白色作为整个首页的基调，辅助色为绿色和红色，体现生机活力和喜庆的气氛。,.,六、网站详细设计,5,、特效与代码,在本网页的右上方，浏览者可以把本网站设为首页，或是加入收藏，以便操作。,使用,flash,制作图片轮播的效果。当打开该网页时导航栏下的图片将自动轮转，循环播放图片。,在各页面的左下方联系我们一栏中，添设了在线,QQ,联系，方便浏览者沟通交流。,6,、友情链接,在此栏目中，为友情链接网址，通过链接可以直接访问相关网站，如百合婚礼、佳丽摄影、重庆婚庆、费加罗策划、花海阁、喜事网等。,.,六、网站详细设计,7,、版权信息,（二）二级页面设计,二级页面设计采用简单明了的布局，将每个板块的内容具体化、深入化、详细化。,让感兴趣的浏览者详细了解,I Do,婚庆网站。可以方便浏览者及时快捷的与我们公司取得联系，获取最新的动态。,1,、各二级页面的栏目设计,关于我们：,企业简介总裁致辞成长历程组织机构服务团队联系我们,公司地址及联系方式,logo,.,六、网站详细设计,.,六、网站详细设计,新闻动态,：行业新闻,I DO,资讯婚礼讲堂潮流风尚,.,六、网站详细设计,荣誉证书,.,六、网站详细设计,产品展示：,婚纱造型（婚纱礼服首饰发饰婚礼跟妆）,婚品定制（婚车请柬蛋糕礼炮新娘捧花）,场地布置（场地选址场地布置色系风格）,摄像摄影（摄影师婚纱影像婚礼全程跟拍）,主持司仪（金牌司仪银牌司仪铜牌司仪）,.,六、网站详细设计,成功案例：,.,六、网站详细设计,在线留言：,我要留言查看留言,.,六、网站详细设计,人才招聘：,人才招聘人才策略,.,六、网站详细设计,联系我们：,.,六、网站详细设计,2,、导航设计,与首页相同，导航设计上依旧采用浅灰色,条状图片为背景，设计简单，给人以眼目一,新的感觉。另外，在二级页面中添加一些小,的导航栏，采用绿色和白色搭配的风格，体,现网站偏向生机活力、自然亲切的特点。,3,、风格与色彩搭配,二级页面在风格色彩上采用与首页一致的,色调，页面的设计效果也与首页保持一致。,4,、首页与二级页面之间的链接,在导航栏完成首页与二级页面之间的链接。再点击链接文字时将会在文字四周出现虚线框。在导航栏中，每一个链接都能与二级页面进行链接，使浏览者更方便的浏览。,小导航,.,六、网站详细设计,5,、二级页面与二级页面之间的链接,在二级页面中，往往都能看到下图中的文字，在点击上一页或下一页时，将会进入下一个子网页，从而完成子网页之间的链接。当鼠标移动到文字或图片上时变成小手状态时，就意味着该字体或图片存在一个链接，可以使您链接到新的网页。,在导航栏中，每一个栏目都对应着一个链接，每一个链接到的网页中，都存在的新的链接，使浏览者用起来方便，看起来舒心。,.,六、网站详细设计,（三）后台管理设计,1,、数据库备份,.,六、网站详细设计,2,、后台整体框架,后台导航,显示要修改的信息,版权信息,前后台,前后台跳转链接及后台登陆,版权信息,.,六、网站详细设计,3,、后台特色,.,八、网站优化与推广,（四）基本操作流程,1,、前台操作流程,关于我们,新闻动态,荣誉证书,成功案例,人才招聘,产品展示,联系我们,在线留言,开始,登录网站首页,浏览各二级页面,退出,.,八、网站优化与推广,（,2,）、后台操作流程,开始,登录中心,管理员身份认证,管理员,Yes,系统管理,企业信息,产品管理,成功案例,新闻管理,留言管理,荣誉管理,人才管理,友情链接,结果,退出后台,结束,No,进行相关的操作,后台登陆界面,后台操作流程图,.,七、网站优化推广,（一）网站优化,1,、关键字的相关优化：选取适当的关键字，关键字密度要把握好。,2,、网站内容的更新：网站内容更新要及时准确，保证是公司的最新动态。,3,、网站的友情链接交换：要选择质量好，,PR,值高的网站交换链接。,4,、页面、细节的调整：要及时对网站的页面和细节进行更新和调整。,5,、网站内链的建设：网站的内链建设要清晰明了、方便准确。,.,七、网站优化推广,（二）网站推广,1.,论坛推广,2.,企业博客推广,3.,百度互动社区推广,4.QQ,群推广,5.,竞价广告,6.,搜索引擎优化,7.,本地门户网站推广,.,八、网站的更新维护,1,、不断充实网站内容，使之始终同步反映该网站的最新动态。,2,、及时回复访问者的留言和,Email,信件。,3,、不断增加网上在线服务功能。,4,、关注访问者在网上的活动。,5,、重视网上宣传，包括友情链接、网络广告等。,.,九、结论,通过这次网站的制作与设计让我了解了一个网站形成的基本过程和基本纲领构架，加深了我对网页设计技术的认识。,加深了我对,dreamweaver,、,ps,、,flash,等网站设计与制作的工具了解和运用。,这次设计由于时间、条件和个人能力的限制，加之设计经验的不足，在网站的整体设计及各模块功能可能设计的不完全，有待于进一步的完善和改进，以适应不同层次使用者的需求。,.,参考文献,1,周洪政,.,网页梦工厂,Dreamweaver MX,实例与操作,M.,北京,:,希望电子出版社,2010,2,杨晓钟,.,网站设计与开发,M.,北京,:,机械工业出版社，,2005-06,3,祈大鹏,.dreamweaver cs4,实用教程,M.,北京：电子工业出版社，,2010,4,沈大林,.Dreamweaver Flash Fireworks,三合一教程,M.,北京：电子工业出版社，,2001,5,刘卫东,.,编著网站建立与维护,M.,天津：南开大学出版社出版,2002,.,谢谢！,.,