使用vue后怎么针对搜索引擎做SEO优化？( 二 ) _SEO优化

标题要主题明确和精练，包含这个网页中最重要的内容，且不罗列与网页内容不相关的信息

用户浏览通常是从左到右的，重要的内容应该放到title的靠前的位置

百度建议描述：

首页：网站名称或者网站名称_服务介绍/产品介绍
频道页：频道名称_网站名称
文章页：文章标题_频道名称_网站名称

合适的description
description是对网页内容的精练概括。这个标签存在与否不影响网页权值，只会用做搜索结果摘要的一个选择目标。百度推荐做法：

为每个网页创建不同的description ，避免所有网页都使用同样的描述
网站首页、频道页、产品参数页等没有摘要的网页最适合使用description
准确的描述网页，不要堆砌关键词，长度合理

HTML语义化
HTML语义化是用标签和属性来描述内容。所以HTML语义化是SEO的基石。一般建议：

HTML结构要清晰和简洁
跳转使用<a>标签，不要使用js跳转
图片加alt说明
文章用<article>标签承载
...

Vue单页项目的SEO目前，对于SEO支持比较好的项目方案是采用服务端渲染。所以如果项目有SEO需求，那么比较好的方案是服务端渲染。
如果你已经采用了前后分离的单页项目，而你的网站内容不需要AJAX去获取内容和展示内容，那么可以试试 prerender-spa-plugin 这个插件，这个插件是一个webpack插件，可以帮助你在打包过程中通过无头浏览器去渲染你的页面，并生成对应的HTML 。当然这个方案适合你的路由是静态的，并且路由数量非海量。
如果你的内容是AJAX动态获取的，那么vue单页项目可以试试 prerender ,这个是一个预渲染服务，可以帮你通过无头浏览器渲染页面，并返回HTML 。这个方案和prerender-spa-plugin很相似，都是通过无头浏览器去渲染页面，不同的是渲染的时机， prerender-spa-plugin是在打包过程中渲染，注定了其只能渲染静态路由，而prerender 是在请求时渲染，所以可以渲染动态的路由。下面我重点介绍一下prerender方案。
prerender 的使用
1、安装
$ npm install prerender复制代码2、启动服务 server.js
const prerender = require('prerender');const server = prerender();server.start();复制代码3、测试
http://localhost:3000/render?url=https://www.example.com/复制代码经过上面三个步骤，你就已经启动一个预渲染服务，并且会返回"www.example.com/"的内容，整个过程还是比较简单的。其github官网上面还介绍了它的许多中间件（Middleware），例如prerender-node (Express)、Nginx.conf等，那么这个和 prerender 是什么关系呢？是否直接使用中间件就可以呢？下面介绍prerender是如何工作的吧。
prerender方案的原理
首先服务端接收到一个页面的请求，然后判断这个请求是否来自搜索引擎的爬虫，如果不是，则直接返回单页项目的HTML ，按照普通单页项目的工作模式（客户端渲染），如果是，则把请求转发给prerender服务， prerender服务会通过无头浏览器进行预渲染，渲染完成把内容返回，这样爬虫就可以拿到有内容的HTML了。prerender中间件就是用来判断请求是否来自搜索引擎爬虫和转发请求的。
值得注意的是， prerender服务是不包含无头浏览器的，所以需要自行安装chrome浏览器。因此，整个方案运行需要三部分：

chrome浏览器
prerender服务
prerender中间件

那么prerender服务是怎么知道页面渲染已经完成的呢？ Prerender服务通过计算未完成的请求数量，来确定页面何时完成加载。一旦未完成的请求数达到零，服务会等待一段时间（默认500ms），然后保存HTML 。
prerender的最佳实践
经过实践，请求一个经过prerender渲染的页面是时间，快的时候约2s ，慢的时候会长达8s 。一般来说，请求时间在3s以内是最好的。所以我从以下几个方面入手，探索prerender的优化方法。
减少资源请求的时间
影响prerender渲染时间的资源主要有js请求资源和api请求资源， api请求时间一般由后端决定，所以我考虑的是如何减少js资源请求时间。一般prerender服务渲染的资源请求地址是由页面请求URL决定的，所以一般是线上的地址，如果我们把prerender服务部署在网站的服务器上，让prerender服务请求资源走本地，那么就可以缩短资源的请求时间了。