关于javascript:VuePress-博客之-SEO-优化二之重定向

9次阅读

共计 3104 个字符,预计需要花费 8 分钟才能阅读完成。

前言

在《一篇带你用 VuePress + Github Pages 搭建博客》中,咱们应用 VuePress 搭建了一个博客,最终的成果查看:TypeScript 中文文档。

本篇讲讲 SEO 与重定向。

问题

最一开始我应用 GitHub Pages 服务建设了站点,地址是:https://mqyqingfeng.github.io/learn-typescript,

思考到 GitHub 在国内访问速度的问题,我又在 Gitee 上同步了一份,地址是:http://mqyqingfeng.gitee.io/learn-typescript

起初我决定本人建站,地址是:http://ts.yayujs.com

起初我想怎么能够不搞下 https 呢?于是有了新的地址:https://ts.yayujs.com

再除此之外,http://yayujs.com 也是这个网站……

这一下子就产生了 5 个地址,所以我决定,对立成一个,既不便记忆和珍藏,又不便 SEO 优化,不会导致反复收录,分走应有的搜寻流量。

对立

那对立成哪一个呢?

首先必定是本人的服务器和域名,要不然钱白花了……

而后因为 HTTPS 对 SEO 更加敌对一些,就比方百度搜索引擎认为权值雷同的站点,采纳 HTTPS 协定的页面更加平安,排名上会优先看待,Google 也是倡议应用 HTTPS::

Google 会优先选择 HTTPS 网页(而非等效的 HTTP 网页)作为标准网页

所以咱们用 HTTPS。

至于 http://yayujs.com/,思考到这个会作为冴羽的集体博客页面应用,只是因为还没有开发,所以先指向了这个站点,所以这个地址维持原状,前期会上线为冴羽的集体博客。

所以最初对立的地址为 https://ts.yayujs.com

JS 重定向

GitHub Pages 和 Gitee Pages 搭建的站点页面,因为不是本人的服务器和域名,没有办法能够间接通过域名重定向或者 Nginx 重定向之类的办法,所以咱们罗唆 JavaScript 判断一下域名,而后 location.href 跳转为新的地址:

// config.js
module.exports = {
    title: 'TypeScript4 中文文档',
    description: 'TypeScript 最新官网文档翻译,TypeScript 中文手册, 提供 TypeScript 从入门到进阶的零碎学习教程',
    head: [
      ['script', {}, `
        (function() {if (location.href.indexOf('github.io') > -1 || location.href.indexOf('gitee.io') > -1) {location.href = 'https://ts.yayujs.com'}
        })();
        `
      ]
    ]
}

留神在所有重定向办法中,JavaScript location 重定向应该是最初思考的伎俩,在谷歌搜寻核心的文档中就有写到:

仅在您无奈施行服务器端重定向或 meta refresh 重定向时,才应用 JavaScript 重定向。尽管 Google 会尝试出现 Googlebot 抓取到的每个网址,但可能会因为各种起因而出现失败。这意味着,如果您设置了 JavaScript 重定向,但 Google 无奈出现相应内容,那么 Google 可能永远都无奈看到该重定向。

Nginx 重定向

HTTP 重定向 HTTPS

接下来咱们借助 Nginx 实现 HTTP 重定向到 HTTPS,这个在之前的文章《VuePress 博客优化之开启 HTTPS》中也有讲到过,咱们借助 Nginx 的 rewrite 语句实现:

server {
        listen       80 default_server;
        listen       [::]:80 default_server;
        server_name  _;
              rewrite ^(.*)$ https://$host$1 permanent;

        location ^~ /learn-typescript/ {alias /home/www/website/ts/;}

        location / {
          alias /home/www/website/ts/;
          index index.html;
        }
}

留神 rewrite 这句,咱们加了一个 permanent,示意这是一个 301 重定向,如果不加这个,会是 302 重定向,尽管体现上是一样的,但对于搜索引擎来说,却是不一样的,Google 也是更倡议应用 301 重定向:

如果您须要更改某个网页在搜索引擎后果中显示的网址,建议您尽可能应用永恒服务器端重定向。这是确保将 Google 搜寻和用户定向到正确网页的最佳形式。301 和 308 状态代码示意网页已永恒地迁徙到新地位。

只有应用 301 重定向,才不会对网站排名产生任何负面的影响。

yayujs.com 重定向 www.yayujs.com

对于搜索引擎来说,yayujs.com 和 www.yayujs.com 是不同的站点,这很好了解,毕竟 www.yayujs.com 就相当于 ts.yayujs.com 是一个子域名了,但如果域名不一样,内容却是一样的,这就会使得搜索引擎做两份收录,反而影响了两个地址的天然流量,为此咱们须要将一个重定向到另外一个地址。

那具体是从 yayujs.com 重定向到 www.yayujs.com 还是 www.yayujs.com 重定向到 yayujs.com 呢?

其实也无所谓,带不带 www,对 SEO 来说没有任何影响,这更多是集体偏好。

在 Google 搜寻核心的文档中也有举过例子:

假设用户可通过以下几种形式拜访您的网页:

  • https://example.com/home
  • https://home.example.com
  • https://www.example.com

可从这些网址中筛选一个作为标准网址,并应用 301 重定向将来自其余网址的流量疏导至您的首选网址。

如果你心愿 yayujs.com 重定向到 www.yayujs.com,你能够这样批改 Nginx 配置:

server {
  listen 443 ssl;
  server_name yayujs.com www.yayujs.com;
  if ($host != 'www.yayujs.com') {rewrite ^/(.*)$ https://www.yayujs.com/$1 permanent;
    }
}   

如果你心愿 www.yayujs.com 重定向到 yayujs.com,你能够这样批改 Nginx 配置:

server {
  listen 443 ssl;
  server_name yayujs.com www.yayujs.com;
  if ($host = 'www.yayujs.com') {rewrite ^/(.*)$ https://yayujs.com/$1 permanent;
  }
}

不过要留神,尽管对 SEO 来说是一样的,但咱们在做我的项目时可能会遇到一些差异,就比方咱们在解决 Cookie 相干的内容时,因为 Cookie 的同源策略,只能批改以后域以及父域的 Cookie,比方 ts.yayujs.com 和 www.yayujs.com 的 Cookie 就是隔离的,但 ts.yayujs.com 和 yayujs.com 的 Cookie 就不是齐全隔离的了。

系列文章

博客搭建系列是我至今写的惟一一个偏实战的系列教程,预计 20 篇左右,解说如何应用 VuePress 搭建、优化博客,并部署到 GitHub、Gitee、公有服务器等平台。本篇为第 28 篇,全系列文章地址:https://github.com/mqyqingfeng/Blog

微信:「mqyqingfeng」,加我进冴羽惟一的读者群。

如果有谬误或者不谨严的中央,请务必给予斧正,非常感激。如果喜爱或者有所启发,欢送 star,对作者也是一种激励。

正文完
 0