网站项目规划与设计 泾蜂园网站的设计与实现

一、项目背景（1）网站需求分析当今世界已进入信息时代，Internet成为21世纪最受关注的焦点之一,它的飞速发展和在全球范围的普及应用正在给人类生活带来革命性变化。网络技术的发展也取得了巨大的成就，为网站开发提供了很好的技术支持。网站已经成为现阶段众多企业不可或缺的网络营销平台，互联网应用规模正在不断扩大。其中，特别是中小型企业，对于网络平台搭建的需求相当的迫切。因此，企业网站的建立是一个企业在当今社会发展的必然趋势。

企业网站是一个企业不可缺少的部分，它能介绍企业文化、经营理念、特色服务及企业在全国的网点分布。拓宽顾客市场，增加企业与客户之间的联系，缩短二者之间的距离。提高企业知名度，为企业今后的业务发展开辟一个良好的社会环境。它的内容对于企业来说至关重要,企业概况、企业论谈、企业特色服务、最新企业新闻动态等部分应该能够为用户提供充足的信息。企业网站做成检索迅速、查找方便、可靠性高、存储量大、保密性好、寿命长、成本低、维护方便、信息实时性强的功能完善的大型企业网站。这些优点能够极大地提高了企业网站的效率,也是企业走向科学化、信息化与世界接轨的重要条件。在IT行业迅速发展的今天,企业网站的建设已经成为一个企业发展必不可少的存在。对于创意设计有限公司来说，必须建立一个以宣传为目的的网站类型。将于短期内强力打造公司的宣传力度，让更多的客户了解信任公司。网站的建设，也是公司对于宣传方面的长期投资。

