网页设计迪欧咖啡课设报告.doc
WEB开发技术课程设计论文题 目： 基于DW网页设计迪欧咖啡 系 别：_ 经济管理系 _班 级： 姓 名： 二一二年十二月基于DW的网站设计迪欧咖啡一、 选题的目的和意义 如今企业建立自己的企业网站已经成为一种在信息时代生存的必要手段。1巨大的宣传作用网络的无所不在和方便快捷将改变我们过去的被动的宣传和经营模式，互连网都可以在网上通过直接点击和友好链接的形式浏览我们的网站，这样我们将拥有数以亿记的潜在客户；我们可以随心所欲的在我们的网站上发布自己的产品介绍和供求信息，把我们自己的产品，经营理念推广至所有的互连网用户-一个目前以经有4亿之众，而且每半年翻一番的用户群体。2是时代发展的要求网络已经成为人们目前生活中不可缺少的事物，越来越多的人们已经习惯通过网络交流，获得信息，大家已经摒弃了传统的模式，这是社会发展的趋势，在这个与时俱进才能生存的世界，企业用户必须紧随时代前进的步伐。3获得详实有效及时的信息由于互连网的交互性和信息传播的迅捷性，使得网络上充满了各种信息，用户可以根据自己的需求，经过简单地分析和分类，就可以得到以前花费数人数天才能搜集到的信息，极大的支持了您的生产管理和经营。4是一种潜在的无形资产企业网站的建立，将使得我们的企业知名度大增，从而扩大了我们的无形资产，我们也将获得其他形式得不到的品牌效应，这一点，对于企业在这个注重柔性管理和文化效应的世界上有至关重要的作用。5企业建站的成本极低我们在一个发行量才几十万的报纸做一页广告，在电视台做几秒钟的广告都将花费几万元，得到的效应也不满人意，可是，我们只须一、两万元就可以在互连网上拥有自己的空间，直接面对几亿用户所以对于与时俱进的迪欧咖啡也应该有自己的网站,让更爱咖啡及爱迪欧咖啡的消费者更好更完全的了解迪欧咖啡。二、目前该选题的研究现状每个行业都有一个从诞生、成长到成熟的这样一个过程。西餐咖啡连锁加盟行业也不例外，而且这个行业变化得非常快，这几年可以说是西餐咖啡连锁加盟的成长阶段。 近年来，特许连锁经营在中国火爆起来，并成为最受人关注的商业经营模式，它影响和改变着我们的物质生活和精神生活。当然，它在给我们的产业经济带来冲击的同时也带来了新的活力。如今，特许连锁经营已经渗透到我们现实经济文化生活的各个领域，尤其以西餐咖啡业为代表。目前咖啡连锁加盟这个市场非常地不规范，好多西餐咖啡加盟品牌都在恶性竞争，都在拼价格，不注重品质，都想着用最短的时间挣取最大的效益，只求快不求稳不求质，眼光只看到眼前的利益，可以说现在的很多加盟连锁公司没有想把自己的品牌做好做大，这样的做法给西餐咖啡加盟市场造成非常不好的影响，其结果只有一个就是真正的好品牌与有雄厚资本支持的品牌能生存下来，其他支撑不下去的只能倒闭关门。现在的市场是比较透明的了，所以如果没有品质保证根本无法招来加盟商，即使有人加盟了加盟者也会觉得上当受骗了。对这个品牌与以后的招商带来困难。现在的西餐咖啡连锁加盟公司运作的模式都大同小异没有特色，没有卖点技术含量极低很容易复制，所以给西餐咖啡加盟市场带来了很多负面影响。大部分特许人都是面向全国招商，招商渠道也是通过互联网，这样给加盟商一个可比性，当客户看到这些公司的加盟模式、流程都几乎一样，而且加盟费越来越低，客户就会想这些所谓的外国品牌的含金量到底有多少，所以人们是不会轻易加盟的。 面对这样的市场情况下想拥有自己的一份蛋糕就要先稳扎稳打，然后稳中求快，怎么稳扎稳打呢？就要将特许人、特许加盟商、供应商三者有机地结合起来，组建成一个特许连锁经营体系。西餐咖啡特许经营成功的各种因素，包括选址、店面设计、广告、进货渠道、专有技术、经营策略、管理技术及诀窍等内容。迪欧基于现在西餐连锁建立一个网站，更好的做好推广以及服务。三、设计思路分析设计思路主要分为五个小部分介绍：1、网站的LOGO设计：由迪欧咖啡公司图标构成2、网站的标准色彩：由于网站是介绍咖啡，所以主要色彩并不鲜艳，而是采用了咖啡的颜色作为主色调，并且网站的色彩不超过四种，不然会让人感觉眼花缭乱。3、网站的标准文字：和网站的标准色彩差不多，由于标准文字是指用于标题、标志、主菜单的特有字体，所以网站的默认字体是宋体。4、网站的宣传标语：“迪欧DIO”原引世界语“神的博爱”之寓意，又可作为英语“DEAR”的谐音，表达有“亲爱的”含义，传递着迪欧如咖啡般的浓浓情谊。同时它与迪欧“诚信、尊重、关怀”的核心价值观相契合，期望人们在这“爱的咖啡馆”，累积生命，畅想生活！ 5、网站的结构：网站采用现在网站普遍使用的模式，然后进过简化而形成的具有迪欧咖啡的特别的结构形式，网站主页采用上中下三个主要的版块，最上方为网站的LOGO位置，最下方为网站的版权所有以及制作单位的名称，网站的中间部分是网站的核心部分，中间部分又分为左中右三块，左边为网站的导航栏，中间是剧组自成立以来的大大小小的活动介绍，右边是一些常用的链接。网站的其他子页面和主页的差别不大，最大的差别只是在中间部分，左边照样还是网站的导航栏，而右边则是子页面要显示的主要内容。四、设计过程描述一、初期阶段（收集网站的资料）首先先确定网站的主题，网站所要做的内容，确定网站的主题为企业网站，即迪欧咖啡，然后通过网上收集迪欧咖啡简介，迪欧咖啡的图片，点面，迪欧咖啡成员，找了关于迪欧咖啡建设的一些细则，以及公司自成立以来的一些活动的介绍，然后还搜索相关的一些建设网站的前提资料。并且在做课程设计的时候认真听老师讲网页的制作过程，课后在寝室也很努力制作网页。二、中期阶段（分析资料并加以整理）在初期阶段收集了很多设计网站的资料，以及迪欧咖啡的相关信息，但是这些资料和信息收集的非常的零散，而中期阶段就是整理分析这些资料和信息，然后设计相应的网站的子页面，并且对网站的整体设计、网站的布局、网站的配色做了进一步的改进，在中期阶段整理和分析资料的过程中，遇到的一些问题和困难都会主动的和身边同学进行交流，以及向老师进行询问解决办法，使得收集来的资料和信息达到最大的利用化。三、后期阶段（网站所需图片的设计）在中期阶段已经收集好了网站设计所需的文字资料，在后期阶段所要做的就是收集网站设计所需要的相应的图片，而大部分的图片需要自己根据在网上下载的模板图片进行修改，使用Photoshop美化和修改图片，使之达到网站所需的要求。及使用网页制作工具DW css5四、最后阶段（网站的页面设计）经过前面三个阶段的资料收集，图片设计，现在进入网站设计的最后一个阶段网页设计，网页设计主要就是设计网站的主页面，以及相应的子页面。网站的主页面的内容有网站的LOGO，网站的导航栏，网站的版权所有，网站的子页面的内容有网站的导航栏，公司的相应介绍等。使用清楚的信息，确保用户了解此网页的信息，并且网站主页与子页面之间的联系比较紧密，上下衔接密切。保持一致性：虽然更改不同 Web 页的外观并不难，但这并不意味着应该这么做。将主要功能-例如返回“主页”的链接或者执行一个搜索-放在每页的相同位置。保持简洁：说起来容易做起来难。尝试征求反馈意见。 尝试新的东西：不要害怕打破常规，尝试一些完全不同的东西。如果您不试试，永远不会找到真正的答案。应该在网页中体现自己的创新能力，有自己创新的东西与思维。DW的功能及优点：Dreamweaver软件优点1.制作效率Dreamweaver可以用最快速的方式将Fireworks，FreeHand，或Photoshop等档案移至网页上。使用检色吸管工具选择荧幕上的颜色可设定最接近的网页安全色。对于选单，快捷键与格式控制，都只要一个简单步骤便可完成。Dreamweaver能与您喜爱的设计工具，如Playback Flash，Shockwave和外挂模组等搭配，不需离开Dreamweaver便可完成，整体运用流程自然顺畅。除此之外，只要单击便可使Dreamweaver自动开启Firework或Photoshop来进行编辑与设定图档的最佳化。 2.网站管理使用网站地图可以快速制作网站雏形、设计、更新和重组网页。改变网页位置或档案名称，Dreamweaver 会自动更新所有链接。使用支援文字、HTML码、HTML属性标签和一般语法的搜寻及置换功能使得复杂的网站更新变得迅速又简单。 3.控制能力Dreamweaver是唯一提供Roundtrip HTML、视觉化编辑与原始码编辑同步的设计工具。它包含HomeSite和BBEdit等主流文字编辑器。帧(frames)和表格的制作速度快的令您无法想像。进阶表格编辑功能使您简单的选择单格、行、栏或作未连续之选取。甚至可以排序或格式化表格群组，Dreamweaver 支援精准定位，利用可轻易转换成表格的图层以拖拉置放的方式进行版面配置。所见即所得 Dreamweaver成功整合动态式出版视觉编辑及电子商务功能，提供超强的支援能力给Third-party厂商，包含ASP， Apache，BroadVision， Cold Fusion，iCAT， Tango与自行发展的应用软体。当您正使用Dreamweaver在设计动态网页时，所见即所得的功能，让您不需要透过浏览器就能预览网页。梦幻样版和XML Dreamweaver将内容与设计分开，应用于快速网页更新和团队合作网页编辑。建立网页外观的样版，指定可编辑或不可编辑的部份，内容提供者可直接编辑以样式为主的内容却不会不小心改变既定之样式。您也可以使用样版正确地输入或输出XML内容。 全方位的呈现利用Dreamweaver设计的网页，可以全方位的呈现在任何平台的热门浏览器上。对于cascading style sheets的动态HTML支援和鼠标换图效果，声音和动画的DHTML效果资料库可在Netscape和Microsoft浏览器上执行。使用不同浏览器检示功能，Dreamweaver可以告知您在不同浏览器上执行的成效如何。当有新的浏览器上市时，只要从Dreamweaver的网站在下载它的描述档，便可得知详尽的成效报告。结构图首页企业文化产品服务顾客中心人才频道那些故事关与迪欧加盟我们董事长致辞结构架构迪欧大事记迪欧大事记加盟我们企文化业新品快递产品展示服务风采杰士杰士常见问题薪资福利储干工程招聘信息新品展示首页：主要是那些关于迪欧、企业文化、产品服务、顾客中心、人才频道、及加盟我们，还有加入一段视频宣传，使页面更加生动形象，还有一些新闻实时及我们的新品介绍关于迪欧与迪欧简介：迪欧餐饮集团在经济全球化的背景下专注于中西文化融合的休闲餐饮服务，自2002年在上海青浦创设首家门店以来，迪欧始终秉承优雅欧亚气息和“诚信、尊重、关怀”的核心价值观，成为咖啡行业的品质典范并得到广泛的认同和赞誉。目前，迪欧集团旗下项目包括“迪欧咖啡”、“米萝咖啡”、“上岛咖啡（拥有6省份的特许经营权）”三个连锁品牌经营及管理、迪欧食品加工等，全国门店总数800余家，遍布中国二十多个省份、自治区和直辖市中的百余城市，拥有强大加盟商团队的支持，五大分公司布局南北、互相策应，成为中国复合式休闲餐饮咖啡类的领先者。2010年楼高16层的自有物业新总部大楼投入使用，2011年迪欧滤挂咖啡全面上市，填补了国内滤挂咖啡市场品牌的空白，为迪欧集团的事业发展揭开了新的篇章。迪欧品牌得以成功的关键，在于其对产品品质与服务品质的孜孜以求和不断打造完美的优雅环境与充满人文气息的欧亚咖啡文化氛围。全国万余名迪欧人，奉行迪欧以客户满意为宗旨的服务准则，为客户营造欧亚咖啡文化氛围，打造一座又一座“爱的咖啡馆”。企业文化：1、“迪欧”品牌释义 “迪欧DIO”原引世界语“神的博爱”之寓意，又可作为英语“DEAR”的谐音，表达有“亲爱的”含义，传递着迪欧如咖啡般的浓浓情谊。同时它与迪欧“诚信、尊重、关怀”的核心价值观相契合，期望人们在这“爱的咖啡馆”，累积生命，畅想生活！ 2、核心价值观 诚信诚信的本义就是要诚实、诚恳、守信、有信。我们秉持一颗真诚的心，服务每一位迪欧的顾客、服务我们的加盟业主以及我们的同事。 尊重我们要养成换位思考的习惯，时常换角度为他人着想，尊重他人人格尊严和劳动成果，欣赏他人的优点、宽容他人的不足，协助他人进步。 关怀关怀源于理解、宽容，关怀是用心去感受他人的内心，关怀是用行动去支持别人的行动，关怀是用态度去感化他人，用爱去滋润他人的心灵，关怀是在他人的需要上看到自己的责任。 3、迪欧三大理念 永续经营可以更好的传承迪欧爱的文化，永续经营可以让我们更好的回馈社会。 终身学习不断提升自己的品行、业绩与能力，不断领会新理念、掌握新方法，使自己成为一个与时俱进、紧跟时代潮流与企业变革步伐的人。 服务为本“服务”是迪欧品牌的核心竞争力，服务贯穿于迪欧人的全部工作与生活。服务是利润的源泉，而利润是企业永续经营的基石。 4、四大精神 积极、主动积极主动就要“先顾客之想而想，先顾客之急而急”，现在能做的事情，马上去做，不要“等一下”；今天能做完的事，不要等明天才做。 责任心、敬业责任心体现在工作热情上，体现在工作态度上，体现在工作作风上，体现在工作质量上。敬业就是用一种严肃的态度对待自己的工作，勤勤恳恳、兢兢业业，忠于职守，尽职尽责。 专业、技能传承专业是指岗位、业务上的钻研与精通。技能传承是指技能与经验的分享，不吝啬自身的成功经验，在自己成功的同时，乐于与他人进行分享，乐于帮助他人获得成功。 团队精神、执行力团队精神是大局意识、协作精神和服务精神的集中体现。团队精神体现在团队执行力上，团队的效能在执行，没有执行，就不可能有效能。5、迪欧服务理念 与众不同的并不是超凡的工作，而是做得非常出色的普通工作，令我们的服务变得与众不同。剩余页面：主要具体的介绍了那些产品及一链接的细节五、设计成果展示页面说明：这是网站的主页面，通过表格布局顶部为始终背景图表顶格并居中。最上方是网站的LOGO，下面网站的导航栏，再下面左边部分是一段迪欧咖啡的宣传篇，左边是公司最近新闻的链接，下面左是最近的一些活动，右边部分则是迪欧的最新产品以最下面及网站的版权所有。源代码如下：<!DOCTYPE html PUBLIC "-/W3C/DTD XHTML 1.0 Transitional/EN" "http:/www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http:/www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>首页</title><style type="text/css"><!-body,td,th color: #FF3;font-family: 宋体;font-size: 18px;font-weight: bold;border-top-color: #F93;border-right-color: #F93;border-bottom-color: #F93;border-left-color: #F93;.zcolor:#6FC;font-family: 宋体;font-size: 12px;font-weight: bold;.z p font-size: 16px;color: #6FF;text-align: center;.z table tr td color: #9CF;font-weight: normal;#boxtext-align:center; width:1091px; margin:0 auto;#wpadding-left:280px;line-height:40px;.， line-height:30px;color: #9CF;table tr td p font-weight: normal;text-align: center;table tr .z font-weight: normal;color: #9FF;.z color: #CCF;p .， color: #9fF;#w ul li color: #9CF;#box div table tr border-top-color: #F93;border-right-color: #F93;border-bottom-color: #F93;border-left-color: #F93;a:link color: #FF9;a:visited color: #FF9;a:hover color: #FCC;font-size: 18px;#box table tr td #z table tr td color: #FF0;#box table tr td #z table color: #FF0;-></style><script src="Scripts/swfobject_modified.js" type="text/javascript"></script></head><body background="图片/9.jpg" width="1280" height="1024" ><bgsound src="图片华林咖啡厅场景背景音乐 雪的梦幻.mp3" loop="-1" ><div id="box"><div align="left"> <table width="1091" height="157" border="1"> <tr> <td width="172" height="151"><img src="图片/u=2757964576,950431369&fm=52&gp=01.jpg" width="166" height="147" /></td> <td width="909"><img src="图片/909_副本.jpg" width="902" height="146" /></td> </tr> </table></div><div align="right"> <tr> <td width="675"><div align="center"> <div align="right"><table width="663" height="28" border="0"> <tr></tr> <tr> <td width="99" height="28" style="font-size: 18px"><div align="center"><strong><a href="-2.html">网站首页</a></strong></div></td> <td width="99" style="font-size: 18px"><div align="center"><strong><a href="公司简介1.html">关于迪欧</a></strong></div></td> <td width="99" style="font-size: 18px"><div align="center"><strong><a href="企业文化.html">企业文化</a></strong></div></td> <td width="99" style="font-size: 18px"><div align="center"><strong><a href="产品服务.html">产品服务</a></strong></div></td> <td width="99" style="font-size: 18px"><a href="顾客中心.html">顾客中心</a></td> <td width="99" style="font-size: 18px"><div align="center"><a href="人才频道.html">人才频道</a><br /> </div></td> <td width="99" style="font-size: 18px"><div align="center"><a href="迪欧大事记.html">那些故事</a><br /> </div></td> <td width="99" style="font-size: 18px"><div align="center"><strong><a href="加盟我们.html">加盟我们</a></strong><br /> </div></td> </tr> </table> </div> </div></td> </tr> </table></div><table width="1083" height="929" border="1"> <tr> <td colspan="2"><img src="图片/本.gif" width="1080" height="179" /></td> </tr> <tr> <td width="549" height="291"><center> <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="448" height="328" id="FLVPlayer"> <param name="movie" value="FLVPlayer_Progressive.swf" /> <param name="quality" value="high" /> <param name="wmode" value="opaque" /> <param name="scale" value="noscale" /> <param name="salign" value="lt" /> <param name="FlashVars" value="&MM_ComponentVersion=1&skinName=Clear_Skin_1&streamName=%E5%9B%BE%E7%89%87/%E8%BF%AA%E6%AC%A7%E5%92%96%E5%95%A12004%E5%B9%B4%E5%AE%A3%E4%BC%A0%E7%89%87&autoPlay=false&autoRewind=false" /> <param name="swfversion" value="8,0,0,0" /> <!- 此 param 标签提示使用 Flash Player 6.0 r65 和更高版本的用户下载最新版本的 Flash Player。如果您不想让用户看到该提示，请将其删除。 -> <param name="expressinstall" value="Scripts/expressInstall.swf" /> <!- 下一个对象标签用于非 IE 浏览器。所以使用 IECC 将其从 IE 隐藏。 -> <!-if !IE>-> <object type="application/x-shockwave-flash" data="FLVPlayer_Progressive.swf" width="448" height="328"> <!-<!endif-> <param name="quality" value="high" /> <param name="wmode" value="opaque" /> <param name="scale" value="noscale" /> <param name="salign" value="lt" /> <param name="FlashVars" value="&MM_ComponentVersion=1&skinName=Clear_Skin_1&streamName=%E5%9B%BE%E7%89%87/%E8%BF%AA%E6%AC%A7%E5%92%96%E5%95%A12004%E5%B9%B4%E5%AE%A3%E4%BC%A0%E7%89%87&autoPlay=false&autoRewind=false" /> <param name="swfversion" value="8,0,0,0" /> <param name="expressinstall" value="Scripts/expressInstall.swf" /> <!- 浏览器将以下替代内容显示给使用 Flash Player 6.0 和更低版本的用户。 -> <div> <h4>此页面上的内容需要较新版本的 Adobe Flash Player。</h4> <p><a href=" src=" alt="获取 页面说明：这是网站的子页面，介绍了迪欧咖啡。页面说明：网站的子页面，介绍了迪欧咖啡一些的产品。页面说明：网站的子页面，介绍人才频道中的储干工程课设总结通过此次课程设计，使我更加扎实的掌握了有关WEB方面的知识，在设计过程中虽然遇到了一些问题，但经过一次又一次的思考，一遍又一遍的检查终于找出了原因所在，也暴露出了前期我在这方面的知识欠缺和经验不足。实践出真知，通过亲自动手制作，使我们掌握的知识不再是纸上谈兵。我学习了网页制作和网站建设，我可以自己运用网络资源，结合相关资料及老师的指导，通过自身的实践创作出积聚个人风格、个性的个人网页。总体来说，整个学期的学习过程中，我学会了很多知识，虽然过程比较艰辛，但是有了一个展示自我的空间，我觉得很开心、很有成就感。课程设计诚然是一门专业课，给我很多专业知识以及专业技能上的提升，同时又是一门讲道课，一门辩思课，给了我许多道，给了我很多思，给了我莫大的空间。同时，设计让我感触很深。使我对抽象的理论有了具体的认识。作为网页设计的初学者，我对网页设计非常感兴趣，想设计出一个美观、实用、内容 丰富的个人网页。我通过自己动手、动脑，通过网络资源和老师的指导，在不断发现问题和 解决问题的过程中学到了很多知识，增强了我的创作能力和动手能力，在网页设计过程中， 从构思到设计、完善、维护，整个过程我都全身心投入，使我真正学到了网页设计的知识。 在本次网页设计中，我不仅学到了很多关于网页设计方面的知识，也从中学会了关于 使用网页制作软件方面的知识。此次设计也让我明白了思路即出路，有什么不懂不明白的地方要及时请教或上网查询，只要认真钻研，动脑思考，动手实践，就没有弄不懂的知识，收获颇丰。江西理工大学应用科学学院经管系WEB开发技术课程设计（论文）指导教师评分表姓名： 班级： 学号： 课程设计论文题目：_评分内容比例滿 分 标 准得 分1、课程设计态度30%（1） 整个毕设过程态度端正（2） 严格执行请假制度，无随意缺席现象（3） 按要求独立完成全部工作2、设计内容40%（1） 设计符合基本要求（2） 设计内容有所创新（3） 源代码可读性强（4） 网站结构合理有序3、论文质量20%（1） 论文字数及内容等均符合规定要求（2） 论文逻辑严密，层次清楚，结构严谨（3） 撰写过程态度认真4、答辩情况10%（1） 对整个设计成果的全局把握（2） 回答问题能力（3） 对课程知识点的掌握总 评 指导老师签名： 年 月 日
