web-第2章网站规划基础

1、第二章第二章 网站规划设计基础网站规划设计基础网站规划目的网站规划目的网站规划网站规划是指在网站建设前对市场进行分析、确定网站的是指在网站建设前对市场进行分析、确定网站的目的和功能，并根据需要对网站建设中的技术、内容、费目的和功能，并根据需要对网站建设中的技术、内容、费用、测试、维护等做出规划。网站规划对网站建设起到计用、测试、维护等做出规划。网站规划对网站建设起到计划和指导的作用，对网站的内容和维护起到定位作用。划和指导的作用，对网站的内容和维护起到定位作用。 1. 网站设计流程网站设计流程2. Web站点的分类及运行目的站点的分类及运行目的3. 定位网站的主题和名称定位网站的主题和名称4.

2、 确定网站确定网站CI形象形象5. 确定网站的栏目和版块确定网站的栏目和版块6. 确定网站的整体风格确定网站的整体风格7. 确定网站的目录结构和链接结构确定网站的目录结构和链接结构8. 网站内容的确定网站内容的确定9. 网页的设计网页的设计10. 申请域名注册申请域名注册11. 申请网站空间申请网站空间一、网站设计流程一、网站设计流程 1. 编写网站设计的计划书；编写网站设计的计划书；2. 确定网站设计总体思想；确定网站设计总体思想；3. 确定网站提供的内容；确定网站提供的内容； 4. 网站交互设计，如信息反馈、意见调查等；网站交互设计，如信息反馈、意见调查等；5. 对网站的内容进行分类；对网

3、站的内容进行分类；6. 设计网页必有的内容，如公司标志、联系方法和导航条等设计网页必有的内容，如公司标志、联系方法和导航条等7. 讨论并确定方案；讨论并确定方案；8. 制作网页的模板；制作网页的模板；9. 制作网页并在不同平台的浏览器上测试网页；制作网页并在不同平台的浏览器上测试网页；10. 检查网页的链接；检查网页的链接；11. 让部分顾客或员工试用网站，并提出反馈意见；让部分顾客或员工试用网站，并提出反馈意见；12. 根据需要修改不合适的地方；根据需要修改不合适的地方；13. 正式发布网站。正式发布网站。 二、网站的分类及运行目的二、网站的分类及运行目的1. 门户网站门户网站是指通向某类综

4、合性互联网信息资源并提供有关信息服务的是指通向某类综合性互联网信息资源并提供有关信息服务的应用系统。应用系统。比较知名的中文门户网站有三类：比较知名的中文门户网站有三类：像新浪、搜狐、网易这样完全由国内网络公司经营的网站。像新浪、搜狐、网易这样完全由国内网络公司经营的网站。境外投资的网站，如中文雅虎、美国在线等。境外投资的网站，如中文雅虎、美国在线等。国内传统媒体办得网站，以人民网、新华网为代表。国内传统媒体办得网站，以人民网、新华网为代表。2. 政府网站政府网站由各级政府的各个部门主办，就政府各个职能部门或某一方由各级政府的各个部门主办，就政府各个职能部门或某一方面的情况或信息向公众介绍、宣

5、传、作出说明。现在的政府面的情况或信息向公众介绍、宣传、作出说明。现在的政府网站还向电子政务方向发展，许多以前通过窗口排队的行政网站还向电子政务方向发展，许多以前通过窗口排队的行政办事手续已逐渐提升成可通过网络提交的方式来解决，网上办事手续已逐渐提升成可通过网络提交的方式来解决，网上的政府信息具有专业性、实时性、权威性等特点。的政府信息具有专业性、实时性、权威性等特点。3. 学校和科研机构网站学校和科研机构网站提供一定的技术咨询服务和学术资源共享。这种网站不以营提供一定的技术咨询服务和学术资源共享。这种网站不以营利为目的，往往是其内部局域网的外延，提供图书馆信息、利为目的，往往是其内部局域网的

6、外延，提供图书馆信息、最新学术动态、科研技术探讨等以便资源共享，如中国教育最新学术动态、科研技术探讨等以便资源共享，如中国教育和科研计算机网（和科研计算机网（http:/），通过它可以访问我），通过它可以访问我国各个高校的主页和图书馆。国各个高校的主页和图书馆。4. 电子商务类网站电子商务类网站此类网站分为此类网站分为B2B（商家对商家）、（商家对商家）、B2C（商家对个人客户）（商家对个人客户）和和C2C（个人对个人）三种，按照交易过程可分为商品检索、（个人对个人）三种，按照交易过程可分为商品检索、商品采购、订单支付三个阶段。商品采购、订单支付三个阶段。此类网站应该具有如下功能：此类网站应该

