サイトをHTTPS化する際にSEO的に不利にならないための３つの注意点

2017年1月28日2018年9月21日

ウェブサイトのHTTPS化がSEO的に有利なのでは？と考えている僕が、重い腰を上げて当サイトのHTTPS化に対応しました。

HTTPS化がSEOに影響大！お名前サーバーからエックスサーバーへの変更を決意した

環境はWordPressでPHP5.16、DBはMySQLです。

先人が二人おり、彼らのサイトを参考に実装を完了させました。

なので、詳しい方法はそちらを見て頂きたいのですが、記載されていない落とし穴が３つありました。

これから自分のサイトやブログをHTTPS化しようと考えている皆様。ぜひご一読ください。

今村だけがわかるブログ：Webサイトを「HTTP」から「HTTPS」へ切り替える際に行う一連の作業をまとめました

たらはこ：[WordPress]ブログ環境をHTTPS対応チェックリストとやった事総まとめ #七ブ侍 #水曜日

一番大事なSSL証明書の発行の時、必ずwww有り無し両方で使えるものを取得しよう

まずはここです。

僕は今１年間ならば無料でSSL証明書を発行できる、エックスサーバーで発行しました。(実際に発行したのはSecureCoreの３年契約(¥3,600))

その際、SSL証明書はwww無しのみで使えるものを発行しました。

www付きでも使えるものにしておけば良かった…とめちゃめちゃ後悔していますが、時すでに遅し。

実は、こんな弊害があります。

SSL証明書がwww無しだと、https://www….→https://….へのリダイレクトが出来ない！！

後ほど記載しますが、HTTPS対応が完了した際はhtaccessを利用したリダイレクトの処理を記述する必要が”SEO的に”あります。

Googleに「このサイトのメインドメインはhttps://….ですよ」と伝えるために、http://…→https://…とwww有り→www無しへのリダイレクト処理をしないといけないのです。

が、SSL証明書をwww無しで発行していると、以下画面のようになります。

リダイレクトの処理をしようにも、SSL証明書を発行していないためにパーミッションが無く、リダイレクト処理もうまくいきません。

SSL証明書は、必ずwww有り無し両方発行するようにしましょう。

設定 > 一般の「WordPressアドレス」と「サイトアドレス」を変更しないとエラーが消えない

僕はRuby on Railsで週末プログラミングをしていますが、WordPressの関数はよく知りません。

【Ruby on Rails】twitter apiを利用してoauth認証・タイムラインを表示する

【Ruby on Rails】instagram apiを利用してoauth認証・タイムラインを表示する

テーマのhttp→httpsへの変更を終え、いざchromeのデベロッパーツールでコンソールを起動すると出るわ出るわエラーの海…

そしてテーマ(header.php)を見返すと、こんなコードが。

<link rel="stylesheet" href="<?php echo esc_url( get_template_directory_uri() ); ?>/css/normalize.css">
<link rel="stylesheet" href="<?php echo esc_url( get_stylesheet_uri() ); ?>" type="text/css" media="screen" >
<link rel="alternate" type="application/rss+xml" title="<?php echo esc_attr( get_bloginfo( 'name' ) ); ?> RSS Feed" href="<?php bloginfo( 'rss2_url' ); ?>" />
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" >

ここの”get_template_directory_uri()”や”get_stylesheet_uri()”、”get_bloginfo()”といった関数がhttpのURLを吐き出しており、functions.phpに記述されているんだな？と見に行ったら何も無い…

なのでググってみると、WordPress特有のuriを呼び出す関数らしい。(Stinger6を使っている当サイトでは、ここら辺URL直打ちでは無い実装になっています。)

エラーが消えないとお困りの方、まずは「WordPressアドレス」と「サイトアドレス」を変更しよう

htaccessファイルでのhttp→https,www有り(無し)→www無し(有り)へのリダイレクト処理を忘れずに行おう

最後の落とし穴がリダイレクト処理。

僕はhttp://→https://へのリダイレクト処理を行っただけで寝ようとしていましたが(深夜4時)、www有り無しのリダイレクト処理を書き忘れたことを思い出して慌てて設定しました。

以下にhtaccessファイルの一部を載せておきます。(サーバーによってhtaccessにサーバー管理画面用の処理が記述されている(エックスサーバー)ケースがあります。ご注意を。)

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteCond %{HTTP_HOST} ^www\.takuyokomizo\.com
RewriteRule ^(.*) https://takuyokomizo.com/$1 [R=301,L]
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

※下にindex.phpのリダイレクト処理も記述しています。

ちなみにこのサイトは、HTTPS対応自体は完了しましたが、なぜかスマートフォンで先日導入したソーシャルシェア(参考：ソーシャルでのシェア増を目的にStinger6にバイラル風シェアボタンを設置した)のCSSがバグっています。(chromeのデベロッパーツール上だと問題無し)