目次
このたび、サイトをSSL化およびWordPress化しました。開設以来、モバイルページの追加こそ行いましたが、本格的なリニューアルに着手するのは初めてなので、およそ8年ぶりの総取替プロジェクト、ということになります。
移行にあたって、試行錯誤を繰り返し、ようやく着地点が明確になってきた、ということで、自分の備忘録も兼ねて記事にしてみました。もしかしたら、同じように考えている方の参考になれば幸いです。
ただ、最初に言っておきますが、サイトリニューアルは、サイトの調子が良い（検索流入などが上がり調子である）時期には、当たり前ですが実施しないことを推奨します。リスク覚悟で実施するのはよいかもしれませんが、ＳＳＬ化にしても独自ドメインにしても、実施したことで目立って検索順位が上がるわけではありませんので、そのあたりは留意するようにしてください。
あと、移行直後は設定ミスで500エラー（Internal Server Error）が頻発しており。リソースもかなり食っていたようなので、利用者の皆様にはご迷惑をお掛けいたしました。
htmlページが20ページほど（PC・モバイルでそれぞれページがあったので合計40ページ程）の静的コンテンツメインのサイトです。
まぁ、このサイトの前身ですね。
このサイトはさくらのレンタルサーバサービスで運営しており、その初期ドメインで公開をしてきました。ただ、開設から数年経過してデザインが陳腐化したことや、ブラウザのセキュリティ強化に伴い、SSLを導入していないサイトは以下の図の通り、保護されていない通信のため危険だという表示が出るようになりました。
このままでは、せっかくサイトを訪問してくれた方も、古そうなサイトには有益な情報は少ないと判断したり、セキュリティの甘いページには滞在したくない。という意識が働いてもおかしくありません。
また、リニューアル前のサイトは長らくタグ直打ちという極めて雑な方法で作成していました。
語弊がありそうなので補足すると、決してタグ打ちが悪だというわけではありません。完璧なコードを書けるなら、特に当サイトのような更新頻度が低い静的コンテンツを見せることが主のサイトにおいては、処理速度も最速で今でも理想のWeb作成の方法だと思っています。
しかしながら、当サイトの運営は趣味の延長です。そこに生活のすべてを掛けて作業の時間を割くわけにもいかず、とりあえず体裁が整って読めれば良いという割り切りでタグ打ちをしていたために、誤っていたり、古い規格のコードがそのまま放置されていました。
個人の趣味レベルで誰の目にも触れないページなら良かったのですが、数年ほど前から特定のページについては検索流入が大幅に増えました。
記事の内容こそ時々見直してはいましたが、 当サイトの記事をわざわざ読みに来ていただける方にも申し訳ない、という気持ちから、 今回はサイト全体のデザインも含めて大幅リニューアルを敢行することにしました。
今回のリニューアルの目的は以下の4点です。
- サイトを常時ＳＳＬ対応にする
- 独自ドメインによる運用にする
- 人の手によるタグ打ちは大幅に減らす
- ＰＣ・モバイルともに閲覧しやすいレスポンシブデザインとする
個人サイトであれば、無料SSLで十分と考えたので、現行サービスのうえにこれを採用することにします。おそらく、他のホスティングサービスでも似たような感じかと思います。
これも、大体のホスティングサービスではオプションで追加できるはずです。
WordPressは、日々更新をかけるようなブログサイトで使われているようなイメージだったのですが、当サイトの運用で利用しても何ら問題はなさそう。というより、ブログ的な記事を気軽に書くこともできるようになるので、大きなメリットに感じました。
これまでのhtmlは、1つ新しい記事を追加するたびに、そのページにリンクする全てのページを修正する必要があったので、新たな記事を作るというのは相当な労力だからです。
これらの方針に加えて、既存ページの検索エンジンからの評価についても、引き継げるものは引き継ぐ必要があります。落ち目のサイトとはいえ、特定のキーワードで検索の1ページ目に出るようなページの評価を捨てるのは勿体ないので。
ここまでで、なんとなく方向性は決まりましたが、WordPressは使い方がさっぱり分からずだったので、ここでは2段階に分けてリニューアルを実施することにしました。とりあえずすぐに対応できそうなhtmlサイトのSSL化から行い、準備が整い次第、WordPressに移行するという手段をとることにしました。
いよいよ始動です。
いよいよ、リニューアルを実行に移していきます。
ただし、今回の手順では、手順④でリダイレクトの考慮漏れがあり、そのせいか検索エンジンによる検索結果において「http」（非SSLページ）と「https」（SSLページ）が重複するというミスがありました。
URLのわずかな違いですが、Googleはじめ検索エンジンでは、これらは別のサイトとして認識しますので、重複コンテンツのあるサイトとしてペナルティを受ける可能性もありますので、注意するようにしてください。
以下の手順には、もともとのサイトのＳＥＯ評価を引き継ぐための対策を、これでもかと行っています。それが奏功したのか、検索順位が移転前より大きく動いてしまった、とかはありませんでした。
静的htmlサイトの移行を検討されている方は、こういうやり方で、とりあえず移転できる、くらいの感覚で見てもらえるとありがたいです。
- 手順① サイトリニューアルの強い意志をもつ
- 手順② 独自ドメインを取得する
- 手順③ 取得したドメインにＳＳＬ証明書を割り当てる
- 手順④ .httaccessによる３０１リダイレクト設定を行う
- 手順⑤ サイトの動作チェックを行う
- 手順⑥ 鮮度の落ちたコンテンツのリライトおよび削除を行う
- 手順⑦ httpからのコンテンツ読み込みを確認する
- 手順⑧ 検索エンジンに移行後のサイトを周知する
- 手順⑨ 広告サービスの再申請を行う
- 手順⑩ Wordpressをインストールする
- 手順⑪ WordPressにテーマを適用する
- 手順⑫ WordPressの管理画面から、既存htmlサイトの記事を移行
- 手順⑬ 再度、.httaccessによる３０１リダイレクト設定を行う
冗談じゃなくこれが一番重要です。ひとたび手を付けたら、もはや後戻りはできません。煩雑な作業、謎のトラブル、検索順位の低下などのリスクは様々なサイトで既に周知されている通りです。この先待ち受ける幾多の困難や作業に立ち向かう勇気が出たら、進みましょう！
独自ドメインとは何か。という問いに対して明確な答えを出すことができませんが、分かりやすい例えとしては、「住所」だと考えてもらうと分かりやすいのではと思います。
その中で、独自ドメインのURLは「一戸建て」で、そうでないサブドメインを使っているURLは「集合住宅」と考えてもらうと、分かりやすいのではと思います。
例として、このサイトでは「shinkansen-travel.info」という独自ドメインを取得しました。これは世界に唯一の住所であり、他の人は同居していません。
一方で、以前までのさくらのサブドメインは「xxx.sakura.ne.jp」でした。「xxx」こそ固有の名称が入っていましたが、それ以降は集合住宅の住所である「sakura.ne.jp」が入っています。今回、独自ドメインを取ることで、表向きは一切「sakura.ne.jp」という「集合住宅」の住所は出なくなりました。
さて、本題に戻りますが、初期ドメイン（ホスティングサービスのドメイン名）を使っているのであれば、SSL化のタイミングで独自ドメインへ移行したほうが良いかと思います。
さくらインターネットではそもそも独自ドメインにしなければSSLが使えませんので、この対応は必須だといえます。SSL化も独自ドメインも、ページのURLが変更となる対応であるため、ある程度のアクセス件数を稼ぐサイトでは、検索の順位に大きなインパクトを与えるリスクがあります。そのリスクを最小限に抑えるため、現在独自ドメインを使っておらず、SSL化もしていないのであれば、この際まとめて行ってしまいましょう。
ドメインの取得は、使用しているホスティングサービスのサイトに詳しいことがあると思います。
外部で取得したドメインを持ち込むことも可能ですが、新規取得にあたっては連携などを考えるとあまりメリットはありません。さくらインターネットの場合は、マイページにアクセスし、そこから取得まで簡単に進めることができました。
独自ドメインのメリットは、唯一無二の自分だけのＵＲＬを持つことができるようになることです。そう聞くと、ドメインってお高いんでしょう？と思うかもしれませんが、.com .net .infoなどのドメインであれば、年間2,000円程度で持つことが可能です。
ドメインが有効化されると、「http://ドメイン名.com」のようなアドレス形式でアクセスできるようになりますので、サイトの内容に即した名前のドメインをつけることで、ユーザーからも信頼がおけるサイトとなります。
いよいよＳＳＬを有効にします。さくらインターネットはサーバコントロールパネルからＳＳＬを有効化するだけで使用できるようになります。
ＳＳＬを有効にしても、既存の初期ドメインが付与されているページにhttpでアクセスできなくなるわけではないので、設定をしたところで現在見ることのできるサイトには特に影響はありません。進めましょう。
ちなみに、さくらインターネットでの設定方法は、以下を参照しました。
参考 【無料SSL】サーバコントロールパネルからの導入手順さくらインターネット
手順③で、httpでアクセスできなくなるわけではない、と書きましたが、裏を返すと、何もしなければいつまで経っても訪問者はhttpでアクセスしに来ることになります。そういった訪問者に対して、特に意識させることなくhttpsサイトへ誘導する必要があります。
また、これが特に大事なのですが、既存ページが既にたくさんの被リンクを獲得していた場合、リンクして下さっている方に、新しいURLを通知して張りなおしてもらう…ということは現実的ではありません。
そのような場合に使うのが、既存のURLにアクセスしながらも、意識することなく新しいURLへと転送させる仕組みで、これをリダイレクトといいます。
これはユーザー目線と、検索エンジン目線の双方から必要になります。リダイレクトを適切に設定しないと、前述のhttpサイトへのアクセスが続いてしまうばかりか、SSL化したページと既存のSSL化していないページが重複していると見なされ、検索においてペナルティを受ける可能性もあります。
これを防ぐために、「.htaccess」ファイルによる「301リダイレクト」を行います。リダイレクトについている「301」というコードは、検索エンジン向けに「ページが恒久移転した」ということを周知することができます。これにより、検索エンジンは、古いページから新しいページにインデックスを修正します。
また、301リダイレクトによる移転は元のページの評価を引き継ぐという特性があるので、これをやらないで移転すると、検索エンジンの評価はゼロから出直すことになります。むしろ前述の重複サイトとしてマイナスになります。
リダイレクトの記述方法は、包括的に解説された詳しいページがあるため割愛しますが、リダイレクトのルールを記述したテキストファイルを作成し、最上位のディレクトリにＦＴＰソフトで配置するだけなので、さほど難しくはありません。
階層構造に変化がなく、https化と独自ドメインのURLにリダイレクトするだけであれば、数行程度の記述で済みます。リニューアルの第一段階として、既存ページをそのままSSL化するだけですので、特に記述量が多くもなりませんでした。
ただ、次のステップではWordPressに記事を移植します。その際にあえてURLは変更しようと考えているので、ほぼページ単位にリダイレクトルールを記載する必要が出てくることになります。
参考 サイト移転に必須!!301リダイレクトの為の.htaccess書き方5選FASTCODING BLOG
ここで私は、
初期ドメイン（http）から独自ドメイン（https）
のリダイレクトは設定しましたが、
独自ドメイン（http）から独自ドメイン（https）
のリダイレクトを失念していました。普通に考えたら分かる話ですが、すっかり頭から抜けていました。
これにより、独自ドメイン（http）と、独自ドメイン（https）のサイトが、それぞれ検索エンジンに登録されるということになりました。
リダイレクト設定①（これは設定した）
http://siby.sakua.ne.jp/ ⇒ https://shinakansen-travel.info/
リダイレクト設定②（設定漏れした）
http://shinakansen-travel.info/ ⇒ https://shinakansen-travel.info/
.htaccessファイルをアップロードしたら、サイトへアクセスしたり、リダイレクトチェッカーで正しく反映されているか確認しましょう。サイトへアクセスして確認する場合は、ブラウザのキャッシュを消してからでないと古いサイトが表示されることがあります。また、リンク切れが無いかも併せて確認します。
リダイレクトチェック以下のＵＲＬで簡単に可能です。複数回のリダイレクトがあれば、5回まで追跡してくれます。
参考 リダイレクトチェッカーツールWEB便利ツール＠ABASHI
特に情報提供系のサイトでは重要となります。情報の鮮度が落ちていると、この後行う広告サービスへの再申請時に不利に働く（質の悪いコンテンツとして認識される）可能性があります。
それ以前に、サイト運営者として訪問者に正しい情報を提供しなければならず、ユーザーファーストという視点から、古いコンテンツも見直しを行い、最新の情報を反映できるようにしておくのが望ましいと思います。
サイトをＳＳＬ化することで、アドレスバーに「鍵マーク」は出るようになったかと思いますが、アドレスバーの右端に、このように気になるアイコンが出ていることがあります。これはChromeですが、何やら危なげなアイコンです。
これは、ＳＳＬ化しているにも関わらず、保護されていない通信（http）により読み込むコンテンツが存在していることを示しています。
発生する理由としては、主に絶対パスで画像パスなどを指定している場合、そのパスがhttpsからのパスになっていないことが考えられます。
ちなみに、Chromeの場合、このアイコンをクリックして保護されていないコンテンツを表示するようにすると、アドレスバーの「https://」の部分が赤色となり、一目で危険であるというような見た目となります。
正直この状態は、httpサイトの「保護されていません」よりも視覚的に強烈になってしまうため、何とか原因を探し出す必要があります。
たかがSSL化とはいえ、URLが変更になるということは、検索エンジンから見たら「まったく別のサイト」に見えます。
よって、Googleなどの検索結果に反映されるためには、検索エンジンのクローラーが巡回してきてその結果を反映してからでないと、表示されません。特に何もしなくても、ここまで行ってきた作業をしていれば、クローラーが既存サイトを巡回してきたときにリダイレクトにより移転を察知し、適切に検索結果に表示してくれるようになりますが、そうなるまでに非常に時間がかかることがあります。
このため、グーグルのサーチコンソールにサイトを登録したり、サイトマップを再送するなど、新しいページを認識させてあげる必要があります。一刻も早くアクセス件数を回復したい場合には、実施してみると良いでしょう。
当サイトでは、ある一定のアクセス数があることが分かってからはグーグルアドセンスを貼っています。しかし、ドメイン移転を行った場合、再度審査を受ける必要があるということが分かりました。
これまで特に問題なく運営してきているので、特に問題はないだろうと思いましたが、申請してから同じような境遇の人のブログなどを見てみると、意外と最申請でポリシー違反などで引っかかっている人がいるようです。特に、記事数が増えていくと、どれがポリシー違反のページなのか、見当もつかないようです。
とりあえず、作戦としては、今すでにアドセンスを貼ることができている構成のまま、一旦審査申請を行い、審査が終わり次第WordPressに置き換えていくことにしました。
そして、この期間は、永遠のように長く感じられる時間でもあります。審査状況のページにも、「通常は1日足らずで完了」と書かれているにも関わらず、1日どころか2日、3日経っても連絡はありません。
ネットで調べると、申請した人のブログというのは星の数ほどあり、「すぐに通った」という人から「2週間かかって落ちた」という人まで、ほとんどバラバラな状態でした。しかし、2週間かかって落ちた、となると、精神的に相当ダメージがありそうです。
審査の申請をしてから6日間、ステータスは常に「承認手続きを進めています」でした。他のブログなどを見ていると、すぐに「審査中」に変わるとありましたが、どういう基準なのでしょうか。
もしかして申請してから忘れ去られているのかと思い、サイトの申請を削除をして再送信したくなる気持ちもありましたが、申請ページに、「削除しないでくれ。遅くなるから」と書いてあったのでぐっと抑えて待っていたところ、7日目の夕方ごろ、グーグルからメールで承認の連絡がありました。
大幅なサイトの変更は行わずに、コンテンツのリライトとプライバシーポリシーのページの新設のみを行った状態でしたので、本格的なリニューアルはやはりアドセンスの審査申請が終わってから実施するべきでしょう。
審査を待つ間、最終的な移行先となるWordPressをサーバーにインストールします。さくらインターネットは、簡単にWordPressのインストールが可能です。
他のホスティングサービスをご利用の方も、ルートディレクトリではなく、サブディレクトリにインストールするということだけ気を付けておけばよいかと思います。だいたいのホスティングサービスでは、インストール手順があるはずです。
参考 【WordPress】独自ドメインでWordpressをインストールするさくらのサポート情報
また、インストール後から手順⑫が終わるまでは、作業中のページがインデックスされないようにしておきましょう。ダッシュボードの「設定」⇒「表示設定」から、「 検索エンジンがサイトをインデックスしないようにする 」にチェックを入れておきます。
有料・無料を問わず、たくさんのテーマがあります。サイトがある程度できてしまうと、変更する際に不具合が出ることもあるので、長く使うつもりで慎重に選びましょう。
htmlサイトの記事をWordPressに書き起こします。そのままコピペ、と思いきや、それだけだとレイアウトが崩れたりすること必至なので、WordPress用に編集しなおしてやる作業が発生するはずです。ちなみに、静的サイトからの移行では「固定ページ」を使いなさい。と解説するページもありますが、記事の性質次第だと思います。htmlサイトでも、ブログ記事のような記事があれば、普通に「投稿」として追加してしまえば問題ありません。ただし、新規投稿するとその日付が投稿日付となりますので、できる限り最新の情報にリライトしてから公開したほうが、ユーザーのためになります。
記事をすべてWordPressに書き起こしたら、ついに最後の作業です。現在、WordPressはサブディレクトリにインストールされていますが、サブディレクトリのURLでアクセスさせるのはあまり綺麗ではないので、ルートディレクトリのURLでアクセスさせるように変更します。以下参考ページが詳しいです。また、古いhtmlページから移行する場合は、301リダイレクトによってWordPressのURLに誘導してあげる必要があります。私は古いhtmlページからURLを全て変えたので、「RewriteRule」に、1行ずつ紐づけを書いていきました…。
ここまで終われば、ひととおり移行作業は完了です。お疲れさまでした。
参考 WordPressのURLを変更する方法（サイトアドレスの修正）マサオカブログ
ここまでの移行作業で、サイトは無事にhttps化され、新しいドメインとなり、WordPressでの記事公開と、狙った形にすることができたと思います。
また、WordPressというのは、思ったほど敷居が高くなく、コンテンツの更新もWebブラウザだけで完結するため、非常に作業がしやすいです。これにより、面倒なサイト更新に対するモチベーションを保ちやすくなるのは間違いありません。
これまでのように、重たいエディタを立ち上げてソースコードを全ページ修正してFTPでアップロード…みたいな作業が一切不要となりました。また、デザインに優れるテーマを作って下さる方がいるので、自身でサイトをデザインする必要がないというのも、大きな利点です。
そして、放置することで下がってしまった検索順位は、記事の質を上げることでまた戻ってくるのか、楽しみなところではあります。