7、具有如下功能：商品发布功能；商品发布功能；商品选购功能；商品选购功能；具有个性化的采购订单模板，顾客可以进行购物组合比较；具有个性化的采购订单模板，顾客可以进行购物组合比较；“购物车购物车”内置的价格计算模型可以根据商家的价格体系灵内置的价格计算模型可以根据商家的价格体系灵活定制；活定制；在线交易功能；在线交易功能；商品交接、资金结算功能。商品交接、资金结算功能。5. 企业网站企业网站对于企业来说企业网站可以在全世界范围内宣传展示自己的对于企业来说企业网站可以在全世界范围内宣传展示自己的公司，发布本公司时效性强的商业信息；对企业增加业务量、公司，发布本公司时效性强的商业信息；对企业增加业务量、

8、开拓市场均有帮助。开拓市场均有帮助。比如比如IBM、微软，英特尔等，这些公司网站不但给公司和企、微软，英特尔等，这些公司网站不但给公司和企业而且给广大客户带来了便利，在这些公司的站点可以查询业而且给广大客户带来了便利，在这些公司的站点可以查询到该公司最近一段时间的产品发布情况、技术文档和相关的到该公司最近一段时间的产品发布情况、技术文档和相关的软件包等。经销商还可以通过这些站点获悉订货情况、价格软件包等。经销商还可以通过这些站点获悉订货情况、价格信息等。信息等。6. 论坛型网站论坛型网站通常称为通常称为BBS系统，是网站的用户之间以及网站的经营者和系统，是网站的用户之间以及网站的经营者和用户之

9、间进行交流的系统。论坛型网站一般都按不同的主题用户之间进行交流的系统。论坛型网站一般都按不同的主题分为许多版块，版面的设立依据是大多数用户的要求和喜好，分为许多版块，版面的设立依据是大多数用户的要求和喜好，用户可以阅读别人关于某个主题的看法，也可以将自己的想用户可以阅读别人关于某个主题的看法，也可以将自己的想法毫无保留的发布到论坛上。法毫无保留的发布到论坛上。7. 展示宣传型网站展示宣传型网站以内容展示为重点，用内容吸引人，如文学网站、下载网站、以内容展示为重点，用内容吸引人，如文学网站、下载网站、行业信息网站、个人网站等。一般通过提供免费服务和免费行业信息网站、个人网站等。一般通过提供免费服

10、务和免费资源来吸引用户增加访问量，用户可以通过这类网站在网上资源来吸引用户增加访问量，用户可以通过这类网站在网上获取许多免费的资料，如电子报刊、获取许多免费的资料，如电子报刊、Mp3音乐、免费软件等。音乐、免费软件等。三、定位网站的主题和名称三、定位网站的主题和名称1. 网站主题的确定网站主题的确定建设一个网站首先要确定网站所属类别下的主题。主题是建设一个网站首先要确定网站所属类别下的主题。主题是Web站点的灵魂，一个好的站点的灵魂，一个好的Web站点首先需要好主题。站点首先需要好主题。在选择网站主题的时候要注意以下在选择网站主题的时候要注意以下3点：点：主题小而内容精，创新的内容很重要；主题

11、小而内容精，创新的内容很重要；题材最好是自己擅长的内容；题材最好是自己擅长的内容；题材不要太滥，目标不要过高。题材不要太滥，目标不要过高。2. 网站名称的确定网站名称的确定在选择网站名称的时候要注意以下在选择网站名称的时候要注意以下3点：点：名称要端正；名称要端正；名称要易记；名称要易记；名称要有特色。名称要有特色。一旦确定站点主题一旦确定站点主题,就应该围绕主题给就应该围绕主题给Web站点起一个名字站点起一个名字即即Web站点名称。网站名称对站点名称。网站名称对Web站点的形象和宣传推广站点的形象和宣传推广有很大影响。有很大影响。四、确定网站四、确定网站CI形象形象所谓所谓CI（Corpor

12、ate Identity，企业形象），企业形象），是指通过强化视，是指通过强化视觉效果的手段来加深用户对企业形象的印象。觉效果的手段来加深用户对企业形象的印象。1. 设计网站的标志（设计网站的标志（Logo）站点标志作用类似于商标，它是网站特色和内涵的集中站点标志作用类似于商标，它是网站特色和内涵的集中体现。体现。最常用和最简单的方式是用自己网站的名称作为标志，最常用和最简单的方式是用自己网站的名称作为标志，采用不同的字体、字母的变形或组合可以很容易制作好采用不同的字体、字母的变形或组合可以很容易制作好自己的标志。自己的标志。2. 设计网站的标准色彩设计网站的标准色彩“标准色彩标准色彩”是指能

