Designer's Blog

2

10月17日からヘテムルで新サーバー環境への移設機能と無料独自SSLが利用可能になったことをこのブログでも紹介してしましたが、11月に入り時間もできたので、「常時SSL」がSEO対策へ及ぼすことがGoogleより発表されていることもあり、このブログでも独自ドメインをSSL化しました。サイト全体をHTTPS化することは、SEO観点からも有効性があると言えるので、常時SSLの導入をおすすめします。実際にhetemlでWordPressを使って無料SSL化の手順や実際にやったことを公開します。hetemlでWordPressを無料SSL化する際の参考にしてみてください。

常時SSL化について

cs-glossary-01出典 – ファーストサーバ株式会社

「常時SSL化」とは、ひと昔前であれば、金融機関や、ショッピングサイト等、個人情報を扱うようなWebサイトに多く導入されておりました。当然ですが、このSSL(証明書)を取得して利用するのにも結構なお金ががかかっていたのですが、2014年11月にElectronic Frontier Foundation(EFF)の他、MozillaやCisco Systems、ミシガン大学などが協同で、「Let’s Encrypt」と呼ばれる無料SSLプロジェクトを立ち上げたことをきっかけに、急速に普及し、現在では無料でSSL証明書を使えるサーバーも増えてきており、独自ドメインでも運用できるようになってきております。

SSLの普及状況

https
Webトラフィックの分析結果を提供している「HTTP Archive」によると、2010年から2017年の現在にかけて、HTTPSでのリクエストが占める割合は年々増加しており、2010年では2%程度しか導入されていなかった状況も、2017年10月時点で約46%以上となってます。この普及の推移の影には、天下のGoogleがHTTPSを推奨していることもあり、この流れは今後もさらに加速するものと予想されています。

常時SSL化のメリット

独自ドメインを常時SSL化することによるメリットは、以下の内容があげられます。

  • 外部からの攻撃・盗聴・なりすましを防ぐ
  • HTTP/2対応ブラウザで表示が早くなる
  • リファラーの増加でログ解析の精度向上
  • 検索順位での優遇(Google)
  • Webサイトの信頼性が高まる

常時SSL化のデメリット

当然ながら、常時SSL化することによるメリットだけではなく、以下のデメリットもあります。

  • 導入に費用がかかる(クイック認証SSL/企業認証SSL/EV SSL)
  • ソーシャル系ボタンのカウントがリセットされる
  • Google Search Consoleに再登録が必要となる
  • 利用しているサーバが、無料常時SSL化に対応してないケースもある
  • HTTPSに非対応のツールや広告が非表示になる等

WEBサイトを作る前にあらかじめサーバーに常時SSL化を導入できれば、特に苦労することはないのですが、何年もブログやコンテンツをアップし続けているサイトであればあるほど、httphttpsにするにあたっては、新規で導入するよりも作業工程が多くなり、知識がある方でないと導入のハードルはかなり高いかもしれません。ただ頑張れば出来なくはないので、SEO対策やGoogleからのサイト評価のためにチャレンジしてみるのもありかと思います。

ただ間違いなく言えることは、今、世界中でWebサイト全体をHTTPS(暗号化通信)にする常時SSLのWebサイトが急増しており、今後のWEBの主流になりつつあるということです。

heteml
まず大前提として、この記事の内容はhetemlのサーバーを利用してWordPressをインストールして構築している方向けの内容となります。無料SSL導入の手順やフローはhetemlユーザかつ、WordPressユーザに限られますのでご注意ください。他のサーバー利用を利用している方は、WordPressのSSL化あたりが参考になると思います。

いままで、hetemlでの利用プランはひとつしかなかったんですが、最近では価格を抑えたベーシックプランが800円/月額で利用できるようなプランも新たに作られ、800円でサーバーを利用できる他、無料独自SSLが利用可能、自動バックアップ付き、HTTP/2などといったものも盛り込まれて、さらにパワーアップしているのにもかかわらず、コストダウンしてるサーバーです。

hetemlでの無料SSL化導入方法

ではまずはじめに、サーバー側からの設定方法を解説します。

コントロールパネルから無料SSL設定

まずはコントールパネルにログインします。右のサイドバーから「ドメイン・メール設定」→ドメイン一覧が表示されるので、無料SSLを導入したいドメインの「詳細を見る」をクリック。URLの横にある、青いボタン「設定変更」を押すと以下の画面がでてくるので、無料独自SSLを設定するのチェックボックスにチェックを入れて、青いボタン「変更する」をクリック。

