●目录的层次不要太深。 
　　目录的层次建议不要超过3层。原因很简单，维护管理方便。 

　　其它需要注意的还有： 
1.不要使用中文目录；网络无国界，使用中文目录可能对网址的正确显示造成困难。 
2.不要使用过长的目录；尽管服务器支持长文件名，但是太长的目录名不便于记忆。 
3.尽量使用意义明确的目录；上面的例子中，你可以用Flash,Dhtml,Javascript来建立目录， 
也可以用1，2，3建立目录，但是哪一个更明确，更便于记忆和管理呢？显然是前者！ 

　　随着网页技术的不断发展，利用数据库或者其他后台程序自动生成网页越来越普遍，网站的 
目录结构也必将飞跃到一个新的结构层次。 

二.网站的链接结构 

　　网站的链接结构是指页面之间相互链接的拓扑结构。它建立在目录结构基础之上，但可以跨越 
目录。形象的说：每个页面都是一个固定点，链接则是在两个固定点之间的连线。一个点可以和一 
个点连接，也可以和多个点连接。更重要的是，这些点并不是分布在一个平面上，而是存在于一个 
立体的空间中。 

●我们研究网站的链接结构的目的在于：用最少的链接，使得浏览最有效率。 

　　一般的，建立网站的链接结构有两种基本方式： 
　　1.树状链接结构（一对一）。类似DOS的目录结构，首页链接指向一级页面，一级页面链 
接指向二级页面。立体结构看起来就象蒲公英。这样的链接结构浏览时，一级级进入，一级级退出。 
优点是条理清晰，访问者明确知道自己在什么位置，不会"迷"路。缺点是浏览效率低，一个栏目 
下的子页面到另一个栏目下的子页面，必须绕经首页。 

　　2.星状链接结构（一对多）。类似网络服务器的链接，每个页面相互之间都建立有链接。 
立体结构象东方明珠电视塔上的钢球。这种链接结构的优点是浏览方便，随时可以到达自己 
喜欢的页面。缺点是链接太多，容易使浏览者迷路，搞不清自己在什么位置，看了多少内容。 

　　这两种基本结构都只是理想方式，在实际的网站设计中，总是将这两种结构混合起来使用。 
我们希望浏览者既可以方便快速的达到自己需要的页面，又可以清晰的知道自己的位置。所以， 
最好的办法是： 

●首页和一级页面之间用星状链接结构，一级和二级页面之间用树状链接结构。 

　　举个例子。一个新闻站点的页面结构如下： 
--------------------------------------------------- 

一级页面 二级页面 

财经新闻页 -- [财经新闻1，财经新闻2...] 
/ | 
首页 -- 娱乐新闻页 -- [娱乐新闻1，娱乐新闻2...] 
\ | 
IT新闻页 -- [IT新闻1，IT新闻2...] 

---------------------------------------------------- 
　　其中，首页，财经新闻页，娱乐新闻页，IT新闻页之间是星状链接，可以互相点击，直接 
到达。而财经新闻页和它的子页面之间是树状连接，浏览财经新闻1后，你必须回到财经新闻页， 
才能浏览IT新闻2。所以,有站点为了免去返回一级页面的麻烦，将二级页面直接用新开窗口 
(POP up windows)打开，浏览结束后关闭即可。 

　　注意：以上我们都是用的三级页面举例。如果您的站点内容庞大，分类明细，需要超过三级 
页面，那么建议你在页面里显示导航条，可以帮助浏览者明确自己所处的位置。就是您经常看到 
许多网站页面顶部的，类似这样： 
“您现在的位置是：首页->财经新闻->股市信息->深圳股->深发展” 

　　关于链接结构的设计，在实际的网页制作中是非常重要一环。采用什么样的链接结构直接 
影响到版面的布局。例如你的主菜单放在什么位置，是否每页都需要放置，是否需要用分帧框 
架，是否需要加入返回首页的链接。在连接结构确定后，再开始考虑链接的效果和形式，是采 
用下拉表单，还是用DHTML动态菜单等等。 

　　随着电子商务的推广，网站竞争的越来越激烈，对链接结构设计的要求已经不仅仅局限于 
可以方便快速的浏览，更加注重个性化和相关性。例如，一个爱婴主题网站里，在8个月婴儿 
的营养问题页面上，你需要加入8个月婴儿的健康问题链接，智力培养链接，或者是有关奶粉 
宣传的链接，一本图书，一个玩具的链接。因为父母不可能到每个栏目下去寻找关于8个月婴 
儿的信息，他们可能在找到需要的问题后就离开网站了。如何尽可能留住访问者，是网站设 
计者未来必须考虑的问题。 