13、体现网站形象和延伸内涵的色彩。例是指能体现网站形象和延伸内涵的色彩。例如，如，IBM的深蓝色，的深蓝色，KFC的红色条纹，都使浏览者觉得很的红色条纹，都使浏览者觉得很贴切，很和谐。贴切，很和谐。一般来说，一个网站的标准色彩不宜超过一般来说，一个网站的标准色彩不宜超过3种，标准色彩要种，标准色彩要用于网站的用于网站的Logo、标题、主菜单和主色块，给人整体统一、标题、主菜单和主色块，给人整体统一的感觉。的感觉。在配色的时候要把握以下原则：在配色的时候要把握以下原则：网站要有一个主色调；网站要有一个主色调；要深浅搭配；要深浅搭配；保持整个网站颜色的统一性。保持整个网站颜色的统一性。3. 设计网站的

14、标准字体设计网站的标准字体标准字体是指用于标准字体是指用于Logo、标题和主菜单的特有字体。一般、标题和主菜单的特有字体。一般网页默认的字体是宋体。网页默认的字体是宋体。为了体现站点的特有风格，设计者可以根据需要选择一些为了体现站点的特有风格，设计者可以根据需要选择一些特别字体。特别字体。五、确定网站的栏目和板块五、确定网站的栏目和板块 1. 设计网站的栏目设计网站的栏目网站栏目的实质是一个网站的大纲索引，索引应该将网站的网站栏目的实质是一个网站的大纲索引，索引应该将网站的主体明确显示出来。主体明确显示出来。在选择网站栏目的时候要注意以下在选择网站栏目的时候要注意以下4点：点：紧扣网站主题；紧

15、扣网站主题；设计一个最近更新或网站指南栏目；设计一个最近更新或网站指南栏目；设计一个可以互动交流的栏目；设计一个可以互动交流的栏目；设计一个下载或常见问题回答栏目。设计一个下载或常见问题回答栏目。2. 设计网站的版块设计网站的版块版块比栏目的概念要大一些，版块比栏目的概念要大一些，每个版块都可以有自己的栏目每个版块都可以有自己的栏目。一般的个人站点内容较少，只要有主栏目就够了，不需要设一般的个人站点内容较少，只要有主栏目就够了，不需要设置版块。置版块。设置版块时，应该注意以下几点：设置版块时，应该注意以下几点：各版块要有相对独立性；各版块要有相对独立性；各版块要相互关联；各版块要相互关联；版块

16、的内容要围绕站点主题。版块的内容要围绕站点主题。六、确定网站的整体风格六、确定网站的整体风格风格是抽象的，是指站点的整体形象给浏览者的综合感受。风格是抽象的，是指站点的整体形象给浏览者的综合感受。例如，浏览者可能觉得网易是平易近人的，迪士尼是生动活例如，浏览者可能觉得网易是平易近人的，迪士尼是生动活泼的，泼的，IBM是专业严肃的。是专业严肃的。在设计网站风格时应注意以下在设计网站风格时应注意以下4点：点：风格是建立在有价值的内容之上的；风格是建立在有价值的内容之上的；将网站将网站logo尽可能地放在每个页面最突出的位置；尽可能地放在每个页面最突出的位置；使用统一的图片处理效果；使用统一的图片处

17、理效果；设计宣传标语。设计宣传标语。七、确定网站的目录结构和链接结构七、确定网站的目录结构和链接结构不要将网站内容全部放在一个目录中，按菜单栏目内容不要将网站内容全部放在一个目录中，按菜单栏目内容建立子目录。建立子目录。目录的层次不要太深，尽量用英文命名目录和文件名。目录的层次不要太深，尽量用英文命名目录和文件名。目录一般不超过目录一般不超过3层。目录路径过深，跳转的层。目录路径过深，跳转的URL地址就地址就会变长，会增加页面链接的复杂性。会变长，会增加页面链接的复杂性。1. 网站的目录结构网站的目录结构网站的链接结构是指页面之间相互链接的拓扑结构，网站的链接结构是指页面之间相互链接的拓扑结构

18、，它建立在目录结构基础之上它建立在目录结构基础之上,而且可以跨越目录。而且可以跨越目录。2. 网站的链接结构网站的链接结构Web站点的链接结构有三种基本方式：站点的链接结构有三种基本方式： 1）树状链接结构。）树状链接结构。 首链接指向一级页面，一级页面链接指向二级页面。首链接指向一级页面，一级页面链接指向二级页面。 用户可以一级级进入，一级级退出。用户可以一级级进入，一级级退出。2）星状链接结构。）星状链接结构。 结构中的每个页面相互之间都直接建立了链接。结构中的每个页面相互之间都直接建立了链接。3）混合结构。）混合结构。 首页和一级页面之间用星形链接结构，一级和二级、二首页和一级页面之间用

