1、1选择题1下面哪一项不是栏目规划的任务?( )A确定必需的栏目和重点栏目B建立网站的层次型结构C详细设计每一个栏目，确定栏目之间的关系D设计每_个栏目内的导航2下面哪一种是正确的红色表示方法?( )A#FF0000 B&FF0000 C#FFFFFF D#0000FF3色彩搭配的第一步就是确定( )。A确定网站标志的颜色 B确定主色调C确定导航条的颜色 D确定主页的背景色4 下面哪个是 Dreamweaver 的模板文件的扩展名：A htmlB htmC dwtD txt5 在创建模板时，下面关于定义可编辑区的说法错误的是：A 可以将网页中的整个表格定义为可编辑区B 可以将分开的单元格定义为可
2、编辑区C 也能一次性将多个单元格定义为可编辑区D 较常见的方式是使用层、表格用来建立框架，在表格里插入层，并将层定义为可编辑区判断题简答题：一、电子商务的概念 二、电子商务网站的概念三、建立电子商务网站目的： 四、电子商务网站的分类五、电子商务网站的设计要求六、一个成功的电子商务网站设计，必须满足哪几方面的要求？（1）网站必须有良好的可扩充性。（2）高效率的并发处理能力。（3）强大的管理工具。（4）已有信息资源的整合。（5）网站必须可靠地确保提供 7X24 小时的服务。（6）良好的容错性能。（7）支持多种客户终端。（8）安全的运行环境。2七、简述电子商务网站开发的基本原则。电子商务网站开发的基
3、本原则有：(1)电子商务网站的内容是吸引客户的重要因素；(2)必须高度重视电子商务网站的效率；(3)考虑电子商务网站的可扩展性；(4)考虑电子商务网站的可用性可维护性八、网站建设需经历哪四个步骤九、版面布局的基本方法十、在设计网站导航时，可以采用的一些基本策略：十一、站点建设又分为四个部分，分别为域名注册、网站平台配置、网页制作和网站测试。十二、简述 IIS 的基本工作原理。Web 浏览器将 URL 发送给 Web 服务器请求信息，服务器使用 URL 的信息来定位和显示页面，而 Web 服务器则返回超文本标记语言（HTML）页面来相应 Web 浏览器的请求，返回的页面可以是静态 HTML 页面
4、、动态 HTML 页面或目录列表页面。填空1 打开某个网站时显示的第一个网页被称为网站的主页（首页） 。2 导航条是链接到网站内主要页面的超链接组合，它可以引导浏览者轻松找到网站中的各个页面，其也因此而得名。3 . 广告条的功能是宜传网站或替其他企业做广告。4 每一个网站都有自己的域名，它是独一无二的。5 . 网址是一种网络上通用的地址格式，用于标识网页文件在网络中的位置。l 、在进行网页制作时，除需要 Dreamweaver 外，还会用到 Fireworks 、Flash、photoshop 等辅助软件。2、 XHTML 语言是网页制作的基础，在网页制作软件出现之前，人们是靠手写代码来制作网
5、页的。3 脚本语言是基于对象的编程语言，网页中常用的有 VBScript、JScript 和 JavaScript.1 建设网站要有目的性，首先要根据网站的性质和受众，确定网站内容和要实现的功能。2 确定网站内容后，就要开始规划网站结构。网站结构有两层意思，一是逻辑结构, 二是 物理结构。3 所谓虚拟空间 ，就是互联网上的一台功能相当于服务器级的电脑或虚拟主机，该电脑要用专线或其他形式 24 小时与因特网相连。4 网站测试一般包括服务器稳定 和 安全测试、 程序和数据库测试、 网页兼容性测试等。1 通过单击 Dreamweaver “插入”栏 中的按钮，可将相应的对象插入到文档中2 . 标签是
6、 XHTML 语言的核心，网页中的文本、图像和动画等在 XHTML 文档中都是用它来描述的。33 在 Dreamweaver 中有代码视图、设计视图两种视图方式。4 标签选择器中显示对象层次结构的方式为自左向右，也就是说，在标鉴选择器中的位置越靠左，对象覆盖的范国就越大。5 . “属性”面板位于文档窗口下方，主要用于查看或编辑所选对象的属性。1、最好不要使用中文命名文件和文件夹，因为在使用 Unix 或 Linux 作为操作系统的主机上，使用其命名的文件会出错。2 为保证网站发布后不出错，文件名最好全部使用小写英文字母。3 在大型网站中 ，分支页面的文件应存放在单独的文件夹中，每个分支中的图像
7、也应该存放在单独的文件夹中，存放网页图像的文件夹一般命名为“images ”或者“img ” 。4 在“文件”面板中所建文档的扩展名取决于创建站点时所选择的服务器技术。如果选择“否，我不想使用服务器技术” ，则新建文档的扩展名默认为 “html”；如果选择使用ASP Javascript 服务器技术，则新建文档的扩展名默认为“asp”. 5 创建网站的第一步是确定本地站点的 目录 结构，并准备好相应的素材文件，然后在 Dreamweaver 中定义站点并创建网页1 在 Google 、baidu、Yahoo 等搜索引擎中搜索网页时，不是检索整个网页的所有内容，而是只检索网页的关键字 。2 如果
8、要将图像设置为网页背景，应尽可能选择尺寸较小的图像，并使其以 平铺的方式填充整个网页。3 网页的左、右边距值是根据网页文档和一定分辨率下浏览器的宽度值设置的。1 、为便于浏览者阅读，对于输入的长文本，需要对其进行换行或分段。其中，分段时可将插入点置于要作为下一段的文本起始处的前方，然后按 Enter 键：换行时可按 Shift+Enter 组合键。2 要设置段落格式，只需将插入点定位在该段落即可进行设置；要设置字符格式，应首先 利用拖动方法选中文本，然后再进行设置。3 列表分为项目列表和编号列表，项目列表 常应用在“列举”类型的文本中，编号 列表常应用在“条款”类型的文本中。1 目前在网页中可
9、以使用的图像包括 JPEG 、GIF 和 PNG 格式。2 要插入图像，首先在要插入图像的位置单击 确定插入点，然后单击 “常用”插入栏 中的“图像”按钮。3 在网页中经常可以看到这种情况，当鼠标移动到某一图像上时，图像变成了另一幅图像，而当鼠标移开时，又恢复成原来的图像，这就是我们通常所说的 鼠标经过图像。4 . 导航条 在网站中起着不可替代的作用，它把网站中的各个页面连接起来。5 如果网页中的某个图像尚未制作好，可暂时用图像占位符来代替l , Flash 动画是目前最流行的矢量动画，它具有文件尺寸小、变化丰富的优点，因而很多网页中都用到了它2 默认情况下，在设计视图中只能看到 Flash
10、动画的占位符 ，其大小代表了 Flash 动画的实际大小。 3 除音频文件外，在 Dreamweaver 中还可以非常容易地插入视频文件、 shockwave 影片和 Applet 等其他媒体元索。 44 当 Flash 动画的背景颜色遮盖掉背景图像时，可以将其设置为透明。5 要插入视频文件，可选择 “插入记录” “媒体” “插件” 菜单。1 常规超链接包括内部超链接和外部超链接 ， 内部超链接是指目标文件位于站点内部的链接； 外部超链接可以实现网站与网站之间的跳转，也就是从本网站跳转到其他网站。2 所谓图片链接，就是在单击网页中的某个小图片时在新窗中打开一幅大图片。3 很多网站上留有电子邮件
11、地址，单击该地址可打开“outlook Express”的“新邮件”窗口，是一种特殊类型的链接，叫电子邮件链接。4 热点链接又叫图像映射，就是使用热点工具 将一张图片划分成多个区域，并为这些区域分别设置链接。5 要设置命名锚记链接，应首先插入命名锚记 ，然后创建跳转到该命名锚记的链接。6 跳转菜单相当于 一组超链接的集合，在网页中显示为弹出式下拉菜单。1 每个行为都由两部分组成，即事件和动作 。2 应用 “打开浏览器窗口”行为，可通过单击目标文字或图片，打开固定大小窗口的效果3 一般对纯文本是不能应用行为的，如果要对其应用行为，首先需要为其设置链接 4 除Dreamweaver 内置的行为外，
12、读者还可以到 Adobe 或其他网站上去下载并安装第二方行为。l ，所谓表格（Table）就是由一个或多个单元格构成的集合，表格中横向的多个单元格称为行 ，垂直的多个单元格称为列 。2 在 Dreamweaver 中选择表格的方法非常简单，只需用鼠标单击表格边框线即可 。当表格外框显示为黑色粗实线时，就表示该表格被选中了。3 要选择某个单元格，可首先将插入点放置在该单元格内，然后按 Ctrl+A 组合键或单击标鉴选择器中对应的 标鉴。4 要选择表格中的某行或某列，可将光标置于该行左 侧或该列顶部，当光标形状变为黑色箭头或时单击鼠标。5 如果希望选择一组不相邻的单元格，可按住 Ctrl 键单击选
13、择各单元格。另外，单击选择某个单元格后，按住 Shift 键单击其他单元格，可选择单元格区域。6 ，在不需要精确指定表格宽度时，可在选中表格后，通过拖动右侧边框上的 黑色控制点，来改变表格的宽度。7 所谓嵌套表格，就是在一个表格的某个单元格里插入一个新表格。1 使用框架的最常见情况就是，一个框架显示包含导航控件的文档，另一个框架显示含有主要内容的文档。2， 框架集文档定义了当前在浏览器中显示的网页文档的构造和各个框架的特征（如边框大小、边框颜色等） 。 3 一个界面被分成多个框架，如果没有框架 名称 ，则不能确定要在哪个框架中打开所链接的网页文档。4 如果想要删除不需要的框架区域，可单击该框架
14、区域的边界线，然后向外拖动到文档窗口外侧。5 框架名只能包含字母、下划线 等，且必须是字母开头，不能使用连续字符、句点及空格，不能使用 JavaScript 的保留关键字。1 为增强 Css 样式的通用性，我们可以创建扩展名为 css 的外部样式表文件。利用“ 5CSS 样式”面板可将该文件链接至站点中的一个或多个网页中 ，从而使用户可以直接应用其中定义的样式。2 . 内部或嵌入式）CSS 样式表是一系列包含在 HTML 文档 head 部分 style 标签内的CSS 样式。3 在制作网站时，用户大都会将常用的样式保存在 外部样式表文件中，而将个别对象用到的样式嵌套在相应的网页文档中，从而省
15、去很多重复性工作，大大提高了网站的制作和维护效率。4 . 类样式又称自定义样式，它是唯一可应用于文档中任何对象的 CSS 样式类型，主要应于定义一些特殊的样式。5 选择器样式又称高级样式，它主要用来定义链接文本的样式，也可用来重定义特定标签组合的样式。6 如果要复制或移动已创建的 CSS 样式到其他样式文件或网页文档中，可右键单击该样式，在弹出的快捷菜单中选择“复制 ”或“移动 CSS 规则 ”菜单。1 通过创建通用性较强的样式表文件，并将其 链接于多个网页，可大大节省网页制作时间，并能批量、快速更新网页外观。2 应用 CSS 滤镜可为图像设置渐变、透明、阴影等效果。1 Web 标准是由 W3
16、C 和其他标准化组织制定的一套规范,包括 XHTML、JavaScript 及 CSS等一系列标准.2. 目前来说,Web 标准由结构、 表现 和行为三部分组成。3 应该为所有使用”float”属性的元素设定宽度值,否则结果将是不可预知的.4 在”Div+CSS”布局中,对象的宽度不仅仅由”width”值来决定.一个对象的真实宽度是由对象本身的宽,对象的左右外边距 ,左右边框,以及 内边框这些属性相加而成.1 动态网页一般使用”HTML 数据库 ASP ” 、 “HTML 数据库PHP ”或“ HTML 数据库JSP ”等技术来实现.2 在 Windos XP 操作系统下，只要安装了 IIS
17、，就可以将自己的电脑设置为测试服务器.1. 数据库 看起来像是一个表格,按照行和列来表示信息.一股来说，表的每一行称为一个记录 ，每一列称为一个字段 。2 目前常用的数据库管理系统有 Microsoft Access 、 Microsoft SQL Server 、 Oracle 和 DB2 等。1 严格来说，一个完整的表单设计应该分为两部分，即表单对象部分和应用程序部分,它们分别由网页设计师和程序设计师来完成。2 文本字段可以以单行或多行显示，也可以以密码方式显示。3 表单对象的名称中不能包含空格或特殊字符，可以是字母、数字 或下划线的组合。4 . 动态文本是指需要从数据库中读取，而不是直接
18、输入到网页中的文本。6读程序题，写出下列程序的含义或运行结果。1、请写出下列程序的运行结果：电子商务网站建设 欢迎来到电子商务网站 2请写出一个完整的 HTML 文档的基本结构。网页的标题网页的正文部分7综合题“淡蓝的天空”个人网站的栏目规划（）一、要求与目的 掌握网站的定位 掌握栏目规划 掌握逻辑结构设计 掌握目录结构设计二、规划分析过程1网站定位：通过上述案例假设，从中可对网站做出定位：极具个性化的个人网站，根据个人兴趣爱好，分享资源，以期通过网络平台结识更多的同好者。网站访问群体定位：所有志趣相投的朋友，共同交流和资源共享为了表达一种心境，凸现自己的个性，将要建立的网站取名为“淡蓝的天空
19、”2网站栏目划分对网站及其访问群体做了定位后，接着需要做的是确定网站所必需的栏目，依案例假设，确定栏目及其名称如下：1) 平凡的陌生人：此栏目主要是为了在网络上展现自己，让别人了解自己。 2) 感动你的心灵：此栏目主要是把自己平时收集的文摘、网络文学、杂文、幽默等共享出来，与有共同兴趣的朋友一同来欣赏，以期望在心灵深处有所触动。3)请聆听：此栏目主要是把自己喜欢的音乐呈现给同好者或浏览者，来共同欣赏这美妙的乐 曲。4)那笨拙的脚印：此栏目主要是提供收集的网络资源，起名 “那笨拙的脚印”主要是为了体现设计者在网络和相关技术上的欠缺，同时也隐含设计者此方面虽然“脚印笨拙”，但仍孜孜不倦的追求的心境
20、，也包含谦逊的成分在内。85)同心结：此栏目主要是给有着共同兴趣的朋友提供相互链接的平台，以达到能和同类的网站进行相互推荐，建立良好的合作关系的目的。6)晚安：此栏目主要是留言本，提供浏览者与浏览者、浏览者与作者间共同交流的地方，起名“晚安”主要是考虑到同好者多位全职，晚上上网较多，同时也体现设计者不拘一格的设计思想，表达个性，问候朋友。 在所有栏目中，“感动你的心灵”和“那笨拙的脚印”是重要的栏目，其中“感动你的心灵”需要对它进行更细的划分，根据自己兴趣和所收集的相关文章，本栏目又被划分为：“文摘”、“网文”、“杂文”、“幽默”、“测验”、“专栏”等子栏目。3. 网站逻辑结构设计由于本网站属
21、于个人网站。一般情况下栏目不是太多，结构不是太复杂，层次不是太多，为了能使相关内容划分的很清楚，便于理解和浏览，本网站采用层次型逻辑结构。如图 23 所示。图 2-3 层次型逻辑结构将网站所有栏目及其子栏目连在一起，本网站的逻辑目录结构如图 24 所示图 2-4 “淡蓝的天空”网站层次型目录结构图4网站目录结构设计为了便于网站管理和维护，网站的目录结构设计采用规范设计，即建立网站根目录，再在网站根目录下建立各级栏目的目录，目录名采用拼音，images 目录有两级网站 images 和各栏目目录下独立的images。如图 25 所示。9图 2-5 “淡蓝的天空”网站目录三、本实例知识点1、 网站
22、的定位网站的定位就是确定网站的建设目标，它通常需要确定三个方面：网站的建设目的、网站的访问对象和网站的内容与服务。用更通俗的话来说，就是回答“为什么要建立这个网站?这个网站为谁服务?网站提供哪些方面的内容和服务?”这三个问题。不同性质的站点有不同的建设目的，比如电子商务站点主要是为了在企业与企业、企业名。与个人消费者之间建立更为直接和高效的商务通道；电子政务网站代表的是政府部门，所以主要是通过它来宣传政府的形象、实现政务公开、向社会提供有价值的公益和导向信息，以及实现网上政务；而个人站点则主要是为了介绍个人的兴趣爱好，通过共享信息来结识更多的朋友。网站的访问对象指的是这个网站主要面向哪些社会群
23、体?是企业、消费者、社会大众、兄弟部门还是所有志趣相投的朋友?比如你是一个非常喜欢 ROLLING STONE 乐队的人，那么你可能就非常希望通过你的网站来结交更多同样喜欢 ROLLING STONE 乐队的朋友。网站的内容与服务指的是你计划在你的网站上放置哪些内容来让别人访问。接着上面的例子，你可能就会在你的网站上放置很多有关 ROLLING STONE 乐队的内容，比如 ROLLING STONE 乐队的经典乐曲、ROLLING STONE 乐队的图片、ROLLING STONE 乐队的最新动态等。网站是提供了一个与外界进行交流的窗口，而真正赋予网站生命力的是网站的内容。具有能吸引人的内容
24、才能留住访问过的人，才能吸引更多的人来访问。对于内容收集，在确定好需要在网站上放置什么内容之后，接着要做的就是大量收集相关的内容并对其进行整理。内容收集的渠道很多，一方面你可能已经有了一些积累，另一方面你也可以从朋友、杂志或者因特网上搜索和下载，最后你还可以自己创作一些内容。2、 栏目规划及其任务栏目规划的主要任务是对所收集的大量内容进行有效的筛选，并将它们组织成一个合理的便于理解的逻辑结构，即建立网站的逻辑结构，在这其中不仅需要为整个网站建立层次型结构，还需要为每一个栏目或者子栏目设计合理的逻辑结构。除此之外，栏目规划还需要确定哪些是重点栏目、哪些是需要实时更新的栏目、需要提供哪些功能性栏目
25、等。1)确定必需的栏目栏目规划的第一步就是要确定哪些是必需的栏目，这通常取决于网站的性质。比如对于一个企业网站来说，公司简介、产品介绍、服务内容、联系方式、技术支持等栏目是必不可少的，而对于政府网站来说政务、政策法规、地方经济、百姓生活、观光旅游等栏目都是必需的。个人网站相对来说比较随意，往往取决于所收集的内容，但个人简介、个人收藏等栏目通常不能缺少。除了内容栏目之外，网站还应该包含另外两类栏目，分别是用户指南类栏目和交互性栏目。用户指南类栏目的目的是为了帮助用户了解这个网站的背景、性质、目的、功能及发展历程，了解如何更好地对网10站进行访问，了解网站建设的最新动态。这类栏目通常以“帮助”、“
26、关于网站”、“网站地图”、“最新动态”等名称出现。交互性栏目是能与用户进行双向交流的栏目，通过它不仅可以解答用户的疑问、了解用户的需求，而且还可以获得用户对网站的建议和看法，让用户与网站、用户与用户之间建立良好的沟通，以便更好地帮助网站的建设与发展。交互性栏目最常见的方式就是留言板。2) 确定重点栏目在确定完需要设置哪些栏目之后，接着需要做的是从这些栏目中挑选出最为重要的几个栏目然后对它们进行更为详细的规划，这种选择往往取决于网站的目的与功能。比如企业网站，其目的可能是为了更好地推销自己的产品，所以产品介绍便是它的重点栏目。因此为了更好地介绍产品，它除了基本的产品介绍之外，可能还需要设立价格信
27、息、网上定购、产品动态等相关栏目。又比如个人网站，它的目的通常是为了让别人分享他收集到的信息，更想向别人介绍他的原创作品，所以它的重点栏目往往是个人作品和个人收藏。比如“淡蓝的天空”，它的重点栏目就包括“感动你的心灵”和“那笨拙的脚印”。3)建立层次型结构建立层次型结构是一个递进的过程，即从上到下一级一级地确定每一层的栏目。首先是确定第一层，即网站所必需的栏目，然后对其中的重点栏目进行进一步的规划，确定它们所必需的子栏目，以此类推直至不需要再细分为止。将所有的栏目及其子栏目连在一起就形成了网站的层次型结构。比如本例的“淡蓝的天空”个人网站，它在第一层设置了“那笨拙的脚印”、“感动你的心灵”二个
28、重点栏目和“平凡的陌生人”、“请聆听”“同心结”、“晚安”四个其他栏目，其中“感动你的心灵”重点栏目又进行了更细的规划“文摘”、“网文”、“杂文”、“幽默”、“测验”、“专栏”等子栏目。将这些栏目及其子栏目连在一起，我们可以很清楚地看到“淡蓝的天空”个人网站的层次型结构，如图 2-4 所示。成功的栏目规划不仅能给用户的访问带来极大的便利，帮助用户准确地了解网站所提供的内容和服务和快速地找到自己所感兴趣的网页，而且能帮助网站管理员对网站进行更为高效的管理。4)设计每一个栏目层次型结构的建立只是对网站的栏目进行了总体的规划，接下来要做的是对每一个栏目或者子栏目进行更为细致的设计。设计一个栏目通常需
29、要做三件事情，首先是描述这个栏目，描述这个栏目的目的、服务对象、内容、资料来源等。描述能让浏览者对这个栏目有整体的了解和把握，也能让网站建设者对这个栏目有一个准确、清晰的认识。其次是设计这个栏目的实现方法，即设计这个栏目的网页构成、各个网页之间的逻辑关系、各个网页的内容、内容的显示方式、数据库结构等各个方面的问题。比如很多网站都有的用户注册栏目，如图 2-6所示，这个栏目通常需要五个网页，采用线型结构（参见下个知识点）来进行组织。第一个网页“开始注册”是用户注册的入口，它的内容通常只是一个指向第二个网页的超链接。第二个网页“接受条款”上除了列出相应的条款之外，还需要设置一个用于选择是否接受条款
30、的表单。第三个网页“填写注册信息”采用表单来实现，所需注册的信息根据网站的需求而定，通常包括用户名、密码、性别、国籍、省份、E-mail 等内容。第四个网页“信息检验”是为了检验用户信息的合法性，即检查所填写的用户名是否已经存在、所填写的出生年月是否在正常范围之内、所填写的内容是否包含非法脚本和不文明的词汇等内容。这个网页可能不会显示给用户，只是根据其检查的结果跳转到相应的网页，比如检查通过就跳转到“完成注册”网页，检查不通过就跳转到“填写注册信息”网页要求重新填写或者修改不合法的部分。最后一个网页是“完成注册”，它需要将用户的注册信息保存到数据库中并将成功注册的信息显示给用户。图 2-6 用
31、户注册栏目11最后是设计这个栏目和其他栏目之间的关系。虽然分为不同的栏目，但很多情况下，栏目与栏目之间存在着从数据、内容到布局等各个层次上的关联。比如企业站点的产品介绍、价格信息和在线定单等栏目之间通常使用统一的数据库，这样在任何一个栏目中打开同一个产品时都能看到相同的介绍信息，保证了信息的一致性，而且统一的数据库也便于管理和维护。又比如门户网站通常将娱乐资讯分为电影、音乐、短信、游戏等多个子栏目，它们之间有许多关联的内容，比如电影都有电影主题曲和插曲，很多歌曲又被编辑成手机铃声和短信，很多电影被制作成游戏，同时又有很多游戏被拍成电影，比如古墓丽影，相关的内容将这些不同栏目串联在一起，使用户的
32、访问更加方便。所以设计栏目之间关系的工作就是找出各个栏目之间可以共享和相关的内容，并确定采用什么样的方式将它们串联起来。 栏目规划最便捷的方法就是参考同类网站的栏目规划，吸收共同的栏目，去掉不适合的栏目，然后添加有自己特色的栏目。3、 逻辑结构设计不同网页之间通常具有一定的逻辑关系，比如先后关系、包含关系、并列关系等，多个网页按照它们之间的逻辑关系组织在一起就形成了各种逻辑结构。在现在的网站中，最常见的逻辑结构就是层次型结构，其次是线型结构和网型结构。1) 线型结构线型结构是最为简单的逻辑结构，如图 2-7 所示，它将多个网页按照一定的先后顺序链接起来，使得用户在没有完成上一个网页的访问之前就
33、无法进入下一个网页。图 2-7 线性结构线型结构最常用于需要按步骤进行的栏目上，比如用户注册、建立定单、教程等。图 2-5 所示的就是一个典型的用户注册的例子，从这个图可以看出。一个新用户要完成注册需要经历四个步骤，而且必须按顺序进行，否则就不能完成注册。又比如在当当网购买图书或者音像制品，也必须按顺序进行选择商品、确认购物车、填写定单、生成定单四个步骤，如图 2-8 所示。图 2-8 当当网购物流程图 2-7 所示的只是最简单的线型结构，在这个基础上进行扩展可以演变出更具灵活性的线型结构，以满足各种不同的需求。如图 2-8 所示的带抉择的线型结构，可以根据用户不同的抉择来访问不同的下一个网页
34、。又比如图 2-9 所示的带选项的线型结构，可以让用户直接跳转到后面的步骤以加快任务的完成。图 2-9 带抉择的线型结构图 2-10 带选项的线型结构2) 层次型结构相对于按先后顺序组织而成的线型结构，层次型结构是按照网页之间的包含关系组织而成。图 2-2所示的就是一个典型的层次型结构，它很像一棵倒置的树。12层次型结构简单而且直观，能将所有的内容划分得非常清晰且便于理解，所以几乎所有的网站都采用这种结构来进行总体的栏目规划，即将所有的内容先分成若干个大栏目，然后再将每个大栏目细分成若干小栏目，以此类推直到不用再细分为止。层次型结构也有不好的地方，就是用户如果要访问最底层的网页就不得不按照层次
35、从上到下一级一级地访问，最终到达想要访问的网页。如果层次型结构的层次很深，比如有五层或者六层，那么所带来的麻烦就大大降低了层次型网络所具有的优点。又比如图 2-11 所示的例子，用户想从网页 A 转到网页 B，很可能不得不先从网页 A 一级级地返回到网页 C，然后再一级一级地往下走直到网页 B。图 2-11 层次型结构说明图所以过深过于复杂的层次型结构反而会带来很多不良的影响，最好的深度就是三层，最多不要超过五层。另外，建立一个良好的导航系统也可以弥补层次型结构这方面的缺点。3)网络型结构如图 2-12 所示，网络型结构是指多个网页相互之间都超链接的一种结构，这些网页可以是层次结构上的任意网页
36、，但是因为导航的需要或者内容上的相关性而链接在一起。图 2-12 网络型结构比如我们在第 1 章曾访问过的甘肃省人民政府网站()，它的导航条就出现在主页和所有栏目的首页之中，它们之间就形成了一个网络型结构，这样用户在任何一个网页上进行访问的时候，都可以通过这个结构一步切换到其他栏目的网页之上。又比如图 2-13 所示的网页，这个网页的右边设置了到其他二个具有相关内容网页的超链接，其他二个网页的情况也一样。所以这三个网页之间就形成了一个简单的网络型结构，使得用户在浏览某个网页的时候能非常方便地跳转到相关的网页上以便继续浏览。图 2-13 网络型结构实例13网络型结构的实现就在于在所有相关的网页上
37、保留到其他网页的超链接。这种结构使用户能更方便地在网站上游弋，但同时也带来一个庞大超链接数的问题。我们可以简单地计算一下，总的超链接数应该等于网页数乘以网页数减一，所以三个网页的网络型结构的超链接总数为 32=6，10 个网页的网络型结构的超链接总数就到达 lO9=99。这么庞大的超链接数维护起来相当麻烦，某个网页的改动(如改名、删除、增加)就可能同时需要对所有的网页进行相应的修改，这是谁都不愿意做的事情，所以在网站中需要谨慎使用网络型结构。4、 网站目录结构设计目录结构又称为物理结构，它的设计解决的是如何在硬盘上更好地存放包括网页、图片、Flash 动画、JavaApplet、数据库等各种资
38、源在内的所有网站资源。目录结构是否合理，对网站的创建效率会产生较大的影响，但更主要的，会对未来网站的性能、网站的维护及扩展产生很大的影响。举一个例子来说明，比如极端情况下，将所有的网页文件和资源文件都放在同一个目录底下。那么当文件一多时，www 服务器的性能就会急剧下降，因为查找一个网页文件需要很长的时间，而且网站管理员在区分不同性质的文件和查找某一个特定的文件时也会变得非常麻烦。目录结构对用户来说是不可见的，它只针对网站管理员，所以它的设计是为了网站管理员能从文件的角度更好地管理网站的所有资源。如图 25 所示。目录结构的设计通常需要遵循以下原则：1) 不要将所有的文件都放在根目录下有的管理
39、员为了图方便，将所有的文件都放在根目录下。正像前面刚提到的，这么做很容易造成文件管理混乱。而且当文件很多时，会非常影响 WWW 服务器的索引速度。因为服务器通常需要为根目录建立一个索引，而且每增加一个新的文件时都需要重新建立索引，所以很明显，文件越多，建立索引的时间也就越长。2) 根据栏目规划来设计目录结构一般情况下，可以按照网站的栏目规划来设计目录结构，使两者有一一对应的关系。但是这么做，也会导致一个安全问题，就是访问者很容易猜测出网站的目录结构，也就容易对网站实施攻击。所以在设计目录结构的时候，尽量避免目录名和栏目名相一致，可以采用数字、字母、下划线等组合的方式来提高目录名的猜测难度。3)
40、每个目录下都建立独立的 images 子目录将图片及资源文件都放在一个独立的 images 目录下，可以使目录结构更加清晰。如果很多网页都需要用到同一个图片，比如网站标志图片，那么将这个图片放到所有这些网页共有的最高层目录的 images子目录下。4)目录的层次不要太深5)不要使用中文目录名因为你的站点是对 Internet 所有用户开放的，所以你得考虑到使用非中文操作系统的客户也能正常访问你的站点。对于目录名，最好都使用英文。6)可执行文件和不可执行文件分开放置将可执行的动态服务器网页文件和不可执行的静态网页文件与动态网页文件分别放在两个目录下，然后将存放可执行网页文件的目录设为不可读和执行
41、。这么做的好处就是可以避免动态服务器网页文件被读取。7)数据库文件单独放置数据库文件因为安全需求很高，所以最好放置在 HTTP 所不能访问到的目录底下。这样就可以避免恶意的用户通过 HTTP 方式取到数据库文件。“淡蓝的天空”个人网站的栏目规划（二）一、要求与目的 掌握网站的色彩搭配14 掌握网站的版面布局设计 掌握网站的导航设计二、规划分析过程1风格设计：风格设计包含很多内容，为了体现个人风格，符合网站的名称和定位。下面我们在色彩搭配和版面布局方面做一些规划和设计。1)色彩的选取及搭配本网站名为“淡蓝的天空”，因此整个网站拟采用蓝色（0082CE）为主要色调，再辅助于一些绿等其它颜色，体现凉
42、爽、清新、淡雅、浪漫的氛围。图 2-14 “淡蓝的天空”首页图形界面为了更好地体现网站风格，本案例所有网页均采用一副已设计好的图片作为网页界面，不同的栏目采用不同的风格图片。比如首页就采用一副包含网站名称、各主要栏目，以蓝色为主要色调的图片来作为整个首页的界面，如图 2-14 所示。2)版面布局首页布局：首页虽然采用图 214 的图片作为整个网页的界面，但在布局上基本属于图 215 所示的布局方式。图 2-15 “淡蓝的天空”首页版面布局“感动你的心灵”栏目主要是文摘、网文、杂文、专栏等，界面利用图形设计成一本打开的书如图216 所示，但在版面布局上采用如图 217 所示的布局方式。15其它栏
43、目布局基本采用类似的布局方式，请学习者自行设计（或参考本书提供的电子文档）。3) 导航设计由于本案例栏目数量、网页数量都不多，导航系统选择栏目名称直接导航的形式。三、本实例知识点1、网站的风格设计网站的风格设计是抽象的。许多网站的建设者都是从事计算机和网络技术的，他们非常熟悉网页制作技术，但是却少有想法创作一个既美观又有独特风格的主页。另一方面，专业的美工师通常从事的都是传统的美工技术，对网页制作技术和因特网知之甚少，所以不知道如何设计最适合网络传输的图片。所以，网站的风格设计并不简单，它是一项综合的技术。风格是抽象的，它往往无法用一个具体的物体来描述，它是指用户对网站整体形象的一种感觉。这个
44、整体形象包括网站标志、色彩、版面布局、交互方式、文字编排、图片、动画等诸多因素。风格又是独特的，是网站最不同于其他网站的地方。统一的风格使用户无论处在网站的哪一个网页，都明确知道自己正在访问的是这个网站。比如微软公司的网站，任何一个网页都有微软特有的蓝色和“Microsoft“网站标志。1) 色彩搭配网站的色彩是最影响网站整体风格的因素，也是站点美工设计中最令人头疼的问题。许多网页设计者都缺乏色彩搭配的基本知识，所以在制作网页之前往往有一个很好的想法，但是却不知如何搭配网页的颜色来表达预想的效果。因此，在介绍色彩搭配之前，先来看看色彩的基本知识。 色彩的基本知识在物理学中，颜色是因为光的折射而
45、产生的。颜色不同，光的波长也就不同。红、绿、蓝是自然界的三原色，它们不同程度的组合可以形成各种颜色。所以在网页中，也就用它们的不同颜色值来表示各种颜色。网页中的颜色通常采用 6 位十六进制的数值来表示，每两位代表一种颜色，从左到右依次表示红色、绿色和蓝色。颜色值越高表示这种颜色越深。比如红色，其数值为“#FF0000”，白色为“#FFFFFF”，黑色为“#000000”。也可以采用三个以“，”相隔的十进制数来表示某一颜色，比如红色，其十进制表示为color(255，0，0)。在传统的色彩理论中，颜色一般分为彩色和非彩色(或称为灰色)两大色系。非彩色是指黑、白和所有灰色，彩色是指除非彩色外所有的
46、颜色。在网页中，如果三种颜色的数值相等，就显示为灰色。16太阳光是彩色的，按颜色的色调通常将其划分为七种颜色：红、橙、黄、绿、青、蓝、紫。如果将这七种颜色按这个顺序渐变为一条色带的话，越靠近红色，给人的感觉越温暖，越靠近蓝色和紫色，给人的感觉越寒冷。所以红、橙、黄的组合又称为暖色调，青、蓝、紫的组合又称为冷色调。除了冷暖的差别外，不同的单个颜色也会给人带来不同的感觉，通常：红色：是一种激奋的色彩，给人以冲动、愤怒、热情和活力的感觉。绿色：介于冷暖两种色彩的中间，一显得和睦、宁静、健康、安全。它和金黄、淡白搭配，可以产生优雅、舒适的气氛。橙色：也是一种激奋的色彩，具有轻快、欢欣、热烈、温馨和时尚
47、的效果。黄色：充满快乐、希望、智慧和轻快，它也是最亮的一种颜色。蓝色：是最具凉爽、清新、专业的色彩。它和白色混合，能体现柔顺、淡雅、浪漫的气 (如天空的色彩)。白色：给人以洁白、明快、纯真和干净的感觉。黑色：通常是深沉、神秘、寂静、悲哀和压抑的代表。灰色：具有中庸、平凡、温和、谦让、中立和高雅的感觉，它可以和任何一种颜色进行搭配。 网站的色彩搭配网站的色彩搭配通常分为两个步骤，那么第一步就是为整个网站选取一种主色调，然后再为主色调搭配多种适合的颜色。主色调指的是整个网站给人印象最深的颜色，或者说除白色之外用得最多的颜色。正如前面所述，不同的颜色给人的感受是不一样的，所以主色调选取的一个最基本的
48、原则就是保证所选的颜色与网站的主题或者形象相符，进一步地，能够通过这种颜色加深用户对网站的印象。比如蓝色是一种让人感觉非常专业的颜色，所以许多高科技公司都喜欢使用蓝色作为公司网站的颜色。最典型的当数微软公司(图 218，)，蓝色极大地加强了人们对他们产品的信任感。又比如使用红色的北京市政府网站 (WWW)，是通过红色来向人们传达北京作为中国首都大气和热情的气质。IBM 公司主页（WWW）就采用了黑色和蓝色为主色调，如图 219 所示。企业或者政府部门在选取主色调的时候需要考虑符合自身的形象，而个人网站则要随意得多，往往选择的是自己喜欢的颜色。选好主色调之后，接下来要考虑的就是在什么地方使用主色
49、调。从前面的几个例子也可以看到，主色调最常表现在三个位置，首先是头部，也就是网页最上面的部分，通常包含导航条。头部是最能体现主色调的地方，所以所有的网站都会在头部表现主色调。其次是栏目索引条上，栏目索引条虽然面积小，但是出现在网页的各个部位，所以能非常有效地渲染主色调。最后是网页上的文字，文字笔画虽细，但大面积的文字也能很好地突出主色调。接着要考虑的是别的地方使用什么颜色去搭配这种主色调，比如背景色、文字颜色、导航条颜色、插图颜色等都使用什么颜色。色彩搭配是一项非常精细的工作，因为往往一个细节就会影响整个网页的色彩均衡。色彩搭配没有固定的模式与步骤，但是如果从大面积用色到小细节去搭配颜色，会使得这项工作更轻松一些。下面我们就来看看几个主要的方面。(1) 选取背景色(2) 导航条的颜色(3) 栏目索引条的颜色(4) 文字的颜色(5) 插图
