SEOパワーを引き継いだサイト移転でスタートダッシュを決めよう！はてなブログ編

リダイレクトアイキャッチ

咳が止まらず、病院行ったら風邪が発覚した苦労詐欺だ。
全て喉にきたらしく、体は比較的だるくないのでブログぐらいなら普通に書ける。

前々から、はてなブログからWordPress等の他のサービスに引っ越す人が出てきてたね。
引っ越すとアクセス数が落ちるって心配してる人も多いよね。

アクセス数が落ちる原因は認知度的な問題とかもあるんだろうけど、引越し前のサイトのSEOパワーを上手く引き継げてないってのもあると思う。
今回はSEOパワーを引き継いだままはてなブログから他のサービスに引っ越す方法を教えるよ。

逆にはてなブログに引っ越してきたいって人もいると思うから、そっちの方法も別記事で教えるよ。
サイトお引っ越しシリーズってことで、この記事とあわせて記事を合計2本書く予定だよ～

はてなブログは.htaccessが使えない

一度WEBサイトを作ってFTPソフトを使いサーバーに繋げるなどを経験したことある人は「.htaccess」なるファイルを見たことがあると思う。
これはサーバーそのものをコントロールできるファイルで、サイトの管理者自身で書き換えることができるよ。

通常はこの「.htaccess」のファイルに「301リダイレクト」という、サイトを訪れたユーザーを新しいサイトへ飛ばす処理を入れて移転をさせる。
だけど、はてなブログのようなサイトだと自身のサイトが保存されているサーバーそのものに接続ができないよ。

「.htaccess」や「301リダイレクト」については別記事で説明するからそっちを参照してね～。
サーバーに接続ができない、はてなブログのようなシステムを使っている人のために、SEOパワーを引き継がせてサイト移転させる方法を教えるよ。

普通のリダイレクト方法(ユーザーを新ページに飛ばす方法)だとSEOの効果を引き継げねぇの？

サイトを訪れたユーザーをリダイレクトさせる方法はそれなりにあるけど、ちゃんとSEOパワーを引き継ぐことができてないわね。

SEOパワーを引き継いで移転させるメリットて何なの？

PV数・アクセス数の大幅な低下を防げるのと同時に、検索順位の大幅な下がりもある程度抑えられるわよ。

尚更SEOパワーを引き継いでリダイレクトさせるほうがええな。

はてなブログみたいなシステムだとサーバーに接続ができないから、SEOパワーを引き継いでリダイレクトさせれる「301リダイレクト」ができないよ。
SEOパワーを引き継げれば、PV数・アクセス数の大幅な低下や検索順位の大幅なダウンをある程度抑えられるよ。
このサイト内の記事もGoogle新アップデートの記事以外は別サイトからリダイレクト＆リライトでできてるよ。

canonicalとは

「301リダイレクト」が使えない状態で、SEOパワーを引き継がせたままサイト移転させるにはまず「canonical」というHTMLのタグを設置する必要があるよ。
このタグは一つしかないページに複数入り口がある場合、どれが正しい入り口なのかをGoogle検索エンジンに教えてくれるタグだよ。

URLの正規化とも言われてるんだけど、わかりにくいから例をあげて説明するよ。

適当なサーバーにサイトを一つつくり、「http://www.sample.com/」という独自ドメインを取得する
この独自ドメインをただ設定するだけだと、実は「http://sample.com/」と入力しても同じサイトに接続することができてしまう。
この場合「http://www.sample.com/」と「http://sample.com/」の2つの入口ができてしまう。
どちらが正しいURLなのか教えないとGoogle検索エンジンは勝手に入り口が2つあるものと認識してしまう。
結果、本来1つのサイトでもらえる評価が2つに分散してしまい、通常よりも評価が低くなってしまう。

頭のいいGoogle先生でも、こうゆうことには滅法弱く、僕ら側で「正しいURLはこれだよ」と教えなくてはいけないよ。
そのために「canonical」を使って「正しいURLはこれ」と教えてあげるんだよ。

↓のタグを該当ページのheadタグ内に設置することで、正しいURLをGoogle検索エンジンに伝えることができるよ。
「href=""」の「"」で括らている部分を伝えたいURLに書き換えて使ってね。

<link rel="canonical" href="http://www.sample.com/">

正しいURLを伝えていることはわかったけど、サイトを訪れたユーザーを新サイトに飛ばす機能はないの？

残念ながら「canonical」は正しいURLを検索エンジンに伝える以外の機能はないわよ。

上記の使い方以外にも、同じ商品の色違いごとでページを作った時に、メインとなるページのURLを伝えれば、内部でのコピー回避にもなるわよ。

なるほど、そうゆう使い方もあるのな。

canonicalはページへの入り口が複数存在している時にどの入口が正しいのか検索エンジンに伝えてくれるタグだよ。
これを設置することで検索エンジンからの評価が分散してしまうのを防いでくれるよ。
同一商品の色違いなんかでページ数を増やした時もこのタグでひとまとめにすることで、サイト内でのコピーを防げるよ。

meta refreshとは

「canonical」で正しいURLを検索エンジンに伝えることができるようになったけど、これを設置しただけだと意味ないよね？
サイトやページにきたユーザーを新しいサイト・ページへ移動させるための処理が必要になってくるね。

そんな時に「canonical」タグとセットで使うのが「meta refresh」だよ。
このタグが設置してあるサイト・ページを訪れたユーザーはこのタグで指定したURLに強制的に移動させられるよ。

親切設計で飛ばされる前のサイトから新サイトまでの滞在時間とかも設定できるよ。
↓のコードをcanonicalと同じようにheadタグ内に設置すれば指定した秒数後に指定したURLへと飛ばすことができるよ。