19、星形链接结构，一级和二级、二 级和三级页面之间均采用树形结构。级和三级页面之间均采用树形结构。八、网站内容的确定八、网站内容的确定站点结构图；站点结构图；导航栏；导航栏；精美的图片；精美的图片；引人入胜的内容；引人入胜的内容；反馈表；反馈表；联系方式页面；联系方式页面；搜索工具；搜索工具；常见问题解答。常见问题解答。确定网站的题材，并且收集和组织了许多相关的材料内容后，确定网站的题材，并且收集和组织了许多相关的材料内容后，按照以下方面组织内容来吸引浏览者。按照以下方面组织内容来吸引浏览者。 文本文本1. 网页的基本元素网页的基本元素 图片和动画图片和动画 声音和视频声音和视频 超链接超链接 导

20、航栏导航栏 表格表格 表单表单 其他常见元素其他常见元素九、网页的设计九、网页的设计符合人们的阅读习惯。符合人们的阅读习惯。网站导航要清晰。网站导航要清晰。网页风格要统一。网页风格要统一。动静要搭配好。动静要搭配好。突出新内容。突出新内容。2. 网站设计的原则网站设计的原则网站网站LOGO导航栏导航栏 广告广告 页面尺寸和显示器大小及分辨率有关系，网页的局限性就在页面尺寸和显示器大小及分辨率有关系，网页的局限性就在于设计者无法突破显示器的范围，而且浏览器本身的界面也于设计者无法突破显示器的范围，而且浏览器本身的界面也要占去不少空间，留下来用来设计页面的范围变得更小。要占去不少空间，留下来用来设

21、计页面的范围变得更小。分辨率越高，页面的尺寸就越大。分辨率越高，页面的尺寸就越大。在网页设计过程中，向下拖动是唯一给网页增加更多内容的在网页设计过程中，向下拖动是唯一给网页增加更多内容的方法。但最好不要让浏览者拖动页面超过三个屏幕。方法。但最好不要让浏览者拖动页面超过三个屏幕。（1）页面尺寸的概念）页面尺寸的概念3. 网页布局网页布局平衡原则：平衡原则：注意屏幕上下左右平衡，不要使数据过分拥挤，注意屏幕上下左右平衡，不要使数据过分拥挤，易产生视觉疲劳和接收错误。易产生视觉疲劳和接收错误。预期原则：预期原则：屏幕上的所有对象，如窗口、按钮、菜单等处屏幕上的所有对象，如窗口、按钮、菜单等处理应一致

22、化，使对象的动作可预期。理应一致化，使对象的动作可预期。经济原则：经济原则：在提供足够的信息量的同时还要注意简明、清在提供足够的信息量的同时还要注意简明、清晰。晰。顺序原则：顺序原则：对象显示的顺序应依需要排列。通常应最先出对象显示的顺序应依需要排列。通常应最先出现对话，然后通过对话将系统分段实现。现对话，然后通过对话将系统分段实现。规则化原则：规则化原则：画面应对称，显示命令、对话及提示行在设画面应对称，显示命令、对话及提示行在设计中尽量统一规范。计中尽量统一规范。（2）页面排版布局的原则）页面排版布局的原则 CSS布局布局 表格布局表格布局 框架布局框架布局（3）网页布局的常用技术）网页布

23、局的常用技术对于网站的色彩处理原则应该是对于网站的色彩处理原则应该是“总体协调，局部对比总体协调，局部对比”。4. 配色原则配色原则三原色：红、绿、蓝三原色：红、绿、蓝（1）色彩的形成）色彩的形成色调：表现色彩的种类；色调：表现色彩的种类；亮度：表现色彩的明亮程度；亮度：表现色彩的明亮程度；饱和度：表现色彩的鲜艳程度。饱和度：表现色彩的鲜艳程度。（2）色彩的特征）色彩的特征按照色彩对人们心理的影响可以进行以下分类。按照色彩对人们心理的影响可以进行以下分类。暖色系：红、橙、橙黄、黄等色彩让人感觉温馨、热情；暖色系：红、橙、橙黄、黄等色彩让人感觉温馨、热情；中性系：黄绿、绿等色彩让人觉得舒适、和谐；中性系：黄绿、绿等色彩让人觉得舒适、和谐；冷色系：青绿、蓝绿、蓝等色彩让人觉得宁静、高雅。冷色系：青绿、蓝绿、蓝等色彩让人觉得宁静、高雅。（3）色彩的分类）色彩的分类网站格调的确定，往往取决于色彩的选择与搭配是否适当。网站格调的确定，往往取决于色彩的选择与搭配是否适当。色彩的鲜明性色彩的鲜明性色彩的独特性色彩的独特性色彩的适合性色彩的适合性色彩的联想性色彩的联想性（4）色彩的选择和搭配）色彩的选择和搭配域名注册实际上就是申请网站的一个名称，以方便人们来访域名注册实际上