文档介绍：毕业设计
题目步步高网站前台设计与实现
完成日期 2011 年 11 月 16 日
目录
前言 3
1 网站需求分析 4
网站定位 4
网站前台建设要求 4
4
4
5
5
2 首页设计说明 5
首页整体效果 5
首页结构 6
设计效果与技术介绍 8
问题与解决方案 9
3 子页设计说明 9
子页整体效果 9
子页结构 9
设计效果与技术介绍 11
问题与解决方案 12
最终效果图 12
首页的效果() 12
企业介绍页的效果() 13
() 14
教育电子页的效果() 15
企业新闻页的效果() 16
服务中心页的效果() 17
人才招聘页的效果() 18
4 兼容方案 18
5 维护设计 20
6 总结 21
致谢 22
参考文献 22
步步高网站前台设计与实现
学生:乔生巍
指导教师:刘晓知
(黄冈职业技术学院)
摘要:本文为步步高企业网站前台的设计说明,针对步步高网,介绍了制作此网站的流程以及相关技术,包括需求分析、主题确定、功能设计、布局设计、配色方案还有特效设计等。此设计运用了当前流行的网站前台设计技术,对制作符合web标准的网站进行了深入研究。
关键词:网站;前台设计;步步高网
前言
企业网站建设方案是将企业网站建设成为一个优质网站首先要考虑,网站建设方案能反应出网站的建设构想,初步形态及网站推广计划。企业网站建设方案适合中小型企业,它有自己独特的风格设计。风格设计主要体现在企业个性特点的凸显,结合企业经营行业市场分析,了解客户群体活动****性以及活动规律,。设计首页要求列出最吸引客户的产品信息以及服务信息,用最精炼的语言表达出客户想了解的信息,一般网站首页由企业简介,企业新闻,企业资质,产品展示,在线留言,联系方式等。
其企业网站的主要建站目的:
1. 企业网站建设方案的策划主要目的在于,能够通过网站首页,公司简介,产品服务信息,让客户清楚了解公司产品以及服务信息情况。
2. 网站栏目清晰明了,网站本身就是服务企业,为企业带来宣传。栏目之间的设定都是在服务于如何让网站更吸引客户,更能抓住客户心理,方便用户浏览网站而设定制作。
3. 策划方案还可以反应出网站框架设计是否合理,预计能够达到什么效果,以及后期网站推广工作安排。
本设计用了css+div,javascript。有这些亮点,使页面载入的更快、降低流量费用、修改设计时更有效率、保持视觉一致性、更好的被搜索引擎收录、对浏览者和浏览器更具亲和力。
1 网站需求分析
网站定位
本网站为企业机构类的网站。
网站前台建设要求
主页:首页是客户打开网站的第一个页面,要以flash的方式展示企业文化和所生产的特色产品展示。需要企业新闻的简单介绍,都要在第一时间呈现给用户,且需要充分展现网站的亮点,以吸引用户
企业介绍模块:充分展示了企业的企业文化、公司简介、以及公司的联系方式,宣传企业形象,实现了互动的效果。
产品展示模块:此模块分为两个页面,分别展示步步高公司的通信产品和教育电子产品,以图片的方式呈现给用户,吸引用户对更深的了解各个类型的产品
企业新闻模块:本模块主要展示企业的新闻动态,产品的新闻动态,以及媒体的对于企业的相关报道,使用户掌握最新的企业、产品等的新闻动态。
服务中心模块:此页主要实现与用户的互动。展示服务热线,让用户对一些一问进行通话的方式进行咨询和了解,以及对于一些产品出现的问题进行网上投诉。还能进行产品知识的学****更好的掌握产品的一些具体功能实现。
人才招聘模块:人才招聘对于企业和有志青年实现双赢,发布一些招聘信息及联系方式,招聘信息一幕了然,为有志青年提供良好平台。
整个页面布局运用分栏的方式呈现,采用绝对定位和浮动定位。绝对定位的优势在于,我们可以丝毫不差地精确控制任何元素的位置—这里面没有什么需要猜测或者运气的成分。由于应用了绝对定位的元素被不留痕迹地从常规文档流中完全移除,所以它也不会为其他元素带来任何的影响。浮动的本意是要将插入到文章中的图片向左或者向右浮动,使图片下方的文字自动环绕在它的