無料独自SSLを設定後、なにがあっても解除の操作ができなくなります。導入の際は慎重に検討してから行ってください。

無料SSL設定 heteml

変更するボタンを押すと、以下のように「SSL設定中」とオレンジの色で設定中であることが表示されます。

無料SSL設定-heteml-設定中

早ければ、5分くらいで以下のように緑の文字で「無料SSL」と表示されていれば、サイトドメインのディレクトリに常時SSLが適用されます。
無料SSL設定-heteml-設定完了

WordPressにSSLを設定する為の事前準備

サーバー自体にSSLが導入されましたが、ここからWordPressで構築されたWebサイトの常時SSL化の設定を行っていきます。httpからhttpsに切り替わることによってサイト全体のURLが変更になります。実際の作業に入る前に、なにかあったときのことを考えバックアップを必ずとることをオススメします。

万が一トラブルが発生してもすぐに切り戻しができるように、WordPressで公開しているWebサイトのファイル/データベースのバックアップをしておきましょう

WordPressで構築されたWebサイトの常時SSL化にはさまざまな手法がブログで公開されておりますが、ここでは私が行った方法で、常時SSL化のためのプラグイン「Really Simple SSL」を利用した手順を紹介します。

プラグインで一気にWordPress全体をSSL化

WordPressの管理画面にログインして、プラグイン「Really Simple SSL」をインストールします。

WordPressの管理画面にログインできない場合には、いつもログインしているURLの頭の部分を「http://」から「https://」(HTTPS)に変えてアクセスします。

インストールしたプラグインを有効化

上記プラグインをインストールして有効化にすると、以下と同じ画面が表示されます。同じ内容が表示されない場合は設定が間違っている可能性がありますので見直してください。あとは赤いボタン「はい、SSLを有効化します。」を押すだけで完了です。これで WordPressのSSL化が終了となります。結構簡単です。

無料SSL設定-wordpress プラグイン2

完了画面で表示されるメッセージの通り、HTTPでの接続を自動的にHTTPSにリダイレクトするようになります。

WordPressの一般設定のURL確認

プラグインで有効化すると一旦ログアウトされます。再度ログインしてコントロールパネル内[設定]→[一般]から、WordPress アドレス (URL)サイトアドレス (URL)https://からはじまっているか確認してください。
Wordpress一般設定 SSL

サイトにアクセスして有効化の確認

特に問題がなければ、サイトにアクセスして緑色で鍵のマークが表示され「保護された通信」とでていれば成功です。(Chromeで確認した場合)
SSl化成功

画像や外部からのリンクが表示されない場合の対処方法

SSL化設定をほぼ自動で簡単に行える「Really Simple SSL」ですが、このプラグインで常時SSL化の対応ができたとしても、中にはうまくhttpsにリダイレクトされないケースもあります。外部サイトからのアクセスででhttpsにする前のリンクが紹介されていた場合には、アクセスできなくなるので、.htaccessへ追記でリダイレクトさせることができます。

.htaccessへのリダイレクト処理の追記

.htaccessに以下の内容を追記して、httpから始まるURLへアクセスされた場合にhttpsへリダイレクトさせます。

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
</IfModule>

内部リンク・画像をプラグインを使って一括置換

実はこのブログでも一部の画像が表示されなかったり、内部リンクがエラーになっていたものがありましたので、以下の「Search Regex」というプラグインを使って一気に「http://xxxxxx」を「https://xxxxxx」に一括置換しました。

Search Regex
Search Regex
Developer: John Godley
Price: Free

上記リンクからプラグインをダウンロードしてFTPなどでアップするか、[プラグイン]→[新規追加]から「Search Regex」を検索して、インストール&有効化します。具体的な使用方法については、以下のブログでわかりやすく解説されている方がおりましたので、こちらを参考に一括置換をしてみてください。

【2017最新版】Search Regexの使い方(STINGER8対応WordPressプラグイン)

SNSカウントの引き継ぎ

既存運営していた記事数が多いサイトや、シェア数が多い記事コンテンツを持っている場合の常時SSL化のデメリットである、SNSカウントのクリア問題ですが、WordPressプラグイン SNS Count Cacheを使ってカウントを復活させることができるようです。こちらもここではあえて解説をしないで、このプラグインを作った作者の方が詳しく設定や仕組みなどに解説されているのでこちらを紹介するだけに留めておきたいと思います。2015年の記事内容ですが、わかりやすく解説されております。

