码迷,mamicode.com
首页 > Web开发 > 详细

6.1 网站的开发流程介绍

时间:2014-06-20 16:07:57      阅读:289      评论:0      收藏:0      [点我收藏+]

标签:style   class   blog   http   ext   com   

在上一章中,主要介绍了使用Dreamweaver通过可视化操作来实现网页中的各种元素,既学习了如何使用Dreamweaver在网页中设置页面标题、背景和插入各种对象,又学习了使用Dreamweaver来创建表格布局和实现表单页面,还研究了框架相关知识。另外,为了制作出赏心悦目的网页,我们还学习了在Dreamweaver中如何快速地创建和应用样式表。

从本章开始,我们将学习网站设计和布局技术,其中重点是熟悉网站的开发流程,DIV层和表格布局各自的使用场合,以及网站开发的一些经验、技巧;难点是如何进行网页布局。

创建一个商业网站,要做好商业网站开发的前期准备、中期制作和后期的测试发布工作。前期准备包括了解网站的业务背景、明确网站的设计风格、确定网站内容等;中期制作主要包括创建站点、制作首页、制作模板和制作样式;后期的测试发布工作包括检查页面效果是否美观、链接是否完好、不同浏览器的兼容性以及如何发布网站。本章和下一章将结合淘宝网案例逐一介绍这些内容。

一、需求分析

需求分析就是分析客户的需求是什么。如果投入大量的人力、物力、财力,开发出的网站却没人要,那所有的投入都是徒劳,因此,网站前期的需求分析是相当重要的。

需求分析之所以重要,就因为它具有目的性、方向性、决策性,它在网站开发的过程中具有举足轻重的地位,大家一定要对需求分析具有足够的重视。在一个大型商业网站的开发中,它的作用要远远大于直接设计或编码。简言之,需求分析的任务就是解决“做什么”的问题,就是要全面地理解客户的各项要求,并且能够准确、清晰地表达给参与项目开发的所有成员,保证开发过程按照客户的需求去做,而不是为技术而迁就需求。

 1.客户需求

(1) 业务背景

做任何事情之前,要明确的是为什么要做这件事情,网站建设也不例外,要分析、理解、颁会客户的需求,这就要求网站开发项目经理对网站的业务背景有较好的理解和把握。不

同的业务背景有不同的需求,不同的需求导致做出来的网站千差万别。不过,根据网站的主题、题材、客户需求和客户企业的业务背景,可以把网站大致上分为不同的类别。下面就是美国《个人电脑》杂志(PC Magazine)把网站分为以下10类。

● 网上求职类。

● 网上聊天/即时信息/ICQ类。

● 网上社区/讨论/邮件列表类。

● 信息技术类。

● 网页/网站开发类。

● 娱乐类。

● 旅行类。

● 参考/资讯类。

● 家庭/教育类。

● 生活/时尚类。

这些分类仅供我们参考,但同时也提醒我们,建设网站不要建设“面面俱到”型的,可能导致“面面不到”,而是要建设专业性强的、主题鲜明的网站。

每个大类都可以继续细分,比如娱乐类再分为体育/电影/音乐等小类,体育小类又可以按运动形式分为足球、篮球、排球、乒乓球等。同时,各个题材相联系和交叉结合可以产生新的题材,例如足球加讨论就是足球论坛、旅游加社区就是旅游社区等。这么多种类,如何选择?可以遵循如下原则,第一、主题要小而精炼;第二、题材最好是自己熟悉的;第三、题材不要太滥。

下面我们就以淘宝网案例为例来分析商务网站的业务背景。

从大的方面讲:中国现在上网的人越来越多,还有广大人民的消费水平越来越高、消费能力越来越强;此外,网上交易是一种发展趋势,并且在欧美一些国家得到成功的应用。从小的方面说:如果阿里巴巴公司原来主要是通过店面、邮购等方式销售产品或服务,或者公司有很多本地之外的潜在客户可以挖掘,出于这方面的业务背景,建立在线商务网站是非常合适的,因此,阿里巴巴就着手创建了淘宝网,这不仅降低了运营成本,而且为顾客带来了实惠和便利,还能增加销售量、吸引更多的潜在客户。在线商务网站为广大客尸提供在线商品展示、在线商品购买、交互服务和管理的平台,借助电子商务软件,客户便可以不受时间、空间的限制使用银行卡在线订货和购买。从商业模式上看,“在线商务网站”不同于“网上商城”的概念,后者是为商家出租或免费提供“网络空间”的形式。从营销模式上看,网站是一种有力的营销媒介。网站的建设是一个不断修改、不断完善、循序渐进的过程,如果您想从网络中受益,那就赶快行动吧!

当初创建淘宝网的目标是建立全球最大最活跃的网上贸易市场,让天下没有难做的生意,而且淘宝网是一个目前比较火爆的网上在线商务网站,如图1所示,可以看出淘宝网具有在线商务网站的典型优点。第一、体现了在线销售的方便性;第二、体现了在线服务的及时性。总之,方便、及时是在线购物网站的主要特点。

bubuko.com,布布扣
图1 淘宝网主页

(2) 设计风格

在掌握了网站的业务背景之后,就可以明确网站的设计风格。

网站的风格是指站点给人留下的整体印象。这个“整体印象”包括站点的标志、色彩、字体、标语和版面布局、浏览方式、交互性、文字、语气、内容价值、存在意义、站点荣誉等诸多因素。如:搜狐网站看上去就是平易近人的,迪斯尼则是生动活泼的,IBM是专业严肃的,这些都是网站给人们留下的不同感受。

风格是独特的,是站点不同于其他网站的地方。或者色彩,或者技术,或者交互方式都能让浏览者分辨出网站的独有特色。例如黑客网站、游戏网站一般都是黑色调,这种黑
色调能反映出此类网站的神秘和诱人之处。

通过网站的外表、内容、文字、交流可以概括出一个站点的个性、情绪。是温文儒雅还是执著热情?是活泼易变还是放任不羁的?是“豪放派”还是“婉约派”?要树立好的
网站风格,请参照以下几个方面:

● 合理的网页布局。

● 让网站logo尽可能地出现在每个页面的页眉中。

● 将文字、链接、图片、背景、边框等尽量与主色调一致。

● 突出字体特色。在关键的标题、菜单、图片里使用统一的字体和颜色。

● 使用特效,让网页看起来生动活泼。

● 网站主题鲜明、整体实用性强、内容切合度好等。

像淘宝网具有主题鲜明,色彩亮丽、简洁明快、时尚生活的设计风格。

(3) 网站内容

一个网站应该具备什么样的功能,采取什么样的表现形式,并没有一个统一的模式。不同形式的网站其内容也千差万别。因此,网站中的内容应该根据客户的需求,企业的业
务背景确定。对于网站的表现形式,应根据网站的设计风格来确定。下面我们就以淘宝网为例,来简单地介绍一下淘宝网的主要内容,其主要内容如下:公司简介、商品分
类、商品展示、价格信息、商品搜索、网上订单、会员注册、客户服务等。

2.确认需求

经过细致的需求捕获活动之后,我们就可以开始着手制作网站,不过,不要急!我们在真正制作网站之前,最好让美工或UI(User Interface,用户界面)设计人员将需求捕获活动的结果加以适当的分析,然后设计一个用户可以直接感知的静态的网站样板,也就是要做网站的静态图片版。方便客户与开发人员就网站系统的业务背景、设计风格、网站内容达成共识,并建立需求变更制度与流程,方便后期的制作与完善。

二、网站制作

经过需求分析阶段之后,我们就可以正式制作网站。网站的制作主要包括创建站点、制作首页、制作模板和制作样式。创建站点能很好地管理我们的网页文件和文件夹,所以在网站制作阶段创建站点是我们首先要考虑的问题。首页是一个网站的门面,是一个网站的灵魂,因此,首页制作的好坏是一个网站成功的关键所在。制作模板便于设计出具有统一风格的网站,并且模板的运用能为网站的更新和维护带来极大的方便,为开发出优秀的网站奠定了基础。样式表是一个很神奇的东西,它能把网页制作得更加绚丽多彩,使网页呈现不同的外观。当网站有多个页面时,修改页面链接的样式表文件即可同时修改多个页面的外观,从而大大地提高工作效率,减少工作量。

三、测试网页

测试网页主要从3个方面着手,第一、页面的效果是否美观;第二、页面中的链接是否完好;第三、是最重要的也是最烦的一点,就是要兼容不同的浏览器(如Intemet Explorer、Mozilla Firefox等)。对于网页是否美观,仁者见仁,智者见智,那怎么办呢?不过有章可循,可以从页面整体视觉效果、美工设计、页面布局、内容实力、亲和力等方面进行检查。对于链接是否完好,可以使用Dreamweaver里的“检查链接”命令来检查,详细的检查步骤请参照第7章。对于兼容不同浏览器,也可以使用Dreamweaver来检查,在网页学习网本系列教程下一章将详细介绍。

四、发布网站

网站设计好了,经测试之后,就可以放在服务器上发布,这样,能让更多的人知道您的网站。

发布网站有两种方式,一种是本地发布,即通过本地计算机来完成,在Windows操作系统中,一般通过IIS来构建本地Web发布平台,这种发布方式只能让局域网中的用户访问您的站点;另一种是远程发布,即登录到Internet上,然后利用有些Internet服务商提供的个人网络空间来真实地发布自己所建的网站,不过,这种发布方式要先申请一个域名和虚拟主机,申请成功后Internet服务商就会给您一个IP地址、用户名和密码,使用此IP地址、用户名和密码就可以把您的网站上传到Intemet上,只有这样,才能让Intemet上的用户访问您的站点。可以根据自己的需要来选择不同的发布环境。

点击下载第六章案例及作业资源 返回《HTML入门经典》教程列表

编辑:网页学习网
本文地址:http://www.lodidance.com/html/jc/537.html

6.1 网站的开发流程介绍,布布扣,bubuko.com

6.1 网站的开发流程介绍

标签:style   class   blog   http   ext   com   

原文地址:http://www.cnblogs.com/you-me/p/3796630.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!