如何做好SE0

SEO，也就是搜索引擎优化，是一个老生常谈的问题，对于做技术的人往往比较忽视这个问题，因为觉得”简单“没有技术含量，但是对于很多中小企业来说又是一个十足的刚需。大概每年都会接到不少朋友的电话，哎~~ 哥们，网站你都不帮我做了，SEO总得帮帮哥们吧，我这新做的网站百度搜不到啊。对于这样的问题大部分的回答都是：“如果你想立竿见影地赚钱，那就老老实实的给各位搜索引擎公司缴足保护费。”但是这样的回答往往都很伤朋友感情，因为似乎是一种敷衍。所以就打算写一篇有关SEO的文章系统地说明一下SEO。

给各位引擎大哥交费固然是最佳推广方式，但是这里存在一个问题那就是对于大部分普通小公司是受不了大范围的关键字推广的烧钱，再者关键字的推广有限，对于很多比较精明的浏览者会在搜索结果中直接无视广告类搜索结果。显然付费推广之外，一家企业如果希望自己的网站能够拥有较高的用户浏览量是要做好额外的功夫。

在进行搜索引擎优化之前，首先要了解搜索引擎的“爬虫”是如何工作的。

所谓爬虫就一组由搜索引擎发出的网络机器人，他们会每天发现和更新全网内容。无论是网络页面/音视频还是PDF，它们最终被检索到都是通过链接发现。

以Google为例，爬虫会从几个大型页面开始，然后不断搜索页面中包含的超链接然后不断扩展，把新搜到url放置到Caffeine数据库中。

对于新开设的网站你首先得确认你的网址是否已经被搜索引擎所收录，如果搜索引擎没有收录，后面的工作就可以不用做了。方式很简单，找到任一搜索引擎输入site:yourdomain.com (你的网址)。如果没有，就要主动提交给搜索引擎。百度会引导你去百度站长哪里提交网址，而Google的则是Google Search Console。通常这些搜索引擎都会给你一个验证链接放入网页中或者验证html文件放入网站根目录中，验证成功之后在24小时之内搜索引擎便会将网址收录其中。

比如以腾讯云为例，它的网站就针对了国内主流的搜索引擎进行了如下验证：

<meta name="baidu-site-verification" content="Yqh6LFzxHs">
<meta name="sogou_site_verification" content="j0R8AKzqAJ">
<meta name="google-site-verification" content="P8iDSYbE4VrjAChnoh_9k3LwsPJt9m614Nn5_fMhsuo">
<meta name="360-site-verification" content="79a4c7ed94a9bec6d181e125c65cc6aa">
<meta name="shenma-site-verification" content="d33db0ae4613f827196c6e785aaeee4d_1509506173">
复制代码

在做完引擎收录工作之后，几乎所有人想到的就是关键词优化了，在这个阶段很多人想到的就是利用标签在keyword和description两个属性中疯狂地添加跟自己行业相关的关键词。再跑去各种垃圾网站上疯狂的挂外链。但是我必须在这里强调：没！有！卵！用！现代搜索引擎的算法早已视标签为垃圾信息来源，在爬虫爬数据的时候都会绕过标签。而挂外链的行为在稍微正规的网站上几乎等同于封号作死。

那么问题来了，如何引导爬虫爬到我想要喂他的关键词？这就需要了解爬虫的算法行为。首先记住一条就是爬虫只会第一时间爬去服务器生成的静态HTML，前端动态生成的网站对于爬虫来说就是一张白纸。对于HTML，爬虫会优先遍历最外层的文本字符串。比如我们看下下面的一段代码：

<div class="container">
  <div class="row">
    <div class="col-md-3">
      原价只要200元，300元的皮包，
    </div>
    <div class="col-md-3">
      统统只要20块
    </div>
  </div>
</div>
<p>江南皮革厂老板黄鹤带着他的小姨子跑了</p>
复制代码

我们都希望搜索引擎给到用户的是”原价只要200元，300元的皮包，统统只要20块“商业信息，网页排版上也是排在前面，但是搜索引擎给到用户很有可能的就是”江南皮革厂老板黄鹤带着他的小姨子跑了“这样的垃圾信息。这里的原因就在与爬虫在遍历的过程中优先收录了是HTML中嵌套在最外层的中文字符。

那么除了嵌套之外，HTML还有什么敏感信息会被搜索引擎作为关键字抓取？这里就要用到HTML5的新标签

。对于标签来说往往就是一家公司的产品目录或者导航信息，对于一家公司来说很难利用该标签填充垃圾信息，所以在给公司目录起名字的时候就要想好这里的每一个字都是搜索引擎的SEO关键字优化。

提示：在使用网络通信协议上，http/2 的网站通常会排在https之前，而https的网站会排在http之前，所以即使是一个普通的静态网站也请务必使用安全通信。

他山之石可以攻玉，四两如何拨千斤

在这篇文章开头简单地介绍了爬虫的工作原理，知道了所有的爬虫都是通过超链接进行爬取信息。那么既然乱挂外链是一项走不通的行为，那么如何合理合法利用别人的平台来引入爬虫呢？

这里就需要真心做好网站的人去下一番苦功夫了，要知道搜索引擎的诞生并非只是用于关键词的搜索，更重要的是对问题的回答。搜索引擎为了凸显自己存在的社会价值和市场价值，对于问题的搜索结果永远都是第一时间推送权（dang）威 (ran) 平 (ye) 台 (you) 的 (che) 答 (dan)案。如在Google中搜索问题，排在前头的往往是wikipedia,stackoverflow。在搜狗上问排在前头的是知乎，在百度搜索出现的往往是百度百科，百度知道等等。如果你能够给予这些平台一些高质量的答案，很明显你的答案会拥有非常高的网络流量，作为作者的你同时拥有答案的著作权，你完全有理由给出答案的原文链接，而这个链接就出自你想要被SEO优化的网站。记住一点，用户点不点超链接没关系，重要的是爬虫能每天能爬到。

你以为这就完了？

如果到这里就结束了，那这篇文章和外面那些《7天教你速成SEO》，《SEO你也行》就没啥区别了。人为的SEO优化和不断进步的搜索算法是一场永不停息的博弈。但是无论博弈的形式有何不同，搜索引擎他要给用户提供最优的网页的初衷是不会变的。

对于移动端的兼容和首屏渲染的速度现如今也纳入搜索引擎排名的评测体系中，搜索引擎有超过50%以上的流量的来自于移动端，不能支持移动端在移动端的搜索引擎排名上会第一时间被抛弃。比如我们可以通过Google移动端测试工具【请科学上网】 对网站进行移动端兼容测试。如果不兼容则需要开发人员进行立即调整。

网页的打开速度也是SEO一个重要关键点，对于搜索引擎来说，更快的获取网页快照这是非常重要的一个规定收录动作，如果此时您的网站3秒之后还在白屏那么在搜索引擎中排名结果就可想而知。很遗憾的是，我遇到的很多朋友花几千块买的网站都是死在这个问题上。

花哨的网站 ≠ 好网站

我几乎所有的周边做生意的朋友都跟我提起，哎~你知道吗我遇到一个800块可以一键生成网站，1000块可以选一个模板的网站。好便宜啊。对于这样的说法，我给朋友的回答都是bullshit。朋友往往回反驳我哪里shit了，这不看起来挺漂亮的吗？你不能以互联网的公司标准来要求我一个小庙。

其实一个很简单的道理就能理解，国产陆风和路虎拥有一样的外观，你会觉得那是一个类型的车吗？因为你很清楚它们之间的天壤之别正是在你看不见的引擎盖下。网站亦是如此。我们可以借助Google性能测试 来测试一个网站性能，这时你就会发现那些一键生成的网站或者模板大多都会在3秒之后才能打开，这在9012年的搜索引擎标准和用户标准这里都是让人无法接受的。这里面的原因就在于这类公司为了产品卖相好看，会疯狂的在模板上堆砌各种高清无码大图，对于不懂行的买家会产生非常爽的感官刺激，觉得漂亮酷炫，但是这些真不是一个好网站。因为图片占到了带宽的60%，是网站卡壳的主要罪魁祸首，网站打开速度超过3秒，70%的用户就会选择关闭另选网站。那些看起来漂亮的图片正是赶走你客户的门童。

对于网站的首屏渲染中图片优化有很多种方案，每一种方案都会有自己的优缺点，可以说仁者见仁智者见智，没有标准统一答案在这里我只是简单介绍几种常见的：

1. 利用background-color现行填充，然后在使用PNG透明图片加载点缀。

这种方式常用于首页大块图片展示上，好处在于避免了大片图片的加载，即使用户处于低网速的情况下，网站的整体布局和设计会第一时间展示，PNG图片的加载在最后才起到点缀作用，同时对于爬虫爬取网页内容也十分友好。

2. 使用Webp图片格式

WebP是由Google在2010年推出的图片格式，他同时提供有损压缩和无损压缩两种模式。在相同清晰度下，WebP比起PNG格式文件要减少45%的文件大小。但是很遗憾，并非所有的浏览器都兼容WebP格式文件，至今WebP也非主流图片格式。

所以在使用WebP图片加速网页加载的时候，我们通常选择双图片模式。

#pic {
  background: image("douni.webp", "douni.jpg");
}
复制代码

3. 高低分屏

这是一个流传已久的古老方式，针对普通浏览器和高清屏幕做不同的图片渲染。

<img alt="my awesome image"
  src="banner.jpeg"
  srcset="banner-HD.jpeg 2x, banner-phone.jpeg 375w, banner-phone-HD.jpeg 375w 2x">
复制代码

3. 渐进式

我们前面提到的是针对普通的网页，尤其是第一种利用background-color现行填充的方式是针对对设计要求不高的网页。但是对于很多对图片设计要求非常高的网站，上面的几种方式往往都是不可行的。比如一家建筑设计公司或是美术公司。这些公司要求我就是要展示高清无码大图，我就是要用户一点开，我的图片就要完整的显示出来。这里就需要渐进式的加载方式，这种效果很多人都见过，就是开局一张模糊图，然后随着时间推移慢慢清晰。

这里我们就要借助photoshop工具完成，在PS软件中选择文件/导出/保存为WEB格式，然后在勾选【连续】选项导出即可。当然这种方式也不是没有缺点，那就是文件大小反而大了20%。

说了这么多有关于SEO方面的东西，其实坦白来说一篇文章远远涵盖不了SEO全方位的知识，更多的还是要靠网站持有人能够用心去给中文互联网传递有价值的信息。创造价值，才是互联网发展的核心所在。