SEO 搜索引擎优化

SEO（Search Engine Optimization）：搜索引擎优化。是一种方式：利用搜索引擎的规则提高网站在有关搜索引擎内的自然排名。目的是让其在行业内占据领先地位，获得品牌收益。很大程度上是网站经营者的一种商业行为，将自己或自己公司的排名前移。

上面的是百度百科的解释，通俗来说就是类比淘宝，通过优化关键词、控制上架频率和时间等操作，尽量使得你的宝贝在用户搜索时靠前展示，提高下单率。把宝贝换做网站，那么就是SEO了。

从刚开始web起源的时候，JS还没有这么强大，只能做做提交表单之类的操作，动态页面的内容都在服务器返回页面的时候就已经塞进了HTML结构里，那时候搜索引擎只需要爬取站点拿到一个HTML结构文件然后就可以进行解析、索引和处理。并综合站点信息进行排名。

然后web的发展逐渐前后端分离，出现了HTML模板形式，即前端写好页面，然后交给后端去进行内容填充，就是平常看到的.php和.jsp网页。搜索引擎这时候爬取的仍然是包含内容的文件，所以不影响爬取。

JS逐渐成为网页通用脚本，前后端分离成为主流，再到后面三大框架时代的SPA（单页面）应用，这时候往往搜索引擎爬取站点拿到一个HTML结构文件是一个空内容的数据，内容都是在浏览器端运行的时候通过AJAX从后端取回数据再塞到HTML里。这时候就出现首屏爬取的问题了。

市面上的搜索引擎主要是谷歌、百度、搜狗、必应、360，截至目前能够执行JS并爬取SPA网站内容的只有谷歌，不得不说谷歌真的强大，这也导致了国内没有能够爬取SPA网站的搜索引擎，所以SEO目前还是很有必要做的。

作为一名前端的角度，要做好SEO优化可以：

标签语义化：不能一股脑的统统div带过，除开基础的<head> <body>，p h1 button form以及H5的header nav aside footer section 等都要使用到，特别是a标签许多人都会使用JS进行跳转，这种方式会严重影响爬虫解析。
结构清晰扁平化：清晰的结构能让爬虫快速解析；另外元素不能嵌套过深，影响爬虫解析。
首页链接控制：首页是爬虫进去的第一个页面，链接太少会导致爬虫效率从而影响权重。
善用meta标签：正确使用网站的keywords和description，这就和淘宝搜索的关键词一样，做好了那么同样情况下搜索“碗”，你就是比别人靠前。
增加友链：能够互相增加爬虫跳转形成的访问频率，增加权重

上面只是基础优化，针对静态网页，为了能够适应现代前端的SPA形式网页，前端就显得有局限性了，这时候就需要服务端来解决：

比较容易的是欺骗搜索引擎，当页面请求进来服务器的时候通过请求头和来源域名等判断到请求来自于搜索引擎，然后返回一个完整内容的HTML即静态页面，从而帮助爬虫去解析。
静态化网页内容，比如博客类型站点，因为博客数量不多，可以将所有的文章静态化，协助爬虫爬取。
还有一种是近几年返璞归真的服务端渲染，其实就是支持了现代前端框架（Vue、React）的类似jsp技术，在访问页面的时候首先服务端渲染出这个页面的完整结构和数据，然后返回给前端，并且在浏览器端运行时候也能通过AJAX动态获取网页，能很好地解决SPA应用的SEO问题，相关的技术名字为针对Vue和React的Nuxt和Next 。

如果我做了一个隐私的站点，并不想被任何搜索引擎收录那该怎么办？搜索引擎是遵从robot协议进行网站的爬取，只需要在站点根目录上写好robots.txt文件

User-agent: *
Disallow: /

这样搜索引擎就一律不能够爬取收录这个网站了，更多配置可以参考 robots协议。