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

原文链接：https://blog.csdn.net/qq_34109078/article/details/78297019

 

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组件