⭐ 欢迎来到虫虫下载站！ | 📦 资源下载 📁 资源专辑 ℹ️ 关于我们
⭐ 虫虫下载站
📤 上传资源

📄 00411.htm

📁 网站项目设计的思考 经典
💻 HTM
字号:
🔍 
<html><!-- #BeginTemplate "/Templates/zpxs.dwt" -->
<head>
<title>|&gt;&lt;| 太平洋电脑网 -&gt; 网络学院 -&gt; 设计教室</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">&nbsp;</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">&nbsp;</td>
    <td width="580" valign="top" class="article"> <!-- #BeginEditable "content" --> 
      <p>&nbsp;</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>
      <p align="left" class="sfont">　前言<br>
        　　大家好，我是阿捷。<br>
        　　很荣幸，能在这里和大家一起探讨关于网站设计的问题。目前，网络上有关网页制作的各种教程已经相当多，可以方便地学习到最新的技术和技巧。可是，有关网页的设计,比如设计灵感的实现，风格的确定，发展策略，技术的筛选等的文章却比较少，许多网友往往有好的材料，却苦恼没有好的具有表现力的设计。受到索易主持人的鼓励，阿捷整理了一些网页的设计心得，在这里和大家交流一下，也算抛砖引玉了，希望得到您的指正，如果您有好的建议和心得，也请发稿给我ajie@soim.com,在此先道一声谢谢！<br>
        <br>
        　　网站设计，包含的内容非常多。大体分两个方面：<br>
        　　一方面是纯网站本身的设计比如文字排版，图片制作，平面设计，三维立体设计，静态无声图文，动态有声影像等；<br>
        　　另一方面是网站的延伸设计，包括网站的主题定位和浏览群的定位，智能交互，制作策划，形象包装，宣传营销等等。<br>
        　　这两方面相辅相成（感觉有点象写辨证论文：），加之网络技术的飞速发展，要提出一个绝对正确和权威的设计思路是不可能的，要想在一篇文章中概括出来也很难，所以阿捷根据建设一个网站的思路，将自己几年来网站设计制作的心得整理成一个系列“讲座”，告诉给大家（注意：我并不会非常具体地讲某一个技术或制作技巧，重点在于思路）希望能给您一些帮助。下面是大致的提纲：<br>
        <br>
        1.定位你的网站主题和名称；<br>
        2.定位你的网站CI形象；<br>
        3.确定你的栏目和版块；<br>
        4.网站的整体风格创意设计<br>
        5.网站的层次结构和链接结构<br>
        6.首页的设计<br>
        7.版面布局的窍门<br>
        8.色彩的搭配<br>
        9.效果与速度<br>
        10.替浏览者考虑<br>
        11.细微之处见功力<br>
        12.建设完成度与推出时间<br>
        13.交互性与亲和度<br>
        14.考虑不同的浏览器和分辨率<br>
        15.字体的设置和表格的嵌套<br>
        16.新技术的运用取舍<br>
        17.设计好你的banner和位置<br>
        18.语句文字--融入感情<br>
        19.对网站设计初学者的建议<br>
        <br>
        　　以上是本“系列”文章的提纲，会根据实际撰写情况作些变动。每星期一篇。我们开始之前，首先明确几个前提：<br>
        　　一．网站设计与网站制作。我们说网站“设计”而不是网站“制作”，它们的区别在于设计是一个思考的过程，而制作只是将思考的结果表现出来。一个成功的网站首先需要一个优秀的设计，然后辅之优秀的制作。设计是网站的核心和灵魂，一个相同的设计可以有多种制作表现的方式。<br>
        　　二．我们说的“网站”是指有确定主题和明确目的的实用性站点，不包括纯表现类或者纯文字类网站。<br>
        　　三．在文章中，可能举例说明或点评到某些具体站点。首先申明，阿捷不存在为任何站点作广告的“嫌疑“。<br>
        好了，废话少说，我们进入正题：<br>
        <br>
        ========================================================<br>
        <br>
        一：定位你的网站主题和名称<br>
        <br>
        　　设计一个站点，首先遇到的问题就是定位网站主题。<br>
        　　所谓主题也就是你的网站的题材。网络上的网站题材千奇百怪,琳琅满目。只要你想的到，就可以把它制作出来。下面是美国《个人电脑》杂志(PC Magazine)评出的99年度排名前100位的全美知名网站的十类题材，对我们有一些参考价值。<br>
        　　第1类：网上求职<br>
        　　第2类：网上聊天／即时信息/ ICQ<br>
        　　第3类：网上社区／讨论 / 邮件列表<br>
        　　第4类：计算机技术<br>
        　　第5类：网页/ 网站开发&nbsp;<br>
        　　第6类：娱乐网站&nbsp;<br>
        　　第7类：旅行&nbsp;<br>
        　　第8类：参考 /资讯<br>
        　　第9类：家庭/教育&nbsp;<br>
        　　第10类：生活/时尚&nbsp;<br>
        　　每个大类都可以继续细分，比如娱乐类再分为体育 /电影/ 音乐大类，音乐又可以按格式分为MP3，VQF，Ra，按表现形式分古典，现代，摇滚等。以上都只是最常见的题材，还有许多专业的，另类的，独特的题材可以选择，比如中医，热带鱼，天气预报等等，同时，各个题材相联系和交叉结合可以产生新得题材，例如旅游论坛（旅游+讨论），经典入球播放（足球+影视）按这样分下去，题材可以有成千上万个，你不会再为题材重复，难以选择而烦恼了吧:)<br>
        　　对于题材的选择，我的建议是：<br>
        　　1.主题要小而精。定位要小，内容要精。如果你想制作一个包罗万象的站点，把所有您认为精彩的东西都放在上面，那么往往会事与愿违，给人的感觉是没有主题，没有特色，样样有却样样都很肤浅，因为您不可能有那么多的精力去维护它。网络的最大特点就是新和快，目前最热门的个人主页都是天天更新甚至几小时更新一次。最新的调查结果也显示，网络上的“主题站”比“万全站”更受人们喜爱，就好比专卖店和百货商店，如果我需要买某方面的东西，肯定会选择专买店。再举个例子，我的一位网友KK希望制作文学方面的题材，但是文学也包括许多许多内容，有小说，诗歌，散文；有科幻，武侠，推理；阿捷仔细了解了他的擅长和想要提供的主要内容，最后将题材定位在网络文学上，删除了原有的一些无关的文学作品，集中扩大和整理网络文学作品。网站推出后，很快受到大家的喜爱。<br>
        　　2.题材最好是你自己擅长或者喜爱的内容。比如：您对擅长编程，就可以建立一个编程爱好者网站；对足球感兴趣，可以报道最新的战况，球星动态等。这样在制作时，才不会觉得无聊或者力不从心。兴趣是制作网站的动力，没有热情，很难设计制作出杰出的作品。<br>
        3.题材不要太滥或者目标太高。“太滥”是指到处可见，人人都有的题材；比如软件下载，免费信息。“目标太高”是指在这一题材上已经有非常优秀，知名度很高的站点，你要超过它是很困难的。除非你下决心和有实力竞争并超过它，记住，在互联网上只有第一，人们往往只记得最好的网站，第二第三名的印象则会浅得多。<br>
        <br>
        　　OK，如果你已经有一个绝妙的主意了，那我们开始为网站起名字。（哎呀，别踢我！）您可能认为起名字与网站设计无关，阿捷在这里浪费时间。其实网站名称也是网站设计的一部分，而且是很关键的一个要素。你来看，“电脑学习室”和“电脑之家”显然是后者简练；“迷笛乐园”和“MIDI乐园”显然是后者明晰；“儿童天地”和“中国幼儿园”显然是后者大气。我们都知道PIIICUP的中文名称“奔腾”，如果改为“奔跑”，可能就没有今天这么“火”了:)。和现实生活中一样，网站名称是否正气，响亮，易记，对网站的形象和宣传推广也有很大影响。一般的建议是：<br>
        <br>
        　　1. 名称要正。这个“正”是阿捷自己的说法，其实就是要合法，和理，和情。不能用反动的，色情的，迷信的，危害社会安全的名词语句。<br>
        　　2. 名称要易记。根据中文网站浏览者的特点，除非特定需要，网站名称最好用中文名称，不要使用英文或者中英文混合型名称。例如：beyond 
        studio和超越工作室，后者更亲切好记。另外，网站名称的字数应该控制在六个字（最好四个字）以内，比如“XX阁”“XX设计室”，四个字的可以用成语，如“一网打进”。字数少还有个好处，一般友情链接的小logo尺寸是88X31，而六个字的宽度是78左右，适合于其他站点的链接排版。<br>
        　　3. 名称要有特色。名称平实就可以接受，如果能体现一定的内涵，给浏览者更多的视觉冲击和空间想象力，则为上品。这里举几个阿捷认为很好的名称：音乐前卫，网页陶吧，天籁绝音。在体现出网站主题的同时，能点出特色之处。<br>
        <br>
        　　总之，定位题材和名称是设计一个网站的第一步，也是很重要的一部分。如果能找到一个满意的名称，花一天时间翻字典也是值得的:)<br>
        　　好，今天的心得就写到这里。因为是第一篇，所以如果您对本系列讲座形式有任何建议，请速来信告诉阿捷，以便阿捷作相应更改。如果您有更好的心得，也请来信，阿捷会择优发表。谢谢大家！下次我们讨论的主题是“定位你的网站CI形象”。</p>
      <p align="center" class="sfont"><a href="00412a.htm">下一篇</a></p>
      <p align="center"><a href="index3.htm">[返回]</a></p>
      <!-- #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>
    版权所有&copy;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 + -