已淘宝为例

title 搜索引擎在抓取网页时，最先读取的就是网页标题。title一般不超过 80 个字符，而且词语间要用英文 “-” 隔开，因为计算机只对英语的敏感性较高，对汉语的敏感性不高。

description 关键词，列举出几个页面的重要关键字即可，不用写太多

keyword 网页描述，高度概括页面，不用太长，每个页面区别开。根据权重大小，最重要的内容往前放。

语义化的HTML代码，符合W3C规范：语义化代码让搜索引擎容易理解网页。

什么是HTML语义化，我的理解是： 用最恰当的标签来标记内容。通俗的说，就是告诉你：“这是一个一级标题或二级标题”，“这是一个段落”，“这是头部”，“这是一个导航栏”，并不会告诉你：“这是红色的”，“这个有多么宽，多么高”。标题脱了CSS这层外衣，它还是一个标题。这就是简单的HTML语义化：表现网页的结构。语义化的HTML元素指的是那些使用最恰当的HTML进行标记的内容，在标记构成中并不关心内容显示。语义化的HTML是构建有效网站的基石。

比如：h1-h6 用于设置标题，nav用于设置页面导航。

• 尽可能少的使用无语义的标签div和span；
• 在语义不明显时，既可以使用div或者p时，尽量用p, 因为p在默认情况下有上下间距，对兼容特殊终端有利；
• 不要使用纯样式标签，如：b、font、u等，改用css设置。
• 需要强调的文本，可以包含在strong或者em标签中（浏览器预设样式，能用CSS指定就不用他们），strong默认样式是加粗（不要用b），em是斜体（不用i）；
• 使用表格时，标题要用caption，表头用thead，主体部分用tbody包围，尾部用tfoot包围。表头和一般单元格要区分开，表头用th，单元格用td；
• 表单域要用fieldset标签包起来，并用legend标签说明表单的用途；
• 每个input标签对应的说明文本都需要使用label标签，并且通过为input设置id属性，在lable标签中设置for=someld来让说明文本和相对应的input关联起来。

（1）header元素

header 通常包含h1-h6元素 或 hgroup，作为整个页面或者一个内容块的标题。也可以包裹一节的目录部分，一个搜索框，一个nav，或者任何相关logo。

整个页面没有限制header元素的个数，可以拥有多个，可以为每个内容块增加一个header元素

使用注意：

• 可以是“网页”或任意“section”的头部部分；
• 没有个数限制。
• 如果hgroup或h1-h6自己就能工作的很好，那就不要用header。

（2）footer元素

footer 代表“网页”或“section”的页脚，通常含有该节的一些基本信息，譬如：作者，相关文档链接，版权资料。如果footer元素包含了整个节，那么它们就代表附录，索引，提拔，许可协议，标签，类别等一些其他类似信息。

使用注意：

• 可以是“网页”或任意“section”的底部部分；
• 没有个数限制，除了包裹的内容不一样，其他跟header类似。

（3）hgroup元素

hgroup元素代表“网页”或“section”的标题，当元素有多个层级时，该元素可以将h1到h6元素放在其内，譬如文章的主标题和副标题的组合

使用注意：

• 如果只需要一个h1-h6标签就不用hgroup
• 如果有连续多个h1-h6标签就用hgroup
• 如果有连续多个标题和其他文章数据，h1-h6标签就用hgroup包住，和其他文章元数据一起放入header

（4）article元素

article 代表文档、页面、应用程序、或网站中一个独立的、完整的、可以独自被外部引用的内容，它可以是一篇论坛帖子、一篇文章、一篇新闻报道、一篇博客文章等任何独立的内容块，它通常有自己的标题、页脚等。因此，article元素里面可包含独立的 header、footer 等结构化元素。

使用注意：

• IE 8 以及更早的版本里不支持 article 标签
• 主要是布局文章、内容方面内容

（5）section元素

section 用来定义文档的某个区域（如：章节、页眉、页脚或者文档的其他区域）。section 标签和 div 标签不一样，不是用来定义局域样式的，而是用来定义一个明确的主题，通常含有一个标题（h1~h6）。

使用注意：

• IE 8 以及更早的版本里不支持 section 标签
• section 的作用是对页面上的内容进行分块，如各个有标题的版块、功能区或对文章进行分段，应当在有标题（h1~h6）和内容的时候使用，但文章中推荐用 article 来代替
• 一条简单的准则是，只有元素内容会被列在文档大纲中时，才适合用section元素
• 不要简单地将section用作样式化钩子。不是一个专用来做容器的标签，如果仅仅是用于设置样式或脚本处理，将div（块级）和span（非块级）。
• 如果、、e或在语义上更加适合你的内容，不要使用section
• 不要使用section，除非它自身有一个标题

article、section

拿报纸举个例子：

一份或一张报纸有很多个版块，有头版、国际时事版块、体育版块、娱乐版块、文学版块等等，像这种有版块标题的、内容属于一类的版块就可以用包起来。

然后在各个版块下面，又有很多文章、报道，每篇文章都有自己的文章标题、文章内容。这个时候用就最好。如果一篇报道太长，分好多段，每段都有自己的小标题，这时候又可以用把段落包起来。