哪些网站使用了vue,及其seo

2 篇文章 0 订阅

最近在实习,刚来没几天,老大没安排什么大事给我,昨天下午说给我一个小任务,要求如下:

  • 1.收集几个流量大的网站(必须是vue做的)页面交互和逻辑尽可能复杂多样
  • 2.对比一下各个页面的seo是如何做的
  • 3.网站中出现率做多的公共组件或者公共方法是什么

于是我就开始收集了,在这期间也了解到了很多东西。

1 .首先怎么判断网站是用vue做的,我的方法当然是先搜一搜,当让搜出来的并不一定是,接下来可以用vue-develop这个插件,只要你安装了这个插件,是vue的网站该插件的图标就会点亮
2 .如何判断该网站是否是高流量网站,我的方法是去站长之家 看看他的alexa排名,一般情况下排名越靠前流量越高,也可以看看他的seo综合查询的情况,这样我就找出了相对高流量的网站。
3 .如何分析一个页面的SEO技术,我之前也是一头雾水,后来看了好多资料,找到了一片感觉比较可靠诊断网站seo 一共有三篇文章,比较详细。
4 .看了老大给的要求我就想到了由于项目使用的vue,会存在SEO的问题,让我分析页面的SEO最好不要漏掉最近流行的适用于vue的SEO优化方案,我查了一下,大概有以下几种:
(1)ssr,即单页面后台渲染
(2)vue-meta-info 与prerender-spa-plugin 预渲染
(3)nuxt
(4)phantomjs

最终我有了下面的输出

Vue网站及分析

1. 高流量vue网站

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

2. Vue网站SEO分析

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

3. 网站中出现率最高的公共组件或公共方法

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

  • 11
    点赞
  • 39
    收藏
    觉得还不错? 一键收藏
  • 6
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值