　　讲到这里，阿捷忽然觉得自己很厉害，居然会总结出这么大一套理论什么，皮厚? 
可能吧，这么多高手都没发言呢！有意见请来信

确定网站的整体风格和创意设计 

　　网站的整体风格及其创意设计是站长们最希望掌握，也是最难以学习的。难就难在 
没有一个固定的程式可以参照和模仿。给你一个主题，任何两人都不可能设计出完全 
一样的网站。当我们说："这个站点很cool，很有个性！"那么，是什么让你觉得很cool 
呢？它到底和一般的网站有什么区别呢？本文试图用最简明的语言来说明： 
1.风格是什么，如何树立网站风格？ 
2.创意是什么，如何产生创意？ 

●风格(style)是抽象的。是指站点的整体形象给浏览者的综合感受。 
这个“整体形象”包括站点的CI（标志，色彩，字体，标语），版面布局，浏览方 
式，交互性，文字，语气，内容价值，存在意义，站点荣誉等等诸多因素。举个例子： 
我们觉得网易是平易近人的，迪斯尼是生动活泼的，IBM是专业严肃的。这些都是网站 
给人们留下的不同感受。 

风格是独特的，是站点不同与其他网站的地方。或者色彩，或者技术，或者是交互方 
式，能让浏览者明确分辨出这是你的网站独有的。例如新世纪网络(www.century.2000c.net) 
的黑白色,网易壁纸站的特有框架,即使你只看到其中一页，也可以分辨出是哪个网站的。 

风格是有人性的。通过网站的外表，内容，文字，交流可以概括出一个站点的个性， 
情绪。是温文儒雅，是执著热情，是活泼易变,是放任不羁。象诗词中的“豪放派”和“婉 
约派”，你可以用人的性格来比喻站点。 

有风格的网站与普通网站的区别在于：普通网站你看到的只是堆砌在一起的信息， 
你只能用理性的感受来描述，比如信息量大小，浏览速度快慢。但你浏览过有风格的 
网站后你能有更深一层的感性认识，比如站点有品位，和蔼可亲，是老师，是朋友。 

看了以上描述，你可能对风格是什么可能依然模糊。其实风格就是一句话：与众不同！ 

如何树立网站风格呢？我们可以分这样几个步骤： 

第一，确信风格是建立在有价值内容之上的。一个网站有风格而没有内容，就好比绣花 
枕头一包草，好比一个性格傲慢但却目不识丁的人。你首先必须保证内容的质量和价值性。 
这是最基本的，无须置疑。 

第二，你需要彻底搞清楚自己希望站点给人的印象是什么。可以从这几方面来理清思路： 

1.如果只用一句话来描述你的站点，应该是:_____________ 
参考答案： 
有创意，专业，有(技术)实力，有美感，有冲击力 
2.想到你的站点，可以联想到的色彩是：________________ 
参考答案： 
热情的红色，幻想的天兰色，聪明的金黄色 
3.想到你的站点，可以联想到的画面是：________________ 
参考答案： 
一份早报，一辆法拉利跑车，人群拥挤的广场，杂货店 
4.如果网站是一个人，他拥有的个性是：________________ 
参考答案： 
思想成熟的中年人，狂野奔放的牛仔，自信憨厚的创业者 
5.作为站长，你希望给人的印象是：____________________ 
参考答案： 
敬业，认真投入，有深度，负责，纯真，直爽，淑女 
6.用一种动物来比喻，你的网站最象：__________________ 
参考答案： 
猫(神秘高贵)，鹰(目光锐利)，兔子(聪明敏感)，狮子(自信威信) 
7.浏览者觉得你和其他网站的不同是：__________________ 
参考答案： 
可以信赖，信息最快，交流方便， 
8.浏览者和你交流合作的感受是：______________________ 
参考答案： 
师生，同事，朋友，长幼。 

你可以自己先填写一份答案，然后让其他网友填写。比较后的结果会告诉你：你网站现 
在的差距，弱点及需要改进的地方。 

第三，在明确自己的网站印象后，开始努力建立和加强这种印象。 
经过第二步印象的的"量化"后，你需要进一步找出其中最有特色特点的东西，就是最能 
体现网站风格的东西。并以它作为网站的特色加以重点强化，宣传。例如：再次审查网站 
名称，域名，栏目名称是否符合这种个性，是否易记。审查网站标准色彩是否容易联想到 
这种特色，是否能体现网站的性格等等。具体的做法，没有定式。我这里提供一些参考： 