[試] HTTPからHTTPSのシェア数引継ぎにもWordPressプラグイン SNS Count Cache

Broken Link Checkerで今後の運用でのリンク切れをチェック

私は念のため、サイト上でリンク切れなどが起きた場合などに対応できるよう、「Broken Link Checker」という以下のプラグインを入れております。

Broken Link Checker
Broken Link Checker
Developer:
Price: Free

使い方についてはここでは省略したいと思います。運用や使い方についての参考となる記事はこちらをご確認ください。

リンク切れを自動検知!Broken Link Checkerの使い方ーWordPressプラグイン【初心者向け】

ここまでで一旦サーバー周りと、WordPressのSSL化は完了となりますが、このあとまだやることは残ってますが、もう少しです。

Googleサーチコンソールへの登録

もともとhttpで登録していたものをhttpsで運用するにあたり、URLが変更になります。SEOの対策としてGoogleの検索へサイトの更新情報をいち早く伝える他、httpsで作成したサイトマップを再登録ために、Googleサーチコンソールへサイトを再登録する必要があります。

サーチコンソールへログインして、[プロパティを追加]ボタンを押してhttpから始まるサイトのアドレスを登録します。
サーチコンソール SSL

所有権の確認方法のいずれかで、所有権を確認します。
サーチコンソール所有権確認

サイトの所有権が確認ができれば、あとはダッシュボード内の[クロール]→[Fetch as Google]を使ってGoogleへの再クロールを依頼します。早ければ、1日、2日程度でクローラーが巡回してきて、 サイト全体が登録されます。特に公開されて間もないページなどはクロールの頻度が高くありませんので、必ず実施することをオススメします。
サーチコンソール登録2

クロールエラーにならないために、robots.txt内を修正

Googleサーチコンソールを利用している場合、Webサイトを巡回する検索ロボット(クローラー)を制御する方法として、ドキュメントルートに「robots.txt」を必ず設置しています。SSL化をした後、ここの情報もしっかりとあわせて書き換える必要がでてきます。

そうしないと以下の画像のように、URLエラーの部分に、数字とともに「アクセスが拒否されました」などといったエラーが表示されます。こうなる原因のひとつとして、クローラーがHTTPS全般を巡回してくれるものを、ブロックしてしまっていることが挙げられます。

Search Console  URL エラー

Search Console   クロールエラー

FTPなどでドキュメントルートにアクセスして、robots.txtを探しだし、Sitemapの部分のあたまを、httpからhttpsへ書き換えて、ドキュメントルートに戻します。

Sitemap: https://自分のドメイン/sitemap.xml
Sitemap: https://自分のドメイン/sitemap_index.xml

変更した内容を戻した後には、右下にある[送信]ボタンをクリックして、「3.Googleに更新をリクエスト」の送信ボタンを押すと完了です。あとは再度クローラーが巡回してくれるのを待ちます。

Search Console   robots 更新リクエスト

本当にアクセス拒否が解除されたかどうかは、「robots.txt」の下にある、ところにエラーとなるURLを入れて[テスト]ボタンを押した結果が「許可済み」と表示されていれば問題ありません。
Search Console   robots.txt テスター

GoogleアナリティクスのURL修正

またGoogleアナリティクスを利用している場合には、httpで登録していた場合、httpからhttpsにURLが変わることによって、アナリティクスの数値がかわってくるので、コントロールパネルへログインし、左下にある[設定]をクリックして開き、常時SSLのURLに設定し直す必要があります。
管理

[ビュー設定]の中にある、「ウェブサイトのURL」の部分をhttp://から、https://に選択を変更して、一番下にある、青い[保存]ボタンを押せば完了です。これで[https]でのアクセス情報が収集されます。
アナリティクスビュー設定

まとめ

かなり長くなりましたが、お疲れ様でした!!hetemlのサーバーで無料SSLを利用する方法、WordPressに導入する設定方法と、その後の設定方法についての解説は以上となります!

最後まで読んでいただきありがとうございました。今後WEBサイトのSSL化がどんどん進んでいくと思いますが、この記事がみなさまの少しでもお役に立ちましたらシェアしてもらえると嬉しいです。

Sponsored Link


その他関連記事

コメントはこちら

TOPへ戻る