vue项目做seo_关于vue项目的seo问题

更新日期: 2019-04-10阅读量: 2076标签: seo

不可否定的是,vue现在火。但是在实际项目中,特别是像一下交互网站,我们不可避免会考虑到的是seo问题,这直接关系到我们网站的排名,很多人说用vue搭建的网站不能做优化,那我们真的要放弃vue,放弃前后端分离开发么?


首先,可以肯定的是前后端分离不利于seo,为什么呢?

 1.搜索引擎的基础爬虫的原理就是抓取你的url,然后获取你的html代码并解析。 而你的页面通常用了vue等js数据绑定机制来展示页面数据,爬虫获取到的html是你的模型页面而不是最终数据的渲染页面,所以说用js来渲染数据对seo并不友好。

2.seo 本质是一个服务器向另一个服务器发起请求,解析请求内容。但一般来说搜索引擎是不回去执行请求到的js的。也就是说,如果一个单页应用,html在服务器端还没有渲染部分数据数据,在浏览器才渲染出数据,而搜索引擎请求到的html是没有渲染数据的。 这样就很不利于内容被搜索引擎搜索到。 所以服务端渲染就是尽量在服务器发送到浏览器前 页面上就是有数据的。

3.一般的数据逻辑操作是放在后端的。排序这个如果仅仅是几条数据,前后端排序开起来是一样的,如果是有1000条数据,前端要排序就要都请求过来。这样显然是不合理的。


这就代表交互网站不用vue做么?当然不是。无意间在知乎看见vue的作者是这么说的:


所以说,即使是像vue这种前后端分离开发的网站,我们还是能够通过其他技术解决seo问题的。常用的解决方案有三种:

1. 页面预渲染
2. 服务端渲染
3. 路由采用h5 history模式

而应用到的技术也是有很多,大体上我总结了四个,也是比较常用的:

第一,ssr,vue官方文档给出的服务器渲染方案,这是一套完整的构建vue服务端渲染应用的指南,具体参考https://cn.vuejs.org/v2/guide/ssr.html
第二,vue-meta-info,这个是针对单页面的meta SEO的另一种思路,参考网站 https://zhuanlan.zhihu.com/p/29148760
第三,nuxt 简单易用,参考网站 https://zh.nuxtjs.org/guide/installation
第四,phantomjs 页面预渲染,具体参考 phantomjs.org

而市场上依靠vue做出来的唱功案例还是很多的:

1) https://www.bilibili.com (bilibili)
2) http://m.sohu.com (手机搜狐网)
3) https://juejin.im/timeline (掘金)
4) http://element.eleme.io/#/en-US (2)
5) https://classics.autotrader.com (New&Used Classic Car for sale)
6) http://qiqu.uc.cn (奇趣百科)
7) https://m.uhouzz.com/apartments (异乡好居)

那么他们是如何做优化的呢?我们通过分析,总结以下几点

1) bilibili做了基本的seo优化,比如

(1)TDK描叙详细。
(2)提升网页加载速度:对外联css,以及js使用了延迟加载以及dns-prefetch,preload。
(3)外联较多,关键词排名高。

2) 掘金网站使用了vue-meta-info 管理网站的meta,应该配合使用了prerender-spa-plugin 对SEO进行了优化

3) Element在logo上加了首页的地址,并且只有logo是放在h1标签中。

4) 有一些流量不太高的网站比如http://www.marshall.edu (Marshall University)做了seo社会化分享优化,在meta信息中出现了property=”og:title”这种新东西;https://we.dji.com/zh-CN/campus (大疆招聘)使用了Nuxt

这些网站中出现率最高的公共组件或公共方法有四个:

1) 面包屑导航
2) Icon
3) 搜索框
4) Button组件


关于收录问题:

网站收录,搜索引擎在爬取你的网页以后,通过对网页内容进行检测,将符合收录规则的网页存库。因此该网页将会出现在与网页内容相关的查询的搜索结果中。 搜索引擎判断一个网站权重高低的尺度无非两个:收录和外链。因此百度收录的高低很大程度上影响着网站在百度的排名


目前百度spider抓取新链接的途径有两个:

一是主动出击发现抓取