1.将你的标志logo,尽可能的出现在每个页面上。或者页眉，或者页脚，或则背景。 
2.突出你的标准色彩。文字的链接色彩，图片的主色彩，背景色，边框等色彩尽量使用 
与标准色彩一致的色彩。 
3.突出你的标准字体。在关键的标题，菜单，图片里使用统一的标准字体。 
4.想一条朗朗上口宣传标语。把它做在你的banner里，或者放在醒目的位置，告诉大家 
你的网站的特色是... 
5.使用统一的语气和人称。即使是多个人合作维护，也要让读者觉得是同一个人写的。 
6.使用统一的图片处理效果。比如，阴影效果的方向，厚度，模糊度都必须一样。 
7.创造一个你的站点特有的符号或图标。比如在一句链接前的一个点，可以使用,.。 
☆※○◇□△→（区位码里自己参看）等等。虽然很简单的一个变化，却给人与众不 
同的感觉，(为什么我没有想到呢？) 
8.用自己设计的花边，线条，点 
9.展示你网站的荣誉和成功作品。 
10.告诉网友关于你的真实的故事和想法。 

风格的形成不是一次定位的，你可以在实践中不断强化，调整，修饰，直到有一天，网友们 
写信告诉你："我喜欢你的站点，因为它很有风格！" 

● 创意(idea)是网站生存的关键。这一点相信大家都已经认同。然而作为网页设计师， 
最苦恼的就是没有好的创意来源。 

注意，这里说的创意是指站点的整体创意，(因为这个创意而产生这个站点，或者相同的 
内容，推出的创意不同),网页的平面设计创意我将在后面的版面布局窍门里介绍。 

创意到底是什么，如何产生创意呢？ 

创意是引人入胜，精彩万分，出奇不意的； 
创意是捕捉出来的点子，是创作出来的奇招.... 
这些讲法都说出了创意的一些特点，实质上， 

○创意是传达信息的一种特别方式。 

比如Webdesigner(网页设计师)，我们将其中的E字母大写一下: wEbdEsigEr，感觉怎么样， 
这其实就是一种创意！ 

创意并不是天才者的灵感，而是思考的结果。根据美国广告学教授詹姆斯的研究，创意思考 
的过程分五阶段： 
1.准备期--研究所搜集的资料，根据旧经验，启发新创意； 
2.孵化期--将资料咀嚼消化，使意识自由发展，任意结合； 
3.启示期--意识发展并结合，产生创意； 
4.验证期--将产生的创意讨论修正； 
5.形成期--设计制作网页，将创意具体化。 

○创意是将现有的要素重新组合。 
比如，网络与电话结合，产生IP电话。从这一点上出发，任何人，包括你和我，都可以创 
造出不同凡响的创意。而且，资料越丰富，越容易产生创意。就好比万花筒，筒内的玻璃片越 
多，所呈现的图案越多。你如果有心可以发现，网络上的最多的创意来自与现实生活的结合(或 
者虚拟现实)，例如在线书店，电子社区，在线拍卖。你是否想到了一种更好的创意呢？ 

创意思考的途径最常用的是联想，这里提供了网站创意的25种联想线索： 

1.把它颠倒 2.把它缩小 3.把颜色换一下 4.使它更长 
5.使它闪动 6.把它放进音乐里 7.结合文字音乐图画 8.使它成为年轻的 
9.使它重复 10.使它变成立体 11.参加竞赛 12.参加打赌 
13.变更一部分 14.分裂它 15.使它罗曼蒂克 16.使它速度加快 
17.增加香味 18.使它看起来流行 19.使它对称 20.将它向儿童诉求 
21.价格更低 22.给它起个绰号 23.把它打包 24.免费提供 
25.以上各项延伸组合 
-------------(转载自樊志育《广告制作》) 

需要一提的是：创意的目的是更好的宣传推广网站。如果创意很好，却对网站发展毫无 
意义，好比给奶牛穿高跟鞋，那么，我们宁可放弃这个创意！ 

关于风格和创意，可以讲得还有许多。感兴趣的网友可以自己找一些广告设计方面的书阅读。 
希望本文能帮助您对网站的设计有一个更新的认识和提高。谢谢！ 

首页的设计 
在我们全面考虑好网站的栏目，链接结构和整体风格之后，我们就可以正式 
动手制作首页了。 
有这么一句俗语："良好的开端是成功的一半"。 
在网站设计上也是如此，首页的设计是一个网站成功与否的关键。人们往往 
看到第一页就已经对你的站点有一个整体的感觉。是不是能够促使浏览者继续点 
击进入，是否能够吸引浏览者留在站点上，全凭首页设计的"功力"了。 
所以，首页的设计和制作是绝对要重视和花心思的。阿捷的经验是：一般首 
页设计和制作占整个制作时间的40%。你宁可多花些时间在早期，以免出现全部做 
好以后再修改，那将是最浪费精力的事。 

　　这里，先插一个“封面”的问题。封面是指没有具体内容，只放一个logo点击进 
入或者只有简单的图形菜单的首页。 
是否需要为站点设计一个“封面”？阿捷的个人观点是：没必要！ 
除非你是很艺术类的站点，或者可以确信内容独特，可以吸引浏览者进一步 
点击进入的站点，否则的话，封面式的首页并不会给你的站点带来什么好处。我 
们上网浏览需要的是快速，有价值的信息，如果等待xx分钟，只显示出一个粗劣的 
“ENTER”图标，那么相信没有人会再耐心等待进入下一页。 

　　因为首页的重要性，阿捷将着重用８篇文章来仔细讨论有关首页设计的方方 
面面，大致提纲如下： 

　　○版面布局的窍门 
　　○色彩的搭配 
　　○字体的设置和表格的嵌套 
　　○细微之处见功力 
　　○考虑不同的浏览器和分辨率 
　　○设计好你的banner和位置 
　　○meta标签的重要性 
　　○首页设计的小建议 

　　今天，只是关于首页设计的一个引子。让我们来大致了解一下首页设计的步骤。 
首页，从根本上说就是全站内容的目录，是一个索引。但只是罗列目录显然是 
不够的，如何设计好一个首页呢？一般的步骤是： 

●确定首页的功能模块 
●设计首页的版面 
●处理技术上的细节 
　　 
　　一).确定首页的功能模块。 
　　首页的内容模块是指你需要在首页上实现的主要内容和功能。一般的站点都需要 
这样一些模块： 
网站名称(logo), 广告条(banner), 主菜单(menu), 
新闻(what's new), 搜索(search), 友情链接(links), 
邮件列表(maillist),计数器(count), 版权(copyright). 
　　选择哪些模块，实现哪些功能，是否需要添加其他模块都是首页设计首先需要确 
定的。 
　　　 
　　二).设计首页的版面 
　　在功能模块确定后，开始设计首页的版面。就象搭积木，每个模块是一个单位积木， 
如何拼搭出一座漂亮的房子，就看你的创意和想象力了。 
　　设计版面的最好方法是：找一张白纸，一支笔，先将你理想中的草图勾勒出来，然 
后再用网页制作软件实现。 

　　三).处理技术上的细节　　　 
　　阿捷经常收到的来信问题就是：我制作的主页如何能在不同分辨率下保持不变形， 
如何能在IE和NC下看起来都不至于太丑陋，如何设置字体和链接颜色....等等,阿捷将 
在下面几篇文章里为大家详细介绍。 

　　首页设计是整个网站设计的难点和关键，阿捷希望能够通过和大家的交流，总结出 
一套较为合理易学的设计方法，从而举一反三，使我们能够更加轻松的完成整个站点的 
设计制作。

版面布局的原理 
设计首页的第一步是设计版面布局。 
就象传统的报刊杂志编辑一样，我们将网页看作一张报纸，一本杂志来进行排版布局。 
虽然动态网页技术的发展使得我们开始趋向于学习场景编剧，但是固定的网页版面设计基础 
依然是必须学习和掌握的。它们的基本原理是共通的，你可以领会要点，举一反三。 

版面指的是浏览器看到的完整的一个页面（可以包含框架和层）。因为每个人的显示器 
分辨率不同，所以同一个页面的大小可能出现640*480像素,800*600像素,1024*768像素等不 
同尺寸。 

布局，就是以最适合浏览的方式将图片和文字排放在页面的不同位置。 
你可能注意到：“最适合”是一个不确定的形容词，什么才是最适合的呢？抱歉的是 
阿捷不能也不可能给您一个完整的正确的答案。就好比有人希望知道成功的秘诀是什么， 
成功者只能建议您用什么方法，什么途径才能最容易获得成功，而不可能有一步成功的 
"秘诀"告诉您。 

我们在设计思考系列文章第四篇讲过站点整体的创意，版面布局也是一个创意的问题， 
但要比站点整体的创意容易，有规律的多。让我们先来了解一下版面布局的步骤： 

一.草案 

新建页面就象一张白纸，没有任何表格，框架和约定俗成的东西，你可以尽可能的发挥 

上一页  [1] [2] [3] 下一页