立诚勿怠,格物致知
It's all about connecting the dots

在不考虑SSR的情况下如何优化SEO

Meta标签

description和keywords两个类型的meta标签对SEO影响很大,直接输出给客户端的页面通常有三种:

一种是类似联系地址、公司介绍之类页面标题固定的页面,可以在前端层面直接写好描述和关键词两类meta标签。

还有一种是类似产品详情页这类页面,如果支持SSR的话一般会在标题里显示出产品具体名称之类的信息,在不支持SSR的情况下,可以填写一些比较范范、通用的介绍和关键词,比空着不写要好一些。

第三类是类似具体业务流程的页面,比如下单、支付过程的界面,这些界面可以不做SEO,或者像第一种那样处理。

H1、H2标签权重较高

尤其是h1标签,其内的文本内容权重较高,不要乱用,要放关键内容。

Sitemap

通过尽可能的完善sitemap(网站地图)来诱导搜索引擎爬虫来爬取页面。可定期完善后主动提交给百度等搜索引擎。

本地预渲染

phantomjs/Puppeteer是无界面浏览器,可用于编程实现在本地打包时通过无界面浏览器来访问尽可能多的页面url来得到渲染好的html结构,如果产品数量和详情在一定时间段内变化不大的话效果还是比较可观的。注意这种本地渲染出的页面只是供蜘蛛爬取所用的,并不供用户访问使用,服务端需要根据UA是蜘蛛还是用户浏览器来返回不同的内容。

这里有个问题就是,渲染的页面的url需要与spa单页应用的页面url相一致,而且不应使用hash方式的url路由(例如:index.html#hello),所以需要服务端配置一下以支持history模式(例如:index/hello)。对于不支持Html5 history API的浏览器(IE从10开始才支持),可以降级用户体验,使用跳转页面的方式取代无刷新跳转路由。

另外一个问题是,如果搜索引擎蜘蛛发现预渲染的页面与用户实际浏览到的页面差异较大,可能会被认为是在欺骗搜索引擎从而导致网站被降级,因此需要考虑以一个较小的周期(比如每天一次)去执行这个预渲染页的生成工作,并且在有内容更新的时候再执行一次。

目前发现prerender-spa-plugin有现成可用的与webpack集成的方案,也支持不使用这些构建工具的原生js项目。核心问题是需要制定待渲染的路由列表,碰到路由上需要带入参数的情况,需要看看是否可以获取到所有路由(及对应的路由上的参数):

  • 我们可以写爬虫(如果方便爬到所有数据的话,另外如果页面html结构重构了的话需要修改爬取逻辑);
  • 或者如果可以获取到数据库的只读权限(不需要写的权限),或者让数据库管理员导出数据来分析,来。

服务端预渲染

原理与本地预渲染一致,就是提前把静态页面渲染出来。但是服务端渲染与SSR(服务端渲染)是不一样的,不需要由服务端去获取各个原先由客户端ajax请求获取到的数据来拼接页面内容。

java服务在判断访问者为搜索引擎蜘蛛时,即时地去使用phontomjs等无界面浏览器来下载页面渲染页面内容然后将生成的内容返回给蜘蛛。

优点是给蜘蛛的内容与给用户的内容更一致。

有一个缺点是因为要等无界面浏览器下载完页面执行完ajax请求获取完数据才能得到渲染好的页面,过程会比较费时,所以可以考虑设定一个文件过期时间,首次预渲染后将对应的html文件保存到服务器上,下一次访问到该文件时使用该文件而非重新去预渲染,当检测到文件已到过期时间就重新预渲染页面然后保存,以此类推,这样平均访问速度不会很慢,而且对服务器端增加的压力并不大。

另外一个缺点是,根据以前写phantomjs批量爬取网页截图的经验,无界面浏览器并不是很稳定,就跟我们用浏览器打开很多页面一样,容易卡死啥的,如果页面数量很多的话,碰到新发布后一次性遇到蜘蛛大量访问新页面的话,服务器吃不吃得消需要再考虑下,服务器端预渲染也可以结合本地预渲染一起来。

参考资料

赞(3) 打赏
文章名称:《在不考虑SSR的情况下如何优化SEO》
文章链接:https://www.orzzone.com/seo-without-ssr.html
商业联系:yakima.public@gmail.com

本站大部分文章为原创或编译而来,对于本站版权文章,未经许可不得用于商业目的,非商业性转载请以链接形式标注原文出处。
本站内容仅供个人学习交流,不做为任何投资、建议的参考依据,因此产生的问题需自行承担。

评论 抢沙发

觉得文章有用就打赏一下文章作者

非常感谢你的打赏,我们将继续给力提供更多优质内容!

支付宝扫一扫打赏

微信扫一扫打赏

登录

找回密码

注册