社会上有很多保健品宣传网站，调查研究显示，保健品企业的知名度、企业的实力往往是和网站的制作水平成正比的。可见，保健品企业网站的建设十分重要，它的定位以及页面的风格设计直接影响着保健品企业在网络推广应用的成败。因此保健品企业建设公司网站可是必要的，它可以帮助企业实现在线产品宣传，为用户带来更多方便和快捷，大大提高了企业的服务效率，于无形中树立起了良好的企业形象。（2）网站的目的及功能定位目的及功能：泾县永春养蜂专业合作社，是一家集蜂产品采购、养蜂指导、蜂产品检测、产品包装一条线的蜂产品初级企业，企业硬件发展的同时更需要软件的同步。网络宣传是当今社会主流的宣传方式，利用网络可以让更多客户了解企业，也有利于企业走出国门乃至世界。目标人群：蜂蜜爱好者，几乎辐射各年龄阶层二、网站开发平台功能模块技术和软件平台操作系统Windows8设计稿、图形处理PhotoshopCS6动画设计制作FlashCS5网页制作平台Dreamweaver网站开发语言HTML,CSS,JavaScript网站测试平台Chrome，Firefox三、网站建设日程表完成整个项目所需时间为三个月，其中各项规划任务如下表所示：时间任务内容11月9日-16日拟定项目11月17日-23日制定初步项目计划12月6日-9日网站初步框架12月10日-12月12日网站内容具体丰富12月13日-12月15日总结反思，网站细节完善12月16日-20日计划微调，网站用户体验感测试12月21日-1月7日网站装饰再加工，CSS布局，JS语言1月8日-1月10日最终测试四、站点地图新闻详情公司新闻新闻详情公司新闻公司新闻公司新闻新闻详情公司动态新闻详情公司动态新闻详情新闻分类新闻详情新闻分类新闻详情行业资讯新闻详情行业资讯网站网站首页产品详情产品分类产品展示产品详情产品分类产品展示产品详情产品分类产品详情产品分类产品详情产品分类产品详情产品分类产品详情产品分类产品详情产品分类关于我们关于我们联系方式联系方式五、线框图网站主页结构布局如图5.1。子页导航栏LOGO子页导航栏LOGO首页banner栏首页banner栏新闻热点联系方式产品展示新闻热点联系方式产品展示版权信息相关链接版权信息相关链接图5.1首页结构图网站相关子页结构布局如图5.2。子页导航栏LOGO子页导航栏LOGO首页banner栏首页banner栏产品分类1产品分类2产品分类1产品分类2产品分类3产品分类相关子页详情页版权信息相关链接版权信息相关链接图5.2子页结构图子页分二级页面和三级页面，整体结构与图5.2一样六、设计规范（1）结构简洁又不失大气风范，整体结构采用了冠生园风格，但是BANNER页设计突出大气形象，整体和谐、美观。（2）开设富有特色的页面设计，许多企业网站多以文字介绍为主，但是我的设计还有一个图片展示子页，设计思路来源于淘宝，目的是让更多人了解产品。（3）突出产品特性，绿色主题，作为绿色食品的蜂蜜，建站的风格我没有弄得很庄重，而是以绿色logo和白色基调设计，体现出自然、朴实。字体：为了美化页面，提高视觉效果，使用纤细，清新的字体，且面包屑、主导航和页面上各个标题的字体都统一。目前使用的英文字体为yellowpeasdemo和SIMPLIFICATypeface。图像：首页背景还是突出简单、大气，主要考虑到蜂产品本身属于绿色食品，所以选用了简单的白色为背景。导航栏主要还是用了与背景类似的颜色。简洁、明了体现企业特色而logo图片则绿色、自然、环保。分辨率：所制作的网页将自动调整分辨率以适应显示器分辨率，不管在1024还是800的分辨率下都可以配合用户达到较佳的视觉效果。（4）布局设计①空间的合理利用：在网页的上端显示检索栏等信息，图片都先以小图标形式展现，鼠标挪动致图片位置将展现细节图，划过处可进一步放大，即节约了空间，同时营造出一种简洁现代的感觉。②动态效果：会在图片和一些特色小机关上赋予动态效果，如跳动，闪烁，放大缩小等。③其他附加效果：超链接下划线的显隐，目录的跳转，后期可能会加上音乐播放器功能。七、网页UI设计我们将坚持以用户体验为中心设计原则，界面直观、简洁，操作方便快捷，浏览者将对界面上对应的功能一目了然。保持页面内元素风格，版式一致。使用一致的标记、标准缩写和颜色，显示信息含义明确。显示有意义的出错信息，而不是单纯的程序错误代码。减持高效地使用显示器的显示空间，保持语言的一致性与可选择性。我们将遵循浏览者从上而下，自左向右浏览、操作习惯，尽量多做“减法”运算，将不常用的功能区块隐藏，以保持界面的简洁。在页面显眼位置应该出现面包屑导航栏，让用户知道当前所在页面的位置，并明确导航结构。并且为页面导航加以设计规划。八、主要页面的详细设计图图8.1首页最终效果图图8.2公司新闻页效果图图8.3新闻详情页效果图图8.4产品展示页效果图图8.5产品图片详情页效果图图8.6关于我们页效果图图8.7联系我们页效果图九、网站测试（1）测试准备测试前对被测系统做好以下准备：系统的全面备份，包括应用程序备份、数据备份等；记录测试前系统状态；制定应急措施，确保在测试中发生问题时系统可恢复。测试员应在测试开始前了解网页的相关情况，对测试的预期结果应进行准备和预测。测试前要做好真实数据的准备工作，并进行系统的数据初始化。（2）用户界面测试主要测试导航条、内容、颜色、背景、图像、返回等。（3）功能测试主要测试站点中的链接等。链接测试：目的是检查各个URL所联接的页面是否正确。表单测试：目的是检查每个表单与程序是否正确联接，能够正确地发送用户请求。（4）兼容性测试主要检验应用能否在不同的客户端使用。如苹果（iOS系统的）用户，经常使用chrome，Firefox等浏览器的用户是否都能正常使用。十、网站推广微信公众平台、朋友圈、微博、QQ空间推广（2）论坛推广我们可以注册几十个论坛，每个论坛注册若干个帐号，把签名设为自己的网站及团队图标。发表热门内容，自己顶