张栋伟，资深IT营销&评论人士

文章来源：91自学网 www.91zixue.com 转载请注明出处 谢谢

1网站3大要素，文字，图片，链接

目前为止互联网上新的网络应用层出不穷。从过去的论坛到博客，再到现在的社会性网络服务。各类网站基本还都没有跳出“文字，图片，链接”这3大要素。在读者初次设计一个网站之前，一般都要先找到一个设计的基调。要先想好以什么为主体构造，只有这样在优化时不会产生手忙脚乱，为实现某某功能而再次打乱网站的结构。

 

新浪刘德华主题栏目-以链接构建为主的设计 网址 http://ent.sina.com.cn/s/h/f/ldh.html

（图14-1）

 

（图14-2）百度百科刘德华主题-以文字为主的构建设计  http://baike.baidu.com/view/1758.htm

 

（图14-3）我秀明星网刘德华主题-以图片为主的构建设计  http://www.5show.com:801/indexSrc/subsite/special/subject/0/star-200708079207.html

当然，考虑到网页的美观与实用性不会有网站绝对使用某一种构建元素。更多的是综合使用3大网页元素。作为网站设计的初学者，开始实际建设网站前一定要做到心里有数才成。

2搜索引擎喜爱的文字

讨论搜索引擎喜爱的文字前，先要理解什么是网页质量。网页质量是看描述的内容是否大量与其他网页重复，还看描述主题的文字是否具体。在搜索引擎数据库里，搜索引擎可以为每张网页建立一个特征标识，用来衡量那些网页是新近出现在互联网的。关于这个很好理解，例如神州七号火箭升空的新闻事件，互联网上充斥着大量新闻和消息，网民在网上搜索想知道最新的进展情况，从发射前到发射升空，再到出舱行走，最后返回地面。网民希望得到的是时时的进展消息，搜索引擎不能到宇航员都出舱了，给网民返回自然列表的页面依然是火箭等待发射，那样的话去搜索消息的意义就失去了。而前面的章节也讨论过，搜索引擎是模拟人的思维方式，为搜索者提供良好的搜索体验。同样合理撰写主题也很重要，网页内容必须围绕关键词来撰写。力争每个网页内容都是与众不同的，换句话说文章越是原创的越有竞争力。做到与众不同需要对产品的深入了解，同时也要考虑写作技巧。

3关键词密度与分布

关键词的密度是指关键词在一个网页中曝光的次数。在对网页质量章节我们讨论过，网页内容要围绕关键词去写。这样的写作方式seo工作者就不得不增加关键词出现的频率。有测试表明关键词出现的频率最好在2%~8%左右，这个频率最被搜索引擎数据计算适应。超过这个频率有可能遭到搜索引擎惩罚。

4语义化你的html标签

分离的结构和表现的一个作用就是可以用语义化的标签来标识文档的内容。在半结构化的xhtml代码里每个标签都有他代表的独特意义。在现实生活中人脑可以轻易的分辨出网页上文章标题和小节标题的区别，但是当下搜索引擎技术还不成。如果网页上所有文字都是用

做标签的话，搜索引擎可能真的很难分辨不出来文章真实的主题内容是那段文字。

关于标签的语义化的理解有方面。第一面是面向浏览者方便阅读的语义化，这个主要是在使用浏览器阅读网页的时候给予文字以特殊标识，使浏览者更容易分辨出那些是网页文字的重点内容，以便于更方便的阅读。第二方面是面向搜索引擎分析所用的语义化处理，友好的语义化标签能使搜索引擎更好的抓取和分析网页上的内容。如果说让网页能够跟搜索引擎尽可能深入交流的话，那么对网页标签进行语义化处理是再好不过了。

下面我们来讨论关于语义化的内容。

、

、

、

、

、

,作为标题标签，并且依据重要性递减。

是最高的等级。

例如

主标题

次标题

而不要使用


搜索引擎是不能分清楚谁是主标题，谁是副标题的。

段落标记，知道了

作为段落，你就会放弃用
来换行了，而且不需要

来区分段落与段落。

中的文字会自动换行，而且换行的效果优于
。关于搜索引擎方面

代表定义主题文字，

内的文字会被搜索引擎认为是网页上的描述主要内容文字区。

例如

HTML3.0规范是由当时刚成立的W3C于1995年3月提出，提供了很多新的特性，例如表格、文字绕排和复杂数学元素的显示。

虽然它是被设计用来兼容2.0版本的，但是实现这个标准的工作在当时过于复杂，在草案于1995年9月过期时，标准开发也因为缺乏浏览器支持而中止了。

、
、

1. 无序列表标签，
   有序列表标签也是经常使用到的。在web标准化过程中，
   还被更多的用于导航条，这样做是完全正确的，而且当你的浏览器不支持CSS的时候，导航链接仍然很实用。另外还有一个好处是
   的代码相对而言比较少，对网页下载十分有利。在此并无其他含义。

   例如
   

   
      
   • 项目一
   
      
   • 项目二
   
      
   • 项目三
   
   
   
   例如
   
   
      
   1. 第一章
   
      
   2. 第二章
   
      
   3. 第三章
   
   

   
   

   、

   、

   dl就是“定义列表”。现在来对无序列表标签和有序列表标签语义化效果进行对比。例1的语义化后代表列表的标题是dog，描述的内容是A carnivorous mammal of the family Canidae.
   例2的语义化后代表列表的标题是《大话西游》剧情点评，描述的内容是我面对的，是一部痛彻心肺的喜剧.寓言篇故事已然存在，已然不可避免。 在深切的郁闷中来到了二十来岁，突然就看懂了《大话西游》的开头：一位才华横溢又无法无天的青年（孙悟空），根本不喜欢世人摊派给他的大事业（西天取经）。他尤其受不了师父（唐僧）的唠唠叨叨，可世俗条规（观音）又不放过他。为让他悔悟，心甘情愿地去取经，唐僧和观音达成妥协：让他五百年后重新做人。

   例如1
   

   
   

   Dog

   
   

   A carnivorous mammal of the family Canidae.

   
   

   例如2
   

   
    

   《大话西游》剧情点评

   
      

   我面对的，是一部痛彻心肺的喜剧.寓言篇故事已然存在，已然不可避免。

   
      

   在深切的郁闷中来到了二十来岁，突然就看懂了《大话西游》的开头：一位才华横溢又无法无天的青年（孙悟空），根本不喜欢世人摊派给他的大事业（西天取经）。他尤其受不了师父（唐僧）的唠唠叨叨，可世俗条规（观音）又不放过他。为让他悔悟，心甘情愿地去取经，唐僧和观音达成妥协：让他五百年后重新做人。

   
   

    

   、

   是用作强调的，是用作重点强调的。大部分浏览器用斜体显示强调的内容，用粗体来显示重点强调的内容，如果是为了确定强调内容的显示方式，最好的方法就是使用CSS来定义他们的表现。当你想要的只是视觉上的效果时，就不要使用强调了。而且如果你想要强调但是还觉得粗体或者斜体不视觉效果没那么好，那么你完全可以定义一些其他的比较醒目的样式达到强调的效果。但是，要面对搜索引擎和的标签就大有用处，适当使用、标签可以突出网页内关键词是什么，是seo工作的首选标签。

   
   例如
   强调 的文本通常用斜体显示，
   特别强调 的文本通常以粗体显示。

   
   

   、标签为表格头部，标签为表格主体内容，标签为表格尾部。其中还可以使用scope 可用于取代headers属性，标记含有表头信息的单元格，其中各数值的内容如下：
   　row 指示当前单元格，为包含当前单元格的行提供相关的表头信息。
   　col 指示当前单元格，为根据当前单元格指定的列提供相应的表头信息。
   　rowgroup 指示当前单元格，为包含当前单元格的其余行组提供相关的表头信息。
   　colgroup 指示当前单元格，为根据当前单元格指定的其余列组提供相应的表头信息。
   abbr 用于定义表头单元格中的缩写名，如果没有定义该属性，则将默认单元格内容为节略形式。

   对于浏览者可能是永远不会看到这个标签的，但对于搜索引擎来说这些标签都是真实有用的，例如

   又类似

   的作用。读者看到这里大概已经发觉了语义化的标签含义是相通的。

   例如

   标签为首部说明，

   、	、< caption >、 summary XHTML中的表格标签不光是用来布局的。	为表格标题，属性summar为摘要，
   语义化的含义与语义化的含义是基本相同的，

   
   
    
      

      

   
      
   
    
    
      
      

      

   
      
    
    
      
      
      

      

   
    
    
      
      
      
      

    

   
    
      
      
      
      
    

   Table 1: Power Mac G5 tech specs

   Configurations	Dual 1.8GHz	Dual 2GHz	Dual 2.5GHz
   Model	M9454LL/A	M9455LL/A	M9457LL/A
   G5 Processor	Dual 1.8GHz PowerPC G5	Dual 2GHz PowerPC G5	Dual 2.5GHz PowerPC G5
   Frontside bus	900MHz per processor	1GHz per processor	1.25GHz per processor
   Level2 Cache	512K per processor	512K per processor	512K per processor

   
   

   < title>

   title属性用来为元素提供额外说明信息title属性可以用在除了base，basefont，head，html，meta，param，script和title之外的所有标签。关于标签的用法前面的章节讨论过，一张图片上绘画的图案或者名称搜索引擎是抓取不到的，所以在图片上使用alt标签已经为图片增加一段描述的文字，在这里标签的作用就类似于

   的作用。