《SEO在网页制作中的应用》视频笔记

学习了慕课网《SEO在网页制作中的应用》视频，今天将里面的知识整理一下。

一、SEO介绍

　　1.  搜索引擎工作原理

　　搜索引擎现在主流有百度、谷歌、360，他们都有庞大的搜索引擎数据库，每个关键字对应很多网址，搜索引擎爬虫从一个链接到另一个链接，分析提炼其中的内容，找到关键字，如果是重要的或是首次出现的内容，就会添加到搜索引擎数据库，如果是垃圾内容或是重复内日你给，爬虫就会略过。当用户（比如在百度）搜索信息时，搜索引擎就从数据库检索出与之相关的网址，然后展示给用户，因为一个关键字可以对应很多网址，所以就会出现排序的问题。如果是爬虫看得懂的语言，爬虫可以准确理解网页的内容，就会被爬虫收录。怎样使用爬虫看得懂的语言，就是今天要讲的SEO。

　　2.  SEO简介

　　SEO是由英文Search Engine Optimization缩写而来， 中文意译为“搜索引擎优化”。

　　SEO是为了提升网页在搜索引擎中的收录数量，以及排序位置而做的优化行为。其实就是让百度、谷歌等搜索引擎多多收录我们精心制作的网站，同时在用户搜索相关内容时，网站链接就排在搜索引擎的前面。

　　3.  SEO分类

　　白帽SEO。起到改良、规范网站设计的作用，使之对搜索引擎和用户更加友好，并且网站也可从搜索引擎中获取更多合理的流量，这是搜索引擎鼓励和支持的。我们说的SEO就是白帽SEO。

　　黑帽SEO。利用、放大搜索引擎的缺陷，来获得更多用户的访问量。这类行为大都是欺骗搜索引擎。这是搜索引擎反对的。

二、网站内容的SEO

1. 对网站的标题、关键字、描述进行精心设计。反应网站定位，让搜索引擎明白网站是做什么的。
2. 网站内容优化。增加关键字的密度，增加长尾关键字。
3. 在网站合理设置Robot.txt文件。
4. 生成针对搜索引擎友好的网站地图。
5. 增加外链使用。

三、前端攻城师与SEO

　　网站结构布局优化

　　合理规划站点结构。我们提倡扁平化结构。

1. 控制首页链接数量。网站首页是权重最高的地方，太多或太少都不行，对于中小型企业，首页链接控制在100个以内，链接的性质可以包括页面导航、底部导航、锚文字链接等，前提要有良好的用户体验。
2. 扁平化目录层次。尽量让小蜘蛛跳转三次就可到达网站内任何一页。
3. 导航SEO优化。主要有主导航、副导航、面包屑导航，导航一般以文字方式为主，如果用img，要加title和alt属性。面包屑导航可以让用户知道当前所处的位置，以及当前页面在整个网站中的位置，有返回各个阶层的入口，方便用户操作。
4. 注意网站加载速度，太慢的加载速度是留不住用户的。控制页面的大小，一个页面最好不大于100k，太大影响页面加载速度。

　　网页代码优化

1. <title>标题。强调重点即可，把重要的关键词放在前面，不要重复出现，每个页面的title不要设置相同的。
2. <meta keywords>关键词。列举出几个重要关键词即可，不要过分堆砌。
3. <meta description>网页描述。要高度概括网页的内容，不要太长，也不要过分堆砌关键词。每个页面description也要有所不同。

　　网页代码提倡语义化代码。html每个标签都有它的意义，在适当的位置用适当的标签，更好的让用户和搜索引擎都一目了然。

1. <ul>标签多用于无序列表。
2. <ol>标签多用于有序列表。
3. <dl>标签多用于定义数据列表。
4. <em>、<strong>标签表示强调。
5. <a>标签。要加title说明，对于指向其它网站的链接，要加上rel="nofollow"，表示告诉小蜘蛛不要爬向这个链接，如果爬向这个链接，就不一定能回来了。
6. <h1>标签。标题要用<h1>标签，因为小蜘蛛认为h1的内容是最重要的，正文标题肯定要用h1，字体大小用css调整。副标题用<h2>，其它不重要的地方就不要用h标签了。
7. <p>标签用于正文段落。
8. <br>标签。只能用于文本内容的换行，不能直接用于标签的换行。比如下面这样：

   <div>
   <span>title</span><br>
   <span>item1</span><br>
   <span>item2</span>
   </div>
   
   上面这么用<br>标签是不对的，要这样用：
   
   <p>
   文本第一行<br>
   文本第二行<br>
   文本第三行
   </p>
   
   或是：
   
   <p>文本第一行</p>
   <p><br></p>
   <p>文本第二行</p>

9. <table>标签。要用<caption>定义表格名称。
10. <img>标签。要加alt属性。
11. <strong><em>和<b><i>标签。

　　<strong>标签是权重标签的代表，在搜索引擎中能够得到高度重视，它能突出关键词，表现关键的内容。<b>标签在浏览器中显示效果和<strong>是一样的，但是在SEO中并不会起到很好的效果，所以还是推荐使用<strong>标签。

　　<em>和<i>标签在浏览器中表现为斜体，意思也是强调主体内容，吸引用户关注，它们的权重仅次于<strong>。

　　如果在网页上仅仅表现为加粗斜体的效果，建议使用<b><i>标签，如果使用<strong><em>就会影响到SEO的效果。

　　如果是为了强调文字内容，则建议使用<strong><em>标签。

　　tips：

1. 把重要内容的html代码放在最前面。小蜘蛛的抓取是从上到下，利用这一特点可以优先读取重要代码，将广告等不重要的代码放在下面。
2. 重要内容不要用js输出。
3. 尽少使用iframe框架。
4. 谨慎使用display:none;。对于暂时不想显示的文字，可以用z-index等方法，将其设置在浏览器显示范围外，因为小蜘蛛会过滤掉display:none;里面的内容。
5. 不断精简代码。能用一个标签完成的事就不要使用两个标签。
6. 正文段落中尽量不用&nbsp;编码，可以使用margin、padding、text-indent。

欢迎留言~