二就是从百度站长平台的链接提交工具中获取数据,其中通过主动推送功能“收”上来的数据最受百度spider的欢迎。

对于站长来说,如果链接很长时间不被收录,建议尝试使用主动推送功能,尤其是新网站,主动推送首页数据,有利于内页数据的抓取。


 这只是我片面的分析,具体情况我们还要根据网站定位,开发成本,后期的维护成本等综合考虑,但是我觉得掘金真的是一个非常成功的案例,既然有人给我们迈出了这一步,我们也要紧跟潮流,毕竟互联网是一个与时俱进的行业。如果我们永远停留在传统的混合开发,也会给我们的公司,给我们个人带来一些影响。


站长推荐

1.云服务推荐: 国内主流云服务商/虚拟空间,各类云产品的最新活动,优惠券领取。领取地址:阿里云腾讯云硅云

链接: https://www.fly63.com/article/detial/2807

Seo学习心得:作为前端开发需要了解的Seo优化技能

前端开发seo的学习心得,通过seo优化可以提高我们的网站搜索排名,减低运营成本的同时,增强网站的曝光率,提高网站的可信度,作为前端开发需要掌握哪些seo优化技能呢?

整理seo站长查询排名工具_前端seo知识

关键词布局:1.优先级遵循,2.网址标题上尽量以_ 这种排序方式编写 一般不超过80个字符。关于img 的alt 最好写上相关信息,关于网站链接,地址来说最好为静态地址,切成绩最好不能大于3级,层级过多可能不利爬虫了解网站层级结构

网站seo分析工具_站长工具、seo综合查询推荐

这里给大家分享一些常用的网站分析工具,这些工具可以帮助我们了解网站SEO的情况。比如:检测网站死链接、HTML格式检测、蜘蛛访问、网站速度测试、网站域名IP查询、PR 友情链接检查等等

要想做好SEO优化,前端技巧不可忽略

在优化行业,有大批站长工作经验丰厚,然而在前端优化技巧方面还存在较差,从优化的层面来看,SEO思维虽说很很关键,不过没有一个精准的前端把控,网站优化方面还是存在好多的不足。

robots.txt站点文件_详解网站的robots.txt限制指令怎么编写

robots.txt是一个纯文本文件,是爬虫抓取网站的时候要查看的第一个文件,一般位于网站的根目录下。这篇文章主要介绍:robots.txt是什么?robots.txt中的参数含义。robots.txt写法大全和robots.txt语法的作用,robots.txt编写注意事项

网站流量指标的结构_uv和ip、vv、pv详解

网站流量指标的结构:PV即Page View,网站浏览量,指页面浏览的次数,用以衡量网站用户访问的网页数量。UV即独立访客数,指一天内访问某站点的人数,以cookie为依据。IP即独立IP数,指一天内使用不同IP地址的用户访问网站数量,同一IP无论访问了几个页面,独立的IP数均为1

网站的权重提高_如何优化锚文本提高网站的权重?

锚文本,也称锚文本链接,就是把关键词做一个链接,指向别的网页,用来引导读者访问你网站上的其他页面。在Google看来,清晰、简洁以及与链接页面内容密切相关的锚文本可以加强两个网页间的关联性

郑州网站建设告诉你移动端网站关键词怎么优化

现在人人都要用手机,手机已经成为我们生活中不可或缺的一部分,随着互联网的发展,移动端也越来越重要了。移动端网站关键词怎么优化?用户体验优化、移动端内容优化、移动页面细节优化、移动端代码优化

网站SEO优化:写好网页标题对网站排名的重要性

与大家分享下网站SEO优化的一些技巧。谈到网站优化,首先要注意的就是网站标题的写法。每一个做SEO优化的人,都会重视网站标题和描述的优化,其中网站标题是参与关键词排名竞争的重要因素。标题一般控制在35个字左右,描述控制在80个字左右

HTML网页 搜索引擎抓取的影响有哪些

如果你的网站升级改版,并且针对部分URL进行了修正,那么它可能急需搜索引擎抓取,重新对页面内容进行评估。大部分站长认为,自百度熊掌号上线以来,它解决了收录问题,实际上目标URL,只有不停的被抓取,它才可以不断的重新评估权重,从而提升排名。

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!