梦乐坊蛋糕网站设计与制作报告(附件)
近年来，随着互联网发展日益扩大，我国的电商进入了迅猛的发展阶段，现如今网络与我们有着千丝万缕的关系。我们可以足不出户，只要有一部可以联网的手机，就可能了解到最新的社会资讯。现在还可以直接在线学习、吸收海量的知识，使信息资源能被充分发掘利用。网络的发展使得人与人之间的沟通变得更加便捷，同时也节省了电话通讯的一部分开支。电商的发展与成长也同样大大促进了物流业的开拓。我们可以在网上直接购物，做到无须出门就可以实现购物的便利。看着如此广阔的潜在市场，据此我针对在苏州的客户群体开创了“梦乐坊”网上蛋糕店，同时为了响应现代化趋势，增加品牌知名度，开拓新市场。我们为客户准备了多款式样精美的蛋糕供君挑选,并提供送货上门服务,甜品本身就可以给人带来好心情更何况是样式精美的蛋糕了。梦乐坊蛋糕，有种梦的味道。精选优质蛋糕原料,放心购买!关健词蛋糕；梦乐坊；电子商务目 录一、网站概述 1（一）网站结构 1（二）功能分配 3二、网站建设与规划 5（一）确定网站主题 5（二）规划网站 5（三）搜集材料 5（四）选择制作工具 6（五）开始制作 6三、网站的排版与布局 6（一）明确网页排版布局的原则 6（二）明确排版对象 6四、网站形象与风格设计 7（一）网站形象设计 7（二）网站风格设计 8五、网站的详细操作说明 9（一）网站的首页 9（二）产品展示项 9（三）品牌故事项 9（四）热卖必看项 9（五）用户登录 9（六）注册会员 9（七）我的购物车 10六、网站的推广与维护 10（一）网站推广 10（二）网站更新与维护 11结束语 12参考文献 13一、网站概述此次设计“梦乐坊”蛋糕网站是为了通过网上销售的方式从而增加店铺知名度以及开发潜在新客户。经过对实体销售以及同行分析考察选取了较为流行的元素开发制作了一批造型精美的蛋糕希望能通过网络的途径达到较好的宣传和销售目的。我们也在网页上面设置了产品展示，品牌故事，以及注册会员等菜单（见图1）。图1蛋糕店网站架构图示（一）网站结构1.首页左侧摆放店铺公告,中间摆放了产品展示，右边有产品的设计与制作。导航栏目中含有店铺具体分类（品牌故事、热卖产品、产品制作等）首先我制作了一个简单精美的页面来吸引客户，从而提升网站的浏览量、点击率、展现量等。通过搜索其他蛋糕店铺的网站我发现在我们进入页面的时候会有一个导航页，有些会弹出一些活动窗口或是地区选择等，因此 *好棒文|www.hbsrm.com +Q: #351916072#
我在首页前添加了一个导航页。结构虽然较为简单但是看上去比较舒服。见图2图2产品导航页2.子页（1）产品展示主要放置了主产品的flash动画，可以以动图的形式展现出各式各样的产品。并用文字加以简洁的概括。适当运用flash动画可以给客户带来不一样的感受。就好比人们在面对一本相册和一部电影的感受那样。直观的画面给人的冲击并不会有动态来的那么大。我采用的虽然是比较简单的flash动画制作，但它却带动了整个页面的画面感。(2)产品展示之所以会特地单独做产品展示的网页是因为想让客户在挑选商品的同时我们后台可以针对不同商品的点击量对顾客进行偏好统计分析。因为产品是多种多样的，我们需要开发新的产品同样也要淘汰掉一部分不受欢迎的产品。让客户吃的放心，买的舒心。产品展示页面上也有插入flash动画以及蛋糕制作流程可以供客户了解。（3）品牌故事它记录着企业的诞生，呈现了一个企业的文化价值；承载着企业的中心思想。现在也有很多网站上将其弄成了创始人说或者是董事长致辞，还搭配了视频来吸引网络点击量以及对该企业的信任度。品牌的成长连接着企业的兴衰，我在里面讲述了logo的含义以及品牌创建的由来，以此吸引顾客的注意力，加强对梦乐坊的信任度，一个优秀的品牌是该产品成功的标签。此外我还设置了公司的地址路线，可以更加方便有意向加盟或是大型订购者来公司进行实地考察。（4）热卖必看品这里面包含了本店铺的几款热卖产品，针对有选择困难症的顾客我们可以推荐她们看一下我们的热卖产品。每款热卖产品下我们都有对产品的详细介绍以及产品含义的阐述。我再此页面上面制作了搜索栏可以引导客户搜索自己心仪的分类，如浪漫、折扣、经典、迷你等。使客户能更方便搜索到自己想要的蛋糕。（5）用户登陆这是针对已经注册成为我们会员或者是对我们蛋糕有兴趣想在网上直接订购的客户群体。参照平常的注册流程，首先是手机或是邮箱的登陆许可，输入自己的密码及验证码然后直接登陆即可。里面也有设置忘记密码，新手第一次注册也会有温馨提示可以咨询首页客服等功能。如图3图3会员登陆架构图示（6）注册会员凡是第一次进入本店的消费者都可以进行会员注册，并可以享受到本店铺会员的优惠以及服务。你可以在用户登陆页面下申请注册，也可以直接到注册会员页面来注册，因为此页面中有完善信息这一项功能，完善账户信息后你可以加入会员体系，享受会员折扣价以及新人20元优惠券的获取，我们也可以据此轻松掌握您订单的情况。如图4图4注册会员架构图示（7）我的购物车这是每个有销售意图网站的必备，客户可以将自己心仪的产品添加到购物车中，在里面可进行多次删选，此页面也是为了给客户提供支付平台界面而设置的。本网站通过展示动画制作的banner、热卖产品、品牌故事、以及图片与图片相对应的文字叙述，通过整体框架的设置来向访客介绍了我们网站的主营产品以及网站整体的色彩格调和产品相对应的形象。（二）功能分配1.导航栏导航栏中含有店铺具体分类（品牌故事、热卖产品、产品制作等），网站主导航位于网站最上面，居于banner之下通常网站的主导航主要包括网站的首页和产品栏目及各个单页面的导入链接。方便用户以最快，最简单的方式到达不同的网页！同时也方便用户一目了然的发现网站的主要信息，而不用费力的寻找！如图5图5导航栏示例2.搜索栏的制作搜索栏在企业的网站中，它的位置、大小，都对我们的用户有着直接的影响。企业要对外宣传自己的产品那么搜索框就起到了举足轻重的作用。产品有不同的规格，颜色，价格，再加上新产品的一代代推陈出新，那如果没有搜索框客户岂不是要大海捞针?所以我在热卖必看产品下的子页面里插入了搜索栏，便于客户查找。它具有提高搜索的转化率，让我们的用户快速的搜索到心仪的产品，从而下单付款增加企业的销售额。如图6图6搜索栏示例3.配送范围的设计客户商品购买时可根据自己所在地区各快递公司网点服务情况，选择其配送方式；也可以咨询客服或拨打热线，客服会及时为您提供帮助。地方越远我们的产品包装以及快递物流方面的投入就要越大。我们要根据用户购买的成品数量、时间、地点等要求,及时运输和配送物资。建立恰当的物流配送方式不仅可以提高客户满意度以及送货效率，还能减低物流成本，快递物流的保障是我们留住老客户的重要手段之一。如图7图7配送范围架构图示4．购物车的设置当我们去超市购物的时候两只手所能携带的东西是非常有限的，所以超市提供了购物车方便你携带以及进一步的购物，主要目的就是为了促进销售增加店铺营业额。那么对网上购物而言，它们的目的是一样的。都是为了增加自己的销量而设计了购物车。网上购物车有合并购买的方便。当你将多件商品放入到购物车时，你不用输入验证码多次支付，也不用重复的选择送货地址。除此之外，当你遇到自己心仪的产品但不急需购买或在等它促销的时候就可以将其放在购物车中收藏，当你需要的时侯可以进入购物车直接支付它，或者推荐给朋友都可以直接在购物车里面找到不需要重复搜索该产品而带来不必要的麻烦。所以我在搜索栏中设置了我的购物车可以让客户直接在首页或者其他子页上面直接找到自己之前搜索到的产品在购物车里面进行二次挑选或者是直接付款等操作。如图8图8配送范围架构图示5.咨询客服现在的网站都配置了像线下导购一样用途的东西。那就是客服。当你在购物的时候需要咨询推荐或者有一些疑问都可以直接咨询客服，它能及时为您提供建议，它的作用就是解决客户的问题，要想更多的访客转化为客户。解决用户不能同时浏览产品，切换窗口麻烦的问题。所以我在公告下方设置了一个客服图标，有需要的客户可以拨打热线或是直接与客服咨询。二、网站建设与规划（一）确定网站主题对于一个网站而言，主题的确立就好比是一篇文章的中心思想一样重要。一个网站的建立必须要有一个明确的主题。对于公司网站而言，你不可能像综合网站一样大到包罗万象，你需要找准自己的定位。你的经营内容，你的主营产品，你所计划的活动促销等等。只要能将你的主题变的鲜明有特色，你可以将主题范围内的内容做到精而深，大而全。（二）规划网站网站设计得成功与否，与设计者的规划水平息息相关，规划网站就像设计洋房一样，当你有了地皮之后，你还需要将图纸设计好了，这样建筑工人才能着手建成一座漂亮的洋房。一个网站它包含的内容是多种多样的，列如网站的banner、网站的框架结构、栏目的设置、网站的背景风格、颜色搭配、版面布局、图文结合等，这些都需要在网页制作之前考虑好的只有这样才能在制作时驾轻就熟。也只有这样制作出来的网页才能有有特色和吸引力。（三）搜集材料明确了网站的主题后，你就需要围绕主题开始搜集建站的材料了。符合主题的背景图片，产品图片，以及相关文字的搜集。常言道“巧妇难为无米之炊”。要想让自己的网站与众不同，能吸引住用户就需要尽量的去多搜集，健全网站的版块。你可以通过书籍的阅读，搜索引擎的借鉴，报纸等获得。然后把搜集的材料取其精华，去其糟粕，作为自己制作网页的素材。（四）选择制作工具一个网站的制作往往不止通过一个软件，我们需要选择适合自己的。一款操作简单、功能强大的软件往往可以起到事半功倍的效果。我选择的是Dreamweaver软件来制作我的网页。除此之外，我还实用了Photoshop，要知道图片虽然可以搜集，但是想要和自己的主题相对应还是少不了对图片的更改；我在制作banner以及一些产品动图的时候还需用到Flash。这些软件合理的运用可以给网站增分不少。（五）开始制作建房子的地皮，图纸以及材料都有了，工具也都准备得当。下面就需要按照规划一步步地把洋房建起来了。想法变成现实，这是一个复杂而细致的过程，我们要先把网站的框架和模板做出来，有了模板你做下面其他的网页就方便多了。当出现问题修改的时候也比较方便。灵活运用模板，大大提高了制作效率。三、网站的排版与布局（一）明确网页排版布局的原则1.我们要在空间上面均匀分布图片、文字以及背景色彩达到平衡，要给用户一种协调的感觉。2.排版要有属于自己的独特性，不能一味的讲究对称。有的时候适当的制造一点变化会有意料之外的惊喜。3.每个页面的比例要协调，不能差异过大。无论是背景色差还是文字描述都要把控一个度，有整体感的网站才能吸引客户继续驻足。4.我们要合理运用空格适当进行留白，通过改变段落间距、字间距等制造一些变化的效果。5．色彩要有对比性，一个页面统一运用一个色调会显的单一，没有设计感。用户看到也不会产生较好的吸引力。（二）明确排版对象1.从网站内容上来进行排版网站的目标就是以传递企业信息为主，为了增加新用户巩固老客户。我们应该合理安排网站的内容。文字、图片、符号、动画、按钮等，这些都是网站通常具有的内容，其中文字和图片占很大的比重，我们合理结合图片与文字会有意想不到的效果，通常吸引客户的先是图片然后是文字，我们可以利用PS在图片上编辑重要文字。2.从网页的布局形式上来看制作了模板网站后我们的布局就会比较规范，一个页面由几个部分组成，每个部分针对他们都有着不同的功能。从上到下，从左到右。最上面现实banner，然后是导航栏，之后中间就是主要内容，左边我摆放了公告以及客户咨询一块。右边是可编辑区域。这块是最大的。它需要承载着导航栏下面子栏目的主要内容。3.综合起来看内容和形式即具体的网页的排版布局要能够达到一种协调的状态下才能真正的成功的网页设计，所以，不能单独考虑网页的内容的排版，如果单独考虑会造成整个页面的形式感很差，这样的排版布局会给使用者带来不良的心情。四、网站形象与风格设计（一）网站形象设计1．网站logo梦乐坊的logo我是通过艺术字体在线生成转换器生成的。在百度里面输入该网址或者直接在搜索框中输入艺术字体在线转换器点击百度一下。即可在首页看到点击进入输入“梦乐坊”三个字再选择喜欢的艺术字体即可生成。随后截图保存即可。之后在PS里面进行图片修饰即可形成。如图9图9其品牌标志以彩色艺术字的形式呈现，品牌标志为混合色，传达了该品牌时尚、创意、活力、新鲜的品牌特性。梦乐坊以时尚、创意、活力、新鲜、美味在苏州备受广大消费者欢迎，实现真正意义上的现烤、现卖、吃新尝鲜。2.banner的设计与制作它在网站中是最具视觉冲击的部分，同时放置banner也是为了网站设计上面的需要，一个页面上放置一个banner即可，它可以很展现一个网站的主体或者要传达的广告信息。一般都是由文字和图片组成的。（1）图片它做为信息传播的载体，一定要符合主旨，并有独特性，使人看到就感觉眼前一亮， banner的背景图最好是结合企业的行业特点进行独立只做或者是搜集符合其主旨的图片来使用。（2）文字你可运用CSS样式或者直接导入创意的字体来对文字进行相应部署，文字的字体大小、颜色、特效与网页的排版息息相关，让文字对banner起到画龙点睛的作用，烘托出整个网站的整体主旨。我是百度上面搜索了一些图片然后利用PS对文字进行添加和背景修改。我觉得动静结合的画面立体感会比较丰富，所以在百度上面搜索了一些动态装饰图片。利用flash将它的元件插入到背景页面上然后以GIF格式导出就可以了。这样的页面就会呈现出意想不到的动态效果。（二）网站风格设计根据网站主题据此来设计网站的风格。1．CSS技术通过CSS技术可以使得网页设计变的更加灵活，它提供了丰富的文档样式，我们可以通过CSS样式来给文字进行艺术化的编辑，以及文本的设置。可以在多个页面上重复使用。有了文字我们当然也要有合适的背景来搭配。背景的更改也可以在通过CSS样式实现。合理的运用CSS样式可以加快我们网站的加载速度，还能给我们的网页增添了其他的功能，使页面更具吸引力。CSS样式修改方便使用灵活，是我们只做网页的重要工具。2.网站模板网页的制作有很多软件，我使用了Dreamweaver软件先结合自己构思制作了一个大的框架。然后通过Dreamweaver软件在页面里编辑插入表格并在里面输入自己需要的内容，然后再发布到自己的网站上。模板页的制作，它可以使网页的风格保持一致。我在里面保留了banner，导航栏以及公告的存在并将其他内容删除。然后再网页主要板块中插入可编辑区域然后将其另存为模板即可。模板的建立充分节省了我制作子页的时间和精力，它有利于提高制作子页时的效率。3.色彩搭配网页整体的设计与色彩的搭配息息相关，不同的颜色可以给人产生不一样的视觉情感效果。我从素材的搜集和搭配上面都很纠结，因为图片可以给人带来直面的视觉冲击如果没有合理的搭配可能会起到适得其反的作用。最后经过搭配试验后，我采用了灰色打底，在配上粉色动态banner作为点缀。有种温馨舒畅的感觉。4.行为页面效果通过选中页面编辑区下方的，并点击行为面板上的“+”号按钮，我们可以在菜单里选择设置文本，在设置状态栏文本在里面输入“欢迎宝贝们来到梦乐坊！”你点击浏览器预览即可在网页左下角呈现效果。弹出消息窗口的设置可以让客户对店铺的主要活动一目了然，有意向购买的客户也一定会主动了解此活动，我们通过选中页面编辑区下方的，然后点击行为面板上的“+”号按钮，在菜单里选择弹出信息并在里面输入店铺相应活动即可。如图10图10页面效果框架五、网站的详细操作说明（一）网站的首页网站的首页集合了网站的重要信息和内容。首页包含了店铺的公告，产品的展示，以及店铺热门产品等。首页导航栏更是体现了网站的精华，导航栏目中的内容都含有链接可以供网站浏览者点击查看。只需将鼠标放在导航栏的各栏目下点击即可。（二）产品展示项之所以有产品展示这一块，是为了供顾客欣赏和了解产品的制作过程，记录精美蛋糕的设计工艺。仿佛自己已经置身其中。可以提高客户对我们产品的兴趣。点击产品展示即可进入。内含有flash动画展示我们产品以及一些推荐产品在制作工艺下方。可以让客户挑选。（三）品牌故事项是为了让客户了解企业的由来，点击品牌故事即可看到里面设有企业地址，联系电话以及企业简介。它可以增强品牌知名度，使消费者产生重复购买。对品牌产生信任和支持。从而挺高店铺知名度和销售额。（四）热卖必看项针对有选择困难症的顾客我们可以介绍其了解一下热门产品，从而减少选择对象，提高选择效率。点击热卖必看可以看到产品一条搜索栏，可以让客户自己删选心仪的产品。每一款产品里面都插入了它独立的链接。只需点击产品图片即可进入。内置返回按钮，轻点返回即可回到首页。（五）用户登录点击用户登录即可进入登录界面，输入相应内容后点击登录即可。内置返回按钮。可以直接点击返回，即可回到首页。用户如果遇到注册问题，可以直接点击返回首页去咨询客户哦！（六）注册会员点击注册会员即可进入注册页面，里面需填写手机号码获取验证码，还有完善信息按钮，点击完善信息即可进入新用户礼包页面。完善信息后即可登录获取5.5折新人优惠还有20元无门槛优惠券，您还可以加入我们的俱乐部，我们会在里面定期抽选客户赠送尝鲜样品哦！（七）我的购物车点击我的购物车即可进入我的购物车页面，里面存放了你之前收藏或是加购的物品，在里面你可以看到移入收藏夹、删除、相关商品等。你可以直接再此页面结算付款，或是进行二次删选。点击删除即可删去不需要的物品。如需返回主页面点击返回首页即可。六、网站的推广与维护（一）网站推广网站成功的建立后我们的推广工作也一定要跟上，通过各种有效的手段将公司网站的访问量提升上去。这成了每一个网站必要的考虑因素。我们可以通过使用搜索引擎推广、撰写软文、网址交换链接、传统的媒体宣传、论坛营销、老客户推新、手机软件营销等方式实现对网站的开发。1、搜索引擎推广搜索引擎是我们最常用的，要单从推广方式来说最有效的莫过于搜索引擎推广了吧，访问速度快、内容独特少重复，对网民有用，而且具有唯一性。我们可以在百度，360，搜狗之类较为知名的搜索引擎上做宣传，当别人在搜索蛋糕，甜点等相关字眼的时候能够搜索到我们公司，产品，网址等信息。2、撰写软文阔以通过书写软文或者是引用好的文章，并在里面巧妙地加入自己的网址的形式在新浪、网易、凤凰、搜狐这些大门户网站上发表，从而形成关注，达到推广效果，阔以让文章的价值最大化。3、网址交换链接和具有相似目标的网址之间实现相互推广的名单，利用合作伙伴间彼此的访问量合作推广，实现资源共享传统的媒体宣传4、传统的媒体宣传我们可以在实体门店里粘贴海报，并通过校企协商然后在学校举行试吃，并粘贴海报宣传。也可以举行一些赞助活动来提升企业知名度。5、论坛营销在关于甜品，蛋糕等与我们企业相关的一线的论坛中，发表热门内容，利用论坛的超高人气，可以加速企业知名度的提升。它具有较强的聚众能力。通过企业或个人在论坛上发帖，它可以通过这个平台与网友进行互动。这种推广方式成本低廉，可信度高，见效快。6、老客户推新定时给老客户发送邮件或者留言，现在来说也是有一定的宣传效用。特别是针对对我们有一定信赖度的客户而言，我们可以在活动佳节时期给老客户推送一些活动信息，来促进他们的再次消费。并且提出推荐新客户可以享受5折优惠的超大力度。来吸引客户推进新客户的滋生。7、手机软件营销现在智能手机功能是越来越全面，什么功能都有，利用手机的便利性，传播信息也非常快。我们可以在微信朋友圈里面发送活动消息，也可以在一些社交软件上面发布文章，通过现有的客户群体去传播。达到一传十，十传百的妙处。（二）网站更新与维护网站需要我们经常去更新和维护，这样才能笼络新的用户，也能给老客户带来更好的体验。维护方向如下1.根据企业产品的上新，以及活动的内容，对网页进行不定时的更新!2.针对老客户，我们需要不定时的去推送活动或是信息（时间间隔要有度）3.为了适应客户的需求而对网页开发新的子页来充实网站4.与时俱进，我们也要吸取竞争对手的优点5.想要让客户找得到我们的网站，我们的推广工作也要跟的上，无论是网络广告还是友情链接都需要开拓。结束语三年的读书生活即将这个百花争艳的季节划上一个句号，但对于我的人生而言却是另一场征程的开始。“海阔凭鱼跃，天高任鸟飞。”我相信在往后的时光中我会变得越来越好。三年的学习生涯里，我的身边出现了好多形形色色的人。与她们的相处给我带来了满满的收获。其中，给我带来影响最深的人，我的导师。在她身上有很多我值得学习，借鉴的地方。做到“授人以鱼不如授人以渔”的高境界，很多东西不是听了就一定懂，只有通过不断的实践才能将所学得以融会贯通。我们都是独立的个体，有着不同的思维模式，也许我做不到像老师那样的思考。但是我会努力变得更加优秀，从先前论文的选题到论文内容格式的调整,也都经过您悉心的点拨之后的决定,让我有种“山重水复疑无路,柳暗花明又一村”的感觉。之所以选择网站的设计与制作也是因为想将老师所授予的知识能得以实践。希望能将所学不要都荒废了。我的网站还有很多不足的地方。虽然查阅了很多资料还看了很多视频但是这是我独立完成的，我很骄傲！希望以后的我无论遇到什么挫折都能勇往直前。在论文即将完成之际，我的心情也是纠结万分的，从开始进入课题到论文的顺利完成，有着太多的不容易，修修改改了多少次。有多少可敬的师长、同学、朋友给了我无言的帮助，在这里请接受我诚挚谢意！在此也感谢学院为我们毕业提供良好的的环境。参考文献赵春燕主编.电子商务网站设计与制作[M].－北京北京大学出版社,2011.4赵浩波,马尚平.新建网站的推广方法与对策研究[J].管理观察,2016(23):64-67.张岩. 电商网站视觉设计应用研究[D].湖北工业大学,2016.袁泉.网站维护和安全管理的重要性分析[J].计算机光盘软件与应用，2014,17（11）194+196.黄旭东.浅议Flash在网站中的应用[J].湖南大众传媒职业技术学院学报，2013,13（01）50-52蒋继红.电子商务美工课中PS图片处理教学探索[J].中国教育技术装备，2017（13）147-148+152.韩媛媛.浅谈Dreamweaver在网页设计中的应用[J].信息与电脑（理论版），2016（07）57-58王艳.Dreamweaver网页制作技巧与问题处理[J].电脑编程技巧与维护，2016（19）70-72.艺术字体在线生成器- http://www.popzitizh.com/附录产品介绍网页代码与展示图（图11）图10梦乐坊蛋糕网站
我在首页前添加了一个导航页。结构虽然较为简单但是看上去比较舒服。见图2图2产品导航页2.子页（1）产品展示主要放置了主产品的flash动画，可以以动图的形式展现出各式各样的产品。并用文字加以简洁的概括。适当运用flash动画可以给客户带来不一样的感受。就好比人们在面对一本相册和一部电影的感受那样。直观的画面给人的冲击并不会有动态来的那么大。我采用的虽然是比较简单的flash动画制作，但它却带动了整个页面的画面感。(2)产品展示之所以会特地单独做产品展示的网页是因为想让客户在挑选商品的同时我们后台可以针对不同商品的点击量对顾客进行偏好统计分析。因为产品是多种多样的，我们需要开发新的产品同样也要淘汰掉一部分不受欢迎的产品。让客户吃的放心，买的舒心。产品展示页面上也有插入flash动画以及蛋糕制作流程可以供客户了解。（3）品牌故事它记录着企业的诞生，呈现了一个企业的文化价值；承载着企业的中心思想。现在也有很多网站上将其弄成了创始人说或者是董事长致辞，还搭配了视频来吸引网络点击量以及对该企业的信任度。品牌的成长连接着企业的兴衰，我在里面讲述了logo的含义以及品牌创建的由来，以此吸引顾客的注意力，加强对梦乐坊的信任度，一个优秀的品牌是该产品成功的标签。此外我还设置了公司的地址路线，可以更加方便有意向加盟或是大型订购者来公司进行实地考察。（4）热卖必看品这里面包含了本店铺的几款热卖产品，针对有选择困难症的顾客我们可以推荐她们看一下我们的热卖产品。每款热卖产品下我们都有对产品的详细介绍以及产品含义的阐述。我再此页面上面制作了搜索栏可以引导客户搜索自己心仪的分类，如浪漫、折扣、经典、迷你等。使客户能更方便搜索到自己想要的蛋糕。（5）用户登陆这是针对已经注册成为我们会员或者是对我们蛋糕有兴趣想在网上直接订购的客户群体。参照平常的注册流程，首先是手机或是邮箱的登陆许可，输入自己的密码及验证码然后直接登陆即可。里面也有设置忘记密码，新手第一次注册也会有温馨提示可以咨询首页客服等功能。如图3图3会员登陆架构图示（6）注册会员凡是第一次进入本店的消费者都可以进行会员注册，并可以享受到本店铺会员的优惠以及服务。你可以在用户登陆页面下申请注册，也可以直接到注册会员页面来注册，因为此页面中有完善信息这一项功能，完善账户信息后你可以加入会员体系，享受会员折扣价以及新人20元优惠券的获取，我们也可以据此轻松掌握您订单的情况。如图4图4注册会员架构图示（7）我的购物车这是每个有销售意图网站的必备，客户可以将自己心仪的产品添加到购物车中，在里面可进行多次删选，此页面也是为了给客户提供支付平台界面而设置的。本网站通过展示动画制作的banner、热卖产品、品牌故事、以及图片与图片相对应的文字叙述，通过整体框架的设置来向访客介绍了我们网站的主营产品以及网站整体的色彩格调和产品相对应的形象。（二）功能分配1.导航栏导航栏中含有店铺具体分类（品牌故事、热卖产品、产品制作等），网站主导航位于网站最上面，居于banner之下通常网站的主导航主要包括网站的首页和产品栏目及各个单页面的导入链接。方便用户以最快，最简单的方式到达不同的网页！同时也方便用户一目了然的发现网站的主要信息，而不用费力的寻找！如图5图5导航栏示例2.搜索栏的制作搜索栏在企业的网站中，它的位置、大小，都对我们的用户有着直接的影响。企业要对外宣传自己的产品那么搜索框就起到了举足轻重的作用。产品有不同的规格，颜色，价格，再加上新产品的一代代推陈出新，那如果没有搜索框客户岂不是要大海捞针?所以我在热卖必看产品下的子页面里插入了搜索栏，便于客户查找。它具有提高搜索的转化率，让我们的用户快速的搜索到心仪的产品，从而下单付款增加企业的销售额。如图6图6搜索栏示例3.配送范围的设计客户商品购买时可根据自己所在地区各快递公司网点服务情况，选择其配送方式；也可以咨询客服或拨打热线，客服会及时为您提供帮助。地方越远我们的产品包装以及快递物流方面的投入就要越大。我们要根据用户购买的成品数量、时间、地点等要求,及时运输和配送物资。建立恰当的物流配送方式不仅可以提高客户满意度以及送货效率，还能减低物流成本，快递物流的保障是我们留住老客户的重要手段之一。如图7图7配送范围架构图示4．购物车的设置当我们去超市购物的时候两只手所能携带的东西是非常有限的，所以超市提供了购物车方便你携带以及进一步的购物，主要目的就是为了促进销售增加店铺营业额。那么对网上购物而言，它们的目的是一样的。都是为了增加自己的销量而设计了购物车。网上购物车有合并购买的方便。当你将多件商品放入到购物车时，你不用输入验证码多次支付，也不用重复的选择送货地址。除此之外，当你遇到自己心仪的产品但不急需购买或在等它促销的时候就可以将其放在购物车中收藏，当你需要的时侯可以进入购物车直接支付它，或者推荐给朋友都可以直接在购物车里面找到不需要重复搜索该产品而带来不必要的麻烦。所以我在搜索栏中设置了我的购物车可以让客户直接在首页或者其他子页上面直接找到自己之前搜索到的产品在购物车里面进行二次挑选或者是直接付款等操作。如图8图8配送范围架构图示5.咨询客服现在的网站都配置了像线下导购一样用途的东西。那就是客服。当你在购物的时候需要咨询推荐或者有一些疑问都可以直接咨询客服，它能及时为您提供建议，它的作用就是解决客户的问题，要想更多的访客转化为客户。解决用户不能同时浏览产品，切换窗口麻烦的问题。所以我在公告下方设置了一个客服图标，有需要的客户可以拨打热线或是直接与客服咨询。二、网站建设与规划（一）确定网站主题对于一个网站而言，主题的确立就好比是一篇文章的中心思想一样重要。一个网站的建立必须要有一个明确的主题。对于公司网站而言，你不可能像综合网站一样大到包罗万象，你需要找准自己的定位。你的经营内容，你的主营产品，你所计划的活动促销等等。只要能将你的主题变的鲜明有特色，你可以将主题范围内的内容做到精而深，大而全。（二）规划网站网站设计得成功与否，与设计者的规划水平息息相关，规划网站就像设计洋房一样，当你有了地皮之后，你还需要将图纸设计好了，这样建筑工人才能着手建成一座漂亮的洋房。一个网站它包含的内容是多种多样的，列如网站的banner、网站的框架结构、栏目的设置、网站的背景风格、颜色搭配、版面布局、图文结合等，这些都需要在网页制作之前考虑好的只有这样才能在制作时驾轻就熟。也只有这样制作出来的网页才能有有特色和吸引力。（三）搜集材料明确了网站的主题后，你就需要围绕主题开始搜集建站的材料了。符合主题的背景图片，产品图片，以及相关文字的搜集。常言道“巧妇难为无米之炊”。要想让自己的网站与众不同，能吸引住用户就需要尽量的去多搜集，健全网站的版块。你可以通过书籍的阅读，搜索引擎的借鉴，报纸等获得。然后把搜集的材料取其精华，去其糟粕，作为自己制作网页的素材。（四）选择制作工具一个网站的制作往往不止通过一个软件，我们需要选择适合自己的。一款操作简单、功能强大的软件往往可以起到事半功倍的效果。我选择的是Dreamweaver软件来制作我的网页。除此之外，我还实用了Photoshop，要知道图片虽然可以搜集，但是想要和自己的主题相对应还是少不了对图片的更改；我在制作banner以及一些产品动图的时候还需用到Flash。这些软件合理的运用可以给网站增分不少。（五）开始制作建房子的地皮，图纸以及材料都有了，工具也都准备得当。下面就需要按照规划一步步地把洋房建起来了。想法变成现实，这是一个复杂而细致的过程，我们要先把网站的框架和模板做出来，有了模板你做下面其他的网页就方便多了。当出现问题修改的时候也比较方便。灵活运用模板，大大提高了制作效率。三、网站的排版与布局（一）明确网页排版布局的原则1.我们要在空间上面均匀分布图片、文字以及背景色彩达到平衡，要给用户一种协调的感觉。2.排版要有属于自己的独特性，不能一味的讲究对称。有的时候适当的制造一点变化会有意料之外的惊喜。3.每个页面的比例要协调，不能差异过大。无论是背景色差还是文字描述都要把控一个度，有整体感的网站才能吸引客户继续驻足。4.我们要合理运用空格适当进行留白，通过改变段落间距、字间距等制造一些变化的效果。5．色彩要有对比性，一个页面统一运用一个色调会显的单一，没有设计感。用户看到也不会产生较好的吸引力。（二）明确排版对象1.从网站内容上来进行排版网站的目标就是以传递企业信息为主，为了增加新用户巩固老客户。我们应该合理安排网站的内容。文字、图片、符号、动画、按钮等，这些都是网站通常具有的内容，其中文字和图片占很大的比重，我们合理结合图片与文字会有意想不到的效果，通常吸引客户的先是图片然后是文字，我们可以利用PS在图片上编辑重要文字。2.从网页的布局形式上来看制作了模板网站后我们的布局就会比较规范，一个页面由几个部分组成，每个部分针对他们都有着不同的功能。从上到下，从左到右。最上面现实banner，然后是导航栏，之后中间就是主要内容，左边我摆放了公告以及客户咨询一块。右边是可编辑区域。这块是最大的。它需要承载着导航栏下面子栏目的主要内容。3.综合起来看内容和形式即具体的网页的排版布局要能够达到一种协调的状态下才能真正的成功的网页设计，所以，不能单独考虑网页的内容的排版，如果单独考虑会造成整个页面的形式感很差，这样的排版布局会给使用者带来不良的心情。四、网站形象与风格设计（一）网站形象设计1．网站logo梦乐坊的logo我是通过艺术字体在线生成转换器生成的。在百度里面输入该网址或者直接在搜索框中输入艺术字体在线转换器点击百度一下。即可在首页看到点击进入输入“梦乐坊”三个字再选择喜欢的艺术字体即可生成。随后截图保存即可。之后在PS里面进行图片修饰即可形成。如图9图9其品牌标志以彩色艺术字的形式呈现，品牌标志为混合色，传达了该品牌时尚、创意、活力、新鲜的品牌特性。梦乐坊以时尚、创意、活力、新鲜、美味在苏州备受广大消费者欢迎，实现真正意义上的现烤、现卖、吃新尝鲜。2.banner的设计与制作它在网站中是最具视觉冲击的部分，同时放置banner也是为了网站设计上面的需要，一个页面上放置一个banner即可，它可以很展现一个网站的主体或者要传达的广告信息。一般都是由文字和图片组成的。（1）图片它做为信息传播的载体，一定要符合主旨，并有独特性，使人看到就感觉眼前一亮， banner的背景图最好是结合企业的行业特点进行独立只做或者是搜集符合其主旨的图片来使用。（2）文字你可运用CSS样式或者直接导入创意的字体来对文字进行相应部署，文字的字体大小、颜色、特效与网页的排版息息相关，让文字对banner起到画龙点睛的作用，烘托出整个网站的整体主旨。我是百度上面搜索了一些图片然后利用PS对文字进行添加和背景修改。我觉得动静结合的画面立体感会比较丰富，所以在百度上面搜索了一些动态装饰图片。利用flash将它的元件插入到背景页面上然后以GIF格式导出就可以了。这样的页面就会呈现出意想不到的动态效果。（二）网站风格设计根据网站主题据此来设计网站的风格。1．CSS技术通过CSS技术可以使得网页设计变的更加灵活，它提供了丰富的文档样式，我们可以通过CSS样式来给文字进行艺术化的编辑，以及文本的设置。可以在多个页面上重复使用。有了文字我们当然也要有合适的背景来搭配。背景的更改也可以在通过CSS样式实现。合理的运用CSS样式可以加快我们网站的加载速度，还能给我们的网页增添了其他的功能，使页面更具吸引力。CSS样式修改方便使用灵活，是我们只做网页的重要工具。2.网站模板网页的制作有很多软件，我使用了Dreamweaver软件先结合自己构思制作了一个大的框架。然后通过Dreamweaver软件在页面里编辑插入表格并在里面输入自己需要的内容，然后再发布到自己的网站上。模板页的制作，它可以使网页的风格保持一致。我在里面保留了banner，导航栏以及公告的存在并将其他内容删除。然后再网页主要板块中插入可编辑区域然后将其另存为模板即可。模板的建立充分节省了我制作子页的时间和精力，它有利于提高制作子页时的效率。3.色彩搭配网页整体的设计与色彩的搭配息息相关，不同的颜色可以给人产生不一样的视觉情感效果。我从素材的搜集和搭配上面都很纠结，因为图片可以给人带来直面的视觉冲击如果没有合理的搭配可能会起到适得其反的作用。最后经过搭配试验后，我采用了灰色打底，在配上粉色动态banner作为点缀。有种温馨舒畅的感觉。4.行为页面效果通过选中页面编辑区下方的，并点击行为面板上的“+”号按钮，我们可以在菜单里选择设置文本，在设置状态栏文本在里面输入“欢迎宝贝们来到梦乐坊！”你点击浏览器预览即可在网页左下角呈现效果。弹出消息窗口的设置可以让客户对店铺的主要活动一目了然，有意向购买的客户也一定会主动了解此活动，我们通过选中页面编辑区下方的，然后点击行为面板上的“+”号按钮，在菜单里选择弹出信息并在里面输入店铺相应活动即可。如图10图10页面效果框架五、网站的详细操作说明（一）网站的首页网站的首页集合了网站的重要信息和内容。首页包含了店铺的公告，产品的展示，以及店铺热门产品等。首页导航栏更是体现了网站的精华，导航栏目中的内容都含有链接可以供网站浏览者点击查看。只需将鼠标放在导航栏的各栏目下点击即可。（二）产品展示项之所以有产品展示这一块，是为了供顾客欣赏和了解产品的制作过程，记录精美蛋糕的设计工艺。仿佛自己已经置身其中。可以提高客户对我们产品的兴趣。点击产品展示即可进入。内含有flash动画展示我们产品以及一些推荐产品在制作工艺下方。可以让客户挑选。（三）品牌故事项是为了让客户了解企业的由来，点击品牌故事即可看到里面设有企业地址，联系电话以及企业简介。它可以增强品牌知名度，使消费者产生重复购买。对品牌产生信任和支持。从而挺高店铺知名度和销售额。（四）热卖必看项针对有选择困难症的顾客我们可以介绍其了解一下热门产品，从而减少选择对象，提高选择效率。点击热卖必看可以看到产品一条搜索栏，可以让客户自己删选心仪的产品。每一款产品里面都插入了它独立的链接。只需点击产品图片即可进入。内置返回按钮，轻点返回即可回到首页。（五）用户登录点击用户登录即可进入登录界面，输入相应内容后点击登录即可。内置返回按钮。可以直接点击返回，即可回到首页。用户如果遇到注册问题，可以直接点击返回首页去咨询客户哦！（六）注册会员点击注册会员即可进入注册页面，里面需填写手机号码获取验证码，还有完善信息按钮，点击完善信息即可进入新用户礼包页面。完善信息后即可登录获取5.5折新人优惠还有20元无门槛优惠券，您还可以加入我们的俱乐部，我们会在里面定期抽选客户赠送尝鲜样品哦！（七）我的购物车点击我的购物车即可进入我的购物车页面，里面存放了你之前收藏或是加购的物品，在里面你可以看到移入收藏夹、删除、相关商品等。你可以直接再此页面结算付款，或是进行二次删选。点击删除即可删去不需要的物品。如需返回主页面点击返回首页即可。六、网站的推广与维护（一）网站推广网站成功的建立后我们的推广工作也一定要跟上，通过各种有效的手段将公司网站的访问量提升上去。这成了每一个网站必要的考虑因素。我们可以通过使用搜索引擎推广、撰写软文、网址交换链接、传统的媒体宣传、论坛营销、老客户推新、手机软件营销等方式实现对网站的开发。1、搜索引擎推广搜索引擎是我们最常用的，要单从推广方式来说最有效的莫过于搜索引擎推广了吧，访问速度快、内容独特少重复，对网民有用，而且具有唯一性。我们可以在百度，360，搜狗之类较为知名的搜索引擎上做宣传，当别人在搜索蛋糕，甜点等相关字眼的时候能够搜索到我们公司，产品，网址等信息。2、撰写软文阔以通过书写软文或者是引用好的文章，并在里面巧妙地加入自己的网址的形式在新浪、网易、凤凰、搜狐这些大门户网站上发表，从而形成关注，达到推广效果，阔以让文章的价值最大化。3、网址交换链接和具有相似目标的网址之间实现相互推广的名单，利用合作伙伴间彼此的访问量合作推广，实现资源共享传统的媒体宣传4、传统的媒体宣传我们可以在实体门店里粘贴海报，并通过校企协商然后在学校举行试吃，并粘贴海报宣传。也可以举行一些赞助活动来提升企业知名度。5、论坛营销在关于甜品，蛋糕等与我们企业相关的一线的论坛中，发表热门内容，利用论坛的超高人气，可以加速企业知名度的提升。它具有较强的聚众能力。通过企业或个人在论坛上发帖，它可以通过这个平台与网友进行互动。这种推广方式成本低廉，可信度高，见效快。6、老客户推新定时给老客户发送邮件或者留言，现在来说也是有一定的宣传效用。特别是针对对我们有一定信赖度的客户而言，我们可以在活动佳节时期给老客户推送一些活动信息，来促进他们的再次消费。并且提出推荐新客户可以享受5折优惠的超大力度。来吸引客户推进新客户的滋生。7、手机软件营销现在智能手机功能是越来越全面，什么功能都有，利用手机的便利性，传播信息也非常快。我们可以在微信朋友圈里面发送活动消息，也可以在一些社交软件上面发布文章，通过现有的客户群体去传播。达到一传十，十传百的妙处。（二）网站更新与维护网站需要我们经常去更新和维护，这样才能笼络新的用户，也能给老客户带来更好的体验。维护方向如下1.根据企业产品的上新，以及活动的内容，对网页进行不定时的更新!2.针对老客户，我们需要不定时的去推送活动或是信息（时间间隔要有度）3.为了适应客户的需求而对网页开发新的子页来充实网站4.与时俱进，我们也要吸取竞争对手的优点5.想要让客户找得到我们的网站，我们的推广工作也要跟的上，无论是网络广告还是友情链接都需要开拓。结束语三年的读书生活即将这个百花争艳的季节划上一个句号，但对于我的人生而言却是另一场征程的开始。“海阔凭鱼跃，天高任鸟飞。”我相信在往后的时光中我会变得越来越好。三年的学习生涯里，我的身边出现了好多形形色色的人。与她们的相处给我带来了满满的收获。其中，给我带来影响最深的人，我的导师。在她身上有很多我值得学习，借鉴的地方。做到“授人以鱼不如授人以渔”的高境界，很多东西不是听了就一定懂，只有通过不断的实践才能将所学得以融会贯通。我们都是独立的个体，有着不同的思维模式，也许我做不到像老师那样的思考。但是我会努力变得更加优秀，从先前论文的选题到论文内容格式的调整,也都经过您悉心的点拨之后的决定,让我有种“山重水复疑无路,柳暗花明又一村”的感觉。之所以选择网站的设计与制作也是因为想将老师所授予的知识能得以实践。希望能将所学不要都荒废了。我的网站还有很多不足的地方。虽然查阅了很多资料还看了很多视频但是这是我独立完成的，我很骄傲！希望以后的我无论遇到什么挫折都能勇往直前。在论文即将完成之际，我的心情也是纠结万分的，从开始进入课题到论文的顺利完成，有着太多的不容易，修修改改了多少次。有多少可敬的师长、同学、朋友给了我无言的帮助，在这里请接受我诚挚谢意！在此也感谢学院为我们毕业提供良好的的环境。参考文献赵春燕主编.电子商务网站设计与制作[M].－北京北京大学出版社,2011.4赵浩波,马尚平.新建网站的推广方法与对策研究[J].管理观察,2016(23):64-67.张岩. 电商网站视觉设计应用研究[D].湖北工业大学,2016.袁泉.网站维护和安全管理的重要性分析[J].计算机光盘软件与应用，2014,17（11）194+196.黄旭东.浅议Flash在网站中的应用[J].湖南大众传媒职业技术学院学报，2013,13（01）50-52蒋继红.电子商务美工课中PS图片处理教学探索[J].中国教育技术装备，2017（13）147-148+152.韩媛媛.浅谈Dreamweaver在网页设计中的应用[J].信息与电脑（理论版），2016（07）57-58王艳.Dreamweaver网页制作技巧与问题处理[J].电脑编程技巧与维护，2016（19）70-72.艺术字体在线生成器- http://www.popzitizh.com/附录产品介绍网页代码与展示图（图11）图10
| |
| EditRegion2 | |
版权保护: 本文由 hbsrm.com编辑，转载请保留链接: www.hbsrm.com/jmgl/dzsw/247.html