<meta http-equiv="refresh" content="秒数;URL=飛ばす先のURL">

「content=""」の「"」で括らている部分内「秒数」と「飛ばす先のURL」を該当のものに変更すれば使えるよ。
「秒数」は「5」とか入れるだけで、5秒後にサイト移動させることができるよ。

これだけだとまだちょっとわかりづらいな～。

そんな人のために例を書いたわよ

<meta http-equiv="refresh" content="5;URL=http://www.sample.com/">

この場合だと5秒後に「http://www.sample.com/」のページに飛ばすって処理になるわよ。

なるほど。さっきのコードと見比べると、変更する箇所がわかるな。

meta refreshタグは設置されているページを訪れた人を指定したURLに飛ばす処理を行ってくれるタグだよ。
親切設計で前のサイトでの滞在時間を設定させることができるよ。
meta refreshはcanonicalと共に各ページへの設置が必要だよ。

はてなブログならJavaScriptを使ってユーザーを移動させよう

「canonical」と「meta refresh」を使えば、「301リダイレクト」が不可能なサイトでもSEOパワーを引き継がせてのサイト移転ができるよ。
ただし、この方法の場合、極力各ページと一致するページに飛ばしたほうが良いから、1ページごとにURLを変更して設置する必要があるよ。

コードをコピペして、URL部分を対応するURLに変更すれば良い。
気がついている人もいると思うけど、この方法は各ページの「headタグ」内を個別に設定できることが前提になってるよ。

そうなんだ、実は各ページの「headタグ」をいじれないはてなブログはこの方法を取るのが難しいんだ。
ついでに言ってしまうと、はてなブログだと各ページで勝手に「canonicalタグ」が生成される仕組みになっているんだ。

SEO特化ブログを作るために、元の雑記ブログから記事をいくつか移転させる予定だったのに、調べて軽い絶望感を覚えたよね(；・∀・)
そんな時に救いの神となったのが、JavaScriptによるcanonicalの書き換え＆サイト・ページ移動方法だったよ。

この方法でもちゃんとSEOパワーを引き継いでリダイレクトしてくれるみたいだよ。
今回参考にさせてもらった記事が↓

ブログ移転時必見！はてなブログ(無料)からリダイレクトをする簡単で効果的な方法！

記事を読むとわかるけど、この記事に掲載されているコードは「はてなブログからWordPress」への移動限定のものだよ。
だから、今回僕はそれを参考に、はてなブログの共通head部分に設置しても使えるようなものを作ったよ。

まずはサイト内でJavascriptが使えるように↓のコードを設置

<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>

これを設定→詳細設定→検索エンジン最適化→headに要素を追加の部分に貼り付けよう。
これでサイト内でJavascriptを使うよって宣言しているよ。

次が本題で、↓のコードをデザイン→カスタマイズ(スパナマーク)→ヘッダ→タイトル下のところに設置

<script type="text/javascript">
  if( location.href == '移行前の旧URL'){
  // リダイレクト
  setTimeout("redirect()", 5000);　// 5秒後に移動
  function redirect(){
    location.href = "移行後の新URL"; 
  }
  // canonical の書き換え
  var link = document.getElementsByTagName("link")[0];
  var url = "移行後の新URL";
  link.href = url;
}
</script>

「移行前の旧URL」と「移行後の新URL」部分を一致するものに書き換えてね。
「setTimeout("redirect()", 5000)」内の数字部分は秒数で「5000」だと5秒、「10000」だと10秒になるよ。

この記述の場合、1つのURLしか指定できないようになっている。
複数ページやサイト全体を移行させるのなら、更に↓のように書き換えよう

<script type="text/javascript">
  if( location.href == '移行前の旧URL1'){
  // リダイレクト
  setTimeout("redirect()", 5000);　// 5秒後に移動
  function redirect(){
    location.href = "移行後の新URL1"; 
  }
  // canonical の書き換え
  var link = document.getElementsByTagName("link")[0];
  var url = "移行後の新URL1";
  link.href = url;
}else if( location.href == '移行前の旧URL2'){
  // リダイレクト
  setTimeout("redirect()", 5000);　// 5秒後に移動
  function redirect(){
    location.href = "移行後の新URL2"; 
  }
  // canonical の書き換え
  var link = document.getElementsByTagName("link")[0];
  var url = "移行後の新URL2";
  link.href = url;
}
</script>

これで↓の4つを対応しているものに書き換えれば、ページごとのcanonicalタグ書き換えとリダイレクトが行われるよ。

移行前の旧URL1
移行後の新URL1
移行前の旧URL2
移行後の新URL2

更にページを増やしたいときは「else if」のあたりから「}」部分までをコピーして、「}」と「＜/script＞」のあいだ辺りに貼り付けて。
同じようにURLを修正していけば、何ページでもリダイレクトさせることができるよ。

スマホサイトがPCサイトと別で表示される人も、スマホサイト用の設定部分のヘッダのところに同じものを設置すればいいよ。

これは毎度コピーして追加していかないといけない感じ？

そうね、毎回手動でやるようなものだけど、ドメインそのものを変更するJavascriptはもっと骨が折れるわ。

管理人のにわか知識じゃあさすがに厳しいか。

本人もいずれJavasriptは勉強したいと思っているのよ。

headをページで個別に書き換えることができるのなら、canonicalタグ＋meta refreshタグでのリダイレクトがおすすめ。
はてなブログは個別でheadを書き換えることができないから、今回はJavascriptを使用したよ。
Google検索エンジンは簡単なJavascriptなら読み込んでくれるよ。