📄 00413a.htm
字号:
<html><!-- #BeginTemplate "/Templates/zpxs.dwt" -->
<head>
<title>|><| 太平洋电脑网 -> 网络学院 -> 设计教室</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style type="text/css">
<!--
-->
</style>
<link rel="stylesheet" href="/pcedu/style/text.css"></head>
<body bgcolor="#FFFFFF" topmargin=0 leftmargin=0 marginheight="0">
<script language="JavaScript" src="/pcedu/script/top.js">
</script>
<table width=760 border=0 cellspacing=0 cellpadding=0 align=center>
<tr>
<td width=194 height="56"><a href=http://www.pconline.com.cn><img src=http://www.pconline.com.cn/images/pconlinelogo.gif width=162 height=35 vspace=10 border=0></a></td>
<td width=406 height="56">
<script language="JavaScript" src="/pcedu/script/sj_ad.js">
</script>
</td>
<td width=158 align=right height="56">
<div align="right">
<script language="JavaScript" src="/pcedu/script/sj_ad1.js">
</script>
</div>
</td>
<td align=right width=2 height="56"> </td>
</tr>
</table>
<table border=0 cellpadding=0 cellspacing=0 width=760 align="center">
<tbody>
<tr valign=bottom>
<td rowspan=2 width=172><a href="/pcedu/"><img height=32 src="/pcedu/images/pcedu_lo.gif"
width=172 border="0"></a></td>
<td height=30 rowspan=2>
<table cellpadding=0 cellspacing=0 width="588" bgcolor="#FFA000" background="/pcedu/images/e_menu4.gif"border="0">
<tbody>
<tr valign="bottom">
<td height="17">
<script language="JavaScript" src="/pcedu/script/title_sj.js">
</script>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr></tr>
<tr bgcolor="#303880">
<td colspan=2 height=1 valign=bottom><img height=1
src="/pcedu/images/blank.gif" width=1></td>
</tr>
<tr>
<td colspan=2 height=5 valign=bottom><img height=5
src="/pcedu/images/blank.gif" width=1></td>
</tr>
</tbody>
</table>
<table width="760" cellspacing="0" cellpadding="0" align="center">
<tr>
<td width="170" valign="top">
<table border="0" width="170" height="100%"
cellspacing="1" bgcolor="#000000">
<tr bgcolor="#F8F8D2">
<td width="100%" valign="top">
<script language="JavaScript" src="/pcedu/script/left_sj0.js">
</script>
</td>
</tr>
</table>
</td>
<td width="10"> </td>
<td width="580" valign="top" class="article"> <!-- #BeginEditable "content" -->
<p> </p>
<p align="center"><b><font size="3" class="coffee">网站设计的思考（三）</font></b></p>
<p align="right">作者：<a href="mailto:fujie@163.net">阿捷</a></p>
<p align="right">出处：<a href="http://pageone.yeah.net" target="_blank">《网页设计师》</a></p>
<table border="0" width="100%" cellspacing="0" cellpadding="0">
<tr>
<td width="2%" height="1125"></td>
<td rowspan="2" height="1125">
<p><b class="green"><span class="sfont">确定网站的栏目和版块</span></b><span class="sfont"><br>
<br>
《设计的思考》系列文章，今天开始写第三篇。阿捷不是专业的网页设计师，但阿捷将尽自己所能把这个系列文章写好，尽可能将自己实践过程中总结的经验和心得告诉给大家，希望能给您一点收获，一点启发。文章中所列观点如有不同意见，欢迎您来信讨论，来信寄ajie@soim.com，谢谢。<br>
<br>
我们在前二篇文章里学习了定位网站主题和确立网站的CI形象。下面是否该进入实质性的设计制作阶段呢？答案是：不能。经验告诉我们，建立一个网站好比写一篇文章，首先要拟好提纲，文章才能主题明确，层次清晰；也好比造一座高楼，首先要设计好框架图纸，才能使楼房结构合理。</span></p>
<p><span class="sfont"> 初学者(包括我自己:-)，最容易犯的错误就是：确定题材后立刻开始制作。当你一页一页制作完毕后才发现：网站结构不清晰，目录庞杂，内容东一块西一块。结果不但浏览者看得糊涂，自己扩充和维护网站也相当困难，您的网站或许就此半途而废，更糟糕的是：你因此失去了制作主页的信心和兴趣！<br>
<br>
所以，我们在动手制作网页前，一定要考虑好以下三方面：<br>
1.确定栏目和版块；<br>
2.确定网站的目录结构和链接结构<br>
3.确定网站的整体风格创意设计</span></p>
<p><span class="sfont"> 今天我们首先来讨论“确定网站的栏目和版块”。<br>
<br>
网站的题材确定后，相信你已经收集和组织了许多相关的资料内容。你一定认为这些都是最好的，肯定能吸引网友们来浏览网站。但是你有没有将最好的，最吸引人的内容放在最突出的位置呢？有没有让好东西在版面分布上占绝对优势呢？</span></p>
<p><span class="sfont"> 我看见许多个人主页的栏目(主菜单)并不是这样的。举个例子：有一个以提供动画素材为主题的站点，它的主栏目是：关于站长，本站导航，动画宝库，本站论坛，本站留言本，联系站长。首页上写着本站网址和版权申明(居然还有将本站设为首页字样)。最主要的，最吸引人的动画素材在主栏目里占1/6，在首页上一字没提。我想即使这个站点的确有大量的，精美的动画素材，也很难吸引浏览者继续挖掘。<br>
<br>
栏目的实质是一个网站的大纲索引，索引应该将网站的主体明确显示出来。在制定栏目的时候，要仔细考虑，合理安排。一般的网站栏目安排要注意以下几方面：<br>
<br>
1.一定记住要紧扣你的主题！<br>
一般的做法是：将你的主题按一定的方法分类并将它们作为网站的主栏目。例如上面的例子，可以将栏目分为动物动画，标志动画，三维动画，卡通动画等，在首页上标明最近更新的动画。记住：主题栏目个数在总栏目中要占绝对优势，这样的网站显的专业，主题突出，容易给人留下深刻印象。<br>
<br>
2.设一个最近更新或网站指南栏目<br>
如果你的首页没有安排版面放置最近更新内容信息，就有必要设立一个“最近更新”的栏目。这样做是为了照顾常来的访客，让你的主页更有人性化。</span></p>
<p><span class="sfont"> 如果你的主页内容庞大(超过15MB)，层次较多，而又没有站内的搜索引擎，建议您设置“本站指南”栏目。可以帮助初访者快速找到他们想要的内容。<br>
<br>
3.设定一个可以双向交流的栏目<br>
不需要很多，但一定要有。比如论坛，留言本，邮件列表等，可以让浏览者留下他们的信息。有调查表明，提供双向交流的站点比简单的留一个"Email
me"的站点更具有亲和力。<br>
<br>
4.设一个下载或常见问题回答栏目<br>
网络的特点是信息共享。如果你看到一个站点有大量的优秀的有价值的资料，你肯定希望能一次性下载，而不是一页一页浏览存盘。“将心比心”在你自己的主页上设置一个资料下载栏目，会得到大家的喜欢。有些站点为了广告显示量，一篇文章还要分几页显示，我觉得迟早会因访问量下降而淘汰(个人意见:)。另外，如果您的站点经常收到网友关于某方面的问题来信，你最好设立一个常见问题回答的栏目，既方便了网友，也可以节约自己更多时间用以学习。<br>
<br>
至于其他的辅助内容，如关于本站，版权信息等可以不放在主栏目里，以免冲淡主题。总结以上几点，我们得出划分栏目需要注意的是：<br>
<br>
●尽可能删除与主题无关的栏目<br>
●尽可能将网站最有价值的内容列在栏目上<br>
●尽可能方便访问者的浏览和查询<br>
<br>
上面说的是栏目，我们再看看版块设置。版块比栏目的概念要大一些，每个版块都有自己的栏目。举个例子：网易的站点分新闻，体育，财经，娱乐，教育等版块，每个版块下面有各有自己的主栏目。一般的个人站点内容少，只有主栏目(主菜单)就够了，不需要设置版块。如果你觉得的确有必要设置版块的，应该注意1.各版块要有相对独立性。2.各版块要有相互关联。3.版块的内容要围绕站点主题。关于版块方面，主要是门户站点等较大ICP需要考虑的问题，阿捷在此<br>
不再作展开讨论。<br>
<br>
好，已经深夜了，今天就写到这。阿捷下次继续和大家探讨如何"确定网站的目录结构和链接结构"，谢谢。<br>
</span> </p>
<p align="center"><a href="00412a.htm">上一篇</a> <a href="00414a.htm">下一篇
</a>
<p align="center"><a href="index3.htm">[返回]</a>
</td>
<td width="1%" height="1125"></td>
</tr>
<tr>
<td width="2%"></td>
<td width="1%"></td>
</tr>
<tr>
<td width="2%"></td>
<td width="97%" align="center"> </td>
<td width="1%"></td>
</tr>
<tr>
<td width="2%"></td>
<td width="97%" align="center"> </td>
<td width="1%"></td>
</tr>
</table>
<!-- #EndEditable -->
<table width="100%" border="0">
<tr class="sfont">
<td>
<div align="center"><a href="javascript:history.go(-1)">[返回]</a> </div>
</td>
</tr>
</table>
</td>
</tr>
</table>
<hr noshade size="2" width="760">
<p align="center">
<script language="JavaScript" src="/pcedu/script/title_edu.js">
</script>
<br>
版权所有©2000 太平洋电脑网<br>
<font face="Arial, Helvetica, sans-serif"><a href=mailto:webmaster@pconline.com.cn>
<script>
document.write("<a href=http://best.netease.com/cgi-bin/view/viewbasic.cgi?exp target=_blank><img src=http://best.netease.com/cgi-bin/log.cgi?user=exp&refer="+escape(document.referrer)+"&cur="+escape(document.URL)+" border=0 alt='网易中文排行榜' width=1 height=1></a>");
</script>
</a></font><font face="Arial, Helvetica, sans-serif"><a href=mailto:webmaster@pconline.com.cn>webmaster@pconline.com.cn
<script language="">document.write("<a href=http://best.netease.com/cgi-bin/view/viewbasic.cgi?pconline1 target=_blank><img src=http://best.netease.com/cgi-bin/log.cgi?user=pconline1&refer="+escape(document.referrer)+"&cur="+escape(document.URL)+" border=0 width=1 height=1 ></a>");</script>
</a>
<script language="">
document.write("<a href=http://www0.pconline.com.cn:8810/pccount/index.php target=_blank><img src=http://www0.pconline.com.cn:8810/cgi-bin/test.cgi?user=pcedu&refer="+escape(document.referrer)+"&cur="+escape(document.URL)+" border=0 width=0 height=0 alt='' ></a>");
</script>
</font></p>
</body>
<!-- #EndTemplate --></html>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -