2019/05/19

FC2ブログの1年間JPドメインプレゼント(有料会員)がお得なのか考えてみました。

FC2ブログで有料会員となると、1年間JPドメインプレゼントとありますが、これがお得なのかどうか、人によって結構違うようなので、書いてみます。

※結論的には、ずっとFC2ブログをつかい続けたい人で、「.jp」ドメインがいい!という人にはお勧め。それ以外は、お勧めではないと思います。

ドメインってなに?

このブログでは、「nknot.jp」です。「https://ドメイン名」となります。 WEBの世界では、IPアドレス(111.111.111.111のような数字の羅列)でサーバを特定しているのですが、人が覚えられないので、このドメイン名がブラウザに入力されたら、このIPアドレスに変換してアクセスしてくださいね。ということをしています。

fc2ブログですと「blog.fc2.com」がドメイン名です。それで、個人がブログを作成すると「(id).blog.fc2.com」(nknot.blog.fc2.com)と言った形となりidが付与されたドメイン名になります。

特に「(id).blog.fc2.com」でも困ることはありません。ただ、ドメイン名に「blog.fc2.com」が含まれているので、fc2ブログを使っているサイトなのか。だとか。ブログサイトなんだ。というのがURLからわかります。 ブログサイトは個人がやっているイメージが強いので、それがいいほうにも、悪いほうにもとらえられることがあります。 なので、ドメイン名に「blog」や「fc2.com」が入っていない、自分独自のドメイン名が欲しい!というときに、独自ドメインを取得します。

※独自にサーバを立てるときは、独自ドメインを取得する必要があります。

1年間JPドメインプレゼントに向いている人

独自ドメインは、ドメインを管理している会社に登録、運用してもらう必要があります。そのため有料です。 また、ドメインの種類によって金額が変わります。ちなみに、プレゼント対象の「.jp」は少し人気があるので、お高めです。「.com」や「.net」は安くなってきます。 fc2ブログで取得できるドメインの種類と金額はここから確認できます。

「.jp」は年間「2,780円」で、「.com」「.net」は年間「1,080円」です。そのため、1年間「.jp」が無料なのは結構お得感はあります。

そのため、「.jp」のドメインを、これからもずっとFC2ブログでお金がかかっても使いたい!という方には向いているかと思います。

それ以外にも、独自ドメインで少し試してみたいことがあるといった人にはいいかもしれません。

1年間JPドメインプレゼントに向いていない人

現在感じているのは大きく下記2点です。

  1. 「.jp」にこだわりがない人

    向いている人で書いていますが、「.jp」は年間「2,780円」で初年度だけ無料です。2年目には「2,780円」がかかります。

    例えば「.com」だと初年度「1,080円」かかりますが、2年目も同じ金額なので、総額「2,160円」となり、2年目の時点で「.jp」より安いことになります。

    なので、「.jp」にこだわりがない人は、ランニングコストの安い「.com」などのドメインをお勧めします。

  2. 将来別のブログや、レンタルサーバを考えている人

    FC2ブログでは、「JPドメインプレゼントキャンペーンやかんたん変換サービスで取得したドメインは、FC2ブログなどのFC2「かんたん変換サービス」の対応サービス内のみになります。」となっています。

    「かんたん変換サービス」ではいろいろ制限があるので、一番の問題は、他のサーバへの設定ができません。(FC2サービス内にしか使えません。)

    通常のドメインであれば、ドメインに紐づけるIPを変えることで、別サーバへ向けることができますが、それができません。

    また、ドメイン作成後60日後には、他のドメイン管理会社に移すことができますが、それもできません。

    なので、ドメインの運用を考えている人にはお勧めできないです。

私個人の感想ではありますが、FC2の1年間JPドメインプレゼントについては、FC2ブログから出て行かれないようにするための、しかも、2年目からコスト回収ができるFC2ブログ運営側よりの内容のようには見えます。

ただ、FC2ブログを使いたい。かつJPドメインが欲しい!という人にはお勧めできる内容だと思います。

※ちなみに、私は独自ドメインで少しためしてみたいことがあるので使っていますが、2年目は更新するつもりはありません。

2019/05/17

FC2ブログのスマホテンプレートにcanonicalを設定しておいたほうが良い

FC2ブログのテンプレートで、PCとスマートフォンのテンプレートをそれぞれで指定していたら、Googleに重複コンテンツだと言われてしまいました。 それも、大量に。。。 FC2ブログでは、PCとスマートフォンとで別のテンプレートを作成する人は以前投稿した「別ブログへ記事コピーしたのでcanonicalタグとは何か調べてみました」でご紹介したcanonicalを指定することをお勧めします。

なぜ、重複コンテンツとなると困るのか、どのようなcanonicalを設定したらいいのかを記載しています。

※ちなみに、特にブログの記事は自分個人の日記のようなもので、他の人に見てもらう必要はない!という人は問題のない話です。

重複コンテンツとなるとなぜ困るの?

まず、重複コンテンツとは何かですが、ブログでいうと同じ記事を複数投稿しているような状態です。例えば、記事数が多いほうが見栄えがいいなどと思い、1つの記事を日付や、少しだけ表現を変えて5つ投稿して5倍記事があるように見せるような場合です。

それでは、なぜ重複コンテンツとなると困るかですが、一番の理由は、Googleは重複コンテンツがあるサイトの評価を下げるそうです。評価が下がるということは、Google検索の結果に表示される場合、かなり下のほうにもしくは、表示されなくなったりします。※検索結果の最後のページなどに行くと、似たページは除外しているといったメッセージが表示されています。

これでは、せっかく書いた記事を多くの人に読んでもらうことはできませんよね。

なぜ、Googleは重複コンテンツがあるサイトの評価を下げるというと、検索結果に同じ記事が並んでいても、検索をする人からすると邪魔ですよね。Googleは質の良い検索を目指しているので、そういうページがたくさんあるサイトはペナルティとしてサイト全体の評価を下げるようです。

ちなみに、少量発生するのは仕方がないといった形で、ペナルティにならないこともあるようです。

ただ、FC2ブログでテンプレートをPC、スマートフォンで分けると、記事が2倍(オリジナルと、重複コンテンツが1対1)で発生することになり、重複の割合が高くなると考えられます。

なぜ、FC2ブログでテンプレートを分けると重複コンテンツとなるの?

スマートフォンのテンプレートで表示する場合、URLに違いがでるからです。具体的には、「blog-entry-XX.html?sp」のように.htmlの後ろに「?sp」がついているからです。

FC2ブログとしては、この「?sp」が付いているときはスマートフォンのテンプレートを表示する仕様にしているようです。

「xxx.html?sp」は何かですが、URLで指定するパラメータです。サイトによってはこの「?」の後ろにいろいろな情報を付与して、その条件にあった内容を表示するといったことができます。 例えば、「list.html?category=1」を指定するとカテゴリ1の内容だけ画面に表示させる。といったような感じです。※そのサイトが、そのように作られている場合での話です。なのでFC2ブログで同じ指定しても何も起こりません。

なので、「xxx.html?sp」とあると、Googleとしては、何かパラメータを与えるページだから、「xxx.html」とは別の内容のページだと判断します。でも、実際はテンプレートが違うだけで、同じ内容が表示されるので重複だ!と判断されてしまうわけです。

パラメータが付いているけど、同じファイル名「xxx.html」なんだから、それくらいわかってよと思ったりもしますが、FC2ブログでは自分では書いていないところで、「xxx.html」と「xxx.html?sp」のリンクがあるようで、Googleとしては、あなたのページで分けてリンクつけているでしょ!だからこっちも別ページとして扱います。ということになるようです。

どうのような対応するの?

以前投稿した「別ブログへ記事コピーしたのでcanonicalタグとは何か調べてみました」で紹介したcanonicalをテンプレートに指定することになります。 詳しくは、その記事に記載していますが、簡単に言うと、「URL(A)」は「URL(B)」のコピーですよ!なので、Googleはこのページを無視して「URL(B)」だけを対象にしてくださいね!と指定する方法です。 これを指定しておくと、Googleは、理由があって意図的に重複コンテンツがあるんだな。検索も「URL(B)」だけと言ってるので、「URL(B)」だけ対象にして「URL(A)」が重複していることは気にしないよ。となります。そのため、サイトの評価が下がったり、ペナルティはなくなります。

実際の対応手順は?

テンプレートを修正することになります。※テンプレートを修正する場合は、必ずバックアップを取得して作業してくださいね。FC2ブログではバックアップはとられていないので誤っても、もとに戻すことはできません。

  1. 管理画面にログインします。
  2. 左メニューの「設定」>「テンプレートの設定」をクリックします。
  3. 右側の「スマートフォン用」>「テンプレート管理」をクリックします。
  4. 右側の「[ sky_flow_sp ] のHTML編集」のheadタグ内(何行も記載)に下の内容を貼り付けてください。
    
      
        
      
    
    

    私は「」の行の下に貼り付けました。下のような感じです。</p> <pre> <title><%sub_title> - <%blog_name>

  5. 更新ボタンをクリックします。
  6. 作業としては以上です。PCで「blog-entry-XX.html?sp」にアクセスして、ページ内を右クリックしてソースを表示するとすると、HTMLのソースが表示されます。canonicalが表示されていればうまくできています。

せっかく書いた記事が、FC2のブログの仕様のせいで重複コンテンツとして判定され、Google検索で表示されなかったり、検索結果で最後のほうになったら嫌ですよね。 あらかじめcanonicalが設定されているテンプレートもあるかもしれませんが、いくつか見た中では設定されているものはなかったので、自分で対応する必要があるようですね。。

別の対応としては、テンプレートをPCだけにしてレスポンシブのテンプレートを選ぶというのがありますが、別の機会に書くことにします。

2019/05/03

FC2ブログに目次を表示できるようにしました。その設定方法等です。

ブログに目次が欲しいなぁ。と思ったのですが、FC2ブログではその機能が提供されていませんでした。※見つけられてないだけかもしれませんが。。

なので、自分で作ってみることにしました。※同じようなことをしてくれるJavaScriptのプラグインとかあるようですが、勉強のため自分で作りました。

20190503目次1

作成したJavaScript、CSSの記載方法や、テンプレートなどの設定方法を書きます。

※選択しているテンプレートや、別のJavaScriptと干渉してうまく動かない可能性もあります。この手順を実施される場合は、自己責任でお願いします。また、テンプレートを触りますので、必ずテンプレートのバックアップをとってから作業してください。

目次のメリットは?

記事の最初のほうに目次があると、最後まで読まなくても、記事の全体感がわかります。また、目次をクリックすると、直接その場所に遷移できるのもいいですね。

実際、他のサイトを見ているときに、目次があるとわかりやすいなぁ。と思っていました。

どのような目次を作成するの?

下記のような仕様の目次を作ってみたいと思います。
目次は自動生成させる

先にも書きましたが、FC2ブログには目次を自動生成する機能はないので、自分で作ります。

管理画面の記事作成では生成できないので、JavaScriptを使用して、ブラウザ側で記事を見たときに自動生成し、表示されるようにします。

JavaScriptのプログラム記載量を減らすために、jQueryを使用します。※jQueryはJavaScriptの記載を少し簡単にしてくれるものです。

hタグのタイトルを取得する

プログラムで取得する以上、ルールを設定する必要があるため、hタグのタイトルを目次の対象とします。

h1タグは、ブログ名や、記事のタイトルに使われているので、h2~h6のタグを対象とします。

※制約として、h2タグの次に、h3タグがなく、いきなりh4タグを記載するといったパターンには対応しません。頑張れば対応できると思いますが、その分処理時間もかかるため、イレギュラーなパターンは想定外とします。

ページ内リンクを設定(アンカーを設定)

目次内のタイトルをクリックすると、該当のhタグまで遷移するようにします。

自分で表示位置を指定できる

記事によって表示位置を変更したいこともあると思うので、特定のタグを記載した個所に表示されるようにします。

また、記事によっては、目次が不要な記事もあると思うので、特定のタグが記載されていない場合は、表示されないようにします。

トップページでも大丈夫

トップページでは最新の記事がいくつか並んで表示されますが、すべての記事のhタグが各記事内に表示されないように、記事単位で処理されるようにします。

目次の作成の流れ

下記のような流れで作成します。

  1. jQueryをテンプレートに設定する
  2. テンプレート内に記事のIDを設定する
  3. 目次作成用のJavaScriptをテンプレートに設置する
  4. 目次作成用のCSSを設定する
  5. 記事に目次作成用のタグを書き込む

目次の設定方法

では実際に目次を設置していきます。

jQueryをテンプレートに設定する

※すでにjQueryを読み込むようにしている場合はここは対応不要です。

※テンプレートを修正する場合、万が一のため、「複製」をクリックして現状のテンプレートのバックアップをとってから作業することをお勧めします。

まずは、ブログの管理画面を開き、左メニュー内の「設定」>「テンプレート」をクリックします。

画面右側を少し下に行くと、【[ テンプレート名 ] のHTML編集】があります。そのheadタグ内に下記の記載をします。
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script></p>

※headタグ内であれば、とりあえずどこでもいいのですが、私は下記のようにstylesheetを読み込む下に記載しました。
<link rel="stylesheet" href="<%css_link>">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>

記載後は必ずプレビューをクリックして、問題ないことを確認してから、更新ボタンをクリックしてください。

テンプレート内に記事のIDを設定する

トップページや、カテゴリ一覧などで、複数の記事が表示される場合に記事を区別できるようにテンプレートを修正します。

上の手順でテンプレートの修正画面へ遷移し、「<!--topentry-->」が記載されている個所を探します。「<!--topentry-->」の直下のタグに「id="entry_id<%topentry_no>"」を追加します。
※すでにid=xxxxの記載がある場合は、それを書き換えます。
※私の場合、すでにidの記載があったので、下記のように修正しました。

20190503目次2

目次作成用のJavaScriptを設置する

下記のJavaScriptをテンプレート内の下のほうにある</body>の上に記載してください。

<script type="text/javascript">
function get_index(target,index){
	let id_cnt=1,id_str,index_str="",target_tag,n_level="",b_level="",o_tag,i,tmp_str;
	target_tag =  "h2,h3,h4,h5,h6";
	target.find(target_tag).each(function(){
		if($(this).attr("id") == undefined){
			id_str = "index_"+index+"_" + id_cnt;
			$(this).attr("id",id_str);
			id_cnt++;
		}else{
			id_str = $(this).attr("id");
		}

		tmp_str = '<a href="#'+id_str+'">' + $(this).text() + '</a>';
		n_level = $(this).prop("tagName").substr(1,1);
		if(n_level > b_level){
			index_str += "<ol><li>"+tmp_str;
		}else if(n_level < b_level){
			for(i=0;i<(b_level - n_level);i++){
				index_str += "</li></ol>";
			}
			index_str += "</li><li>"+tmp_str;
		}else{
			index_str += "</li><li>"+tmp_str;
		}
		b_level = n_level;
	});
	for(i=0;i<(b_level - n_level);i++){
		index_str += "</li></ol>";
	}
	index_str += "</li></ol>";

	return index_str;
}
$(function(){
	let entry_id;
	$('[id^="entry_id"]').each(function(index){
		let index_head='<p> 目次 </p>';
		entry_id= $(this).attr("id");
		$("#"+entry_id+" .nknot_index_area").html(index_head+get_index($(this),index));
	});
</script>

※文字色が青の箇所は変更することができますが、後で記載する、cssおよび、記事へ目次を表示するタグの記載も合わせて同じ文字で変更する必要があります。

※h2~h6を対象にしていますが、変更したい場合は、「target_tag=」の箇所で対象としたいタグに変更してください。ただ、稼働テストはh3までしかやっていません。

※hタグに遷移するためidを設定するようにしていますが、すでにidが設定されている場合は、値を変更しないようにしているので安心してください。

目次作成用のCSSを設定する

テンプレートの編集の下のほうに【[ テンプレート名 ] のスタイルシート編集】という箇所があります。 その中を一番下までスクロールし、下記を追加します。

.nknot_index_area{
    border: 1px solid;
    margin: 30px;
    padding: 10px;
    background: #f0f8ff;
    line-height: 1.3em;
}
.nknot_index_area p {
    text-align: center;
    font-size: 1.2em;
}
.nknot_index_area  ol{
  counter-reset: cnt;
  padding-left: 0;
}
.nknot_index_area  ol li{
  list-style: none;
  margin-bottom: 8px;
}
.nknot_index_area  ol li::before{
  content: counters(cnt, ".") ". ";
  counter-increment: cnt;
}
.nknot_index_area  ol ol{
  counter-reset: cnt;
  margin-left: 20px;
  margin-top: 8px;
  margin-bottom: 0;
}
ol.nknot_index_area, ol.nknot_index_area ol, ol.nknot_index_area ol ol, ol.nknot_index_area ol ol ol, ol.nknot_index_area ol ol ol ol{
  padding-left: 1em;
}

※JavaScriptで青文字の文字を変更した方は同じ文字で変更してください。

※背景色を変えたい方は「.nknot_index_area」内の「background」を変更してください。※色の数字はGoogleでカラーコードなどで検索し、好きなコードを取得すれば大丈夫です。

記事に目次作成用のタグを書き込む

ここまでで、目次が作成される準備が整いましたので、最後に各記事内に目次を表示するタグを記載します。
目次を表示したい箇所に「<div class="nknot_index_area"></div>」を書いてください。
私の場合、下記のように記載しました。反映した実際の記事はここです。

20190503目次3

※JavaScriptで青文字の文字を変更した方は同じ文字で変更してください。

※私の記事はタグがいっぱい書かれていますが、hタグさえあれば動くはずです。

※記事の編集画面直下にある、リアルタイムプレビューには表示されません。プレビューボタンでは表示されます。

2019/04/28

FC2ブログの記事を一部はてなブログに移行手順

一部の記事をこのブログから、別のブログに持っていくことになりました。同じ「FC2ブログ」でもよかったのですが、せっかくなので別のブログである「はてなブログ」に持っていきました。

「FC2ブログ」から「はてなブログ」へ記事を持っていく手順を紹介します。とても簡単ですぐに持っていくことができました。

全体の流れ

大きく下記5点を行うだけです。全体で30分ほどで終わりました。

  1. はてなブログで新しいブログを作る
  2. FC2ブログで記事のバックアップを取得する
  3. はてなブログでインポート(記事の取り込み)をする
  4. 画像データを移行する
  5. 持っていかない記事を削除する

はてなブログで新しいブログを作る

こちらからはてなブログの画面に行き「無料でブログを始める」で作ることができます。

※ブログ作成は人によって違うので自由に作成してもらって大丈夫です。お勧めの初期設定としては、「ブログを公開したい範囲を選んでください」で「自分のみ」を選択しておくことです。こうしておくことで、記事を持って行っているの中途半端な時に、はてなブログ側で他の人に見られることがなくなります。完全に移行後、「すべての人に公開」にすることができます。

FC2ブログで記事のバックアップを取得する

FC2ブログにログインし、管理画面を開きます。

左サイドメニューの下のほうにある「データバックアップ」をクリックします。

そうすると、右側にバックアップ画面が表示されるので、「バックアップ」>「エクスポート」>「記事全部」の「ダウンロード」ボタンをクリックします。

少し待つとテキストファイルがダウンロードされてきます。※40記事ほどで1,2分かかったので記事の多い方は気長に待ってください。

ちなみに、開いてみるとタイトルや本文などが書かれています。※文字コードはUTF-8でした。

はてなブログでインポート(記事の取り込み)をする

はてなブログにログインし、画面右上に表示されているメニューの人の画像をクリックすると、さらにメニューが表示されます。ここで「設定」をクリックします。

左メニューにある「インポート」をクリックします。

画面右側に「ブログデータをアップロード」が表示されるので、「ファイルを選択」をクリックし、FC2ブログでバックアップしたファイルを選択します。この時「形式」は「MovableType形式」にしておきます。※2019年4月時点では、最初から「MovableType形式」になっていました。
ファイル選択後、右側に表示されている「文字コード選択へ進む」をクリックします。

最新の記事の内容が少し表示されるので、正しく読める文字コードを選択します。※2019年4月時点では、FC2ブログからUTF8でひ出力されていたので、一番上の「UTF-8」を選択で大丈夫です。
文字コード選択後、右側に表示されている「インポートする」をクリックします。

インポートの進行状況が表示されるので終わるのを待ちます。※記事がたくさんある人は時間がかかるので、一度閉じて後程この画面に来ても大丈夫です。

記事の取り込みが終わると、下のように取り込まれた記事数などを確認することができます。

画像データを移行する

次に画像データの移行です。同じ画面の下に「画像データの移行」が表示されていますので、「移行する」をクリックします。

移行開始のメッセージと、移行中の表示がされます。こちらは進捗状況が変わらなかったです。画像の移行も時間がかかるので、一度画面を閉じても大丈夫です。

ある程度時間が経過したら、再度この画面(インポート)にアクセスします。※私の場合は10分ほどのちに行いました。
「これまでのインポート」の行が閉じているので、「画像データの移行」をクリックして開いて状況を確認します。「移行完了」になっていれば移行完了です。

持っていかない記事を削除する

すべてのブログデータを持っていく人は不要です。私のように、一部のブログだけを持っていく人は、いらないブログを削除します。

左メニューの「記事の管理」をクリックします。

記事の一覧が表示されますので、削除する記事の左側のチェックボックスにチェックを入れ、右上にある「チェックした記事を削除」をクリックします。※誤って削除してしまっても、ゴミ箱がありますので、そこから復活することができます。

最後に、「はてなブログ」作成時に「ブログを公開したい範囲を選んでください」で「自分のみ」を選択した人は、左メニューの「設定」をクリックし、画面上に表示される「公開設定」をクリック、その後「すべての人に公開」を選択し、画面下部の「変更する」をクリックすると他の人にも公開されるようになります。

どうでしたでしょうか。本当にすごく簡単にブログ記事のコピーができてしまいました。なんとなくですが、はてなブログのほうが使いやすい気がしますね。特にゴミ箱はFC2にはないので万が一の時には助かります。FC2ブログはテンプレートの修正などできるなどのメリットもあるので、一概にどちらがいいとは言えないですけどね!

ブログを分割したい人や、はてなブログに移行したい人は試してみてはいかがでしょうか。※画像のデータ移行がとても簡単でびっくりしました!

2019/04/27

別ブログへ記事コピーしたのでcanonicalタグとは何か調べてみました

今回はcanonicalタグについて書いてみます。

なぜ、canonicalタグかというと、一部の記事を別のブログに持っていくことにしました。対象の記事は数日はこちらのブログにも記事を残したいと思ったためです。では、canonicalタグはどういうものかを次の章から記載します。

※最終的にFC2ブログで、記事毎にcanonicalタグを記載できないとの結論に達しましたが、せっかく調べたので記載します。

canonicalタグどんなもの?

canonicalタグは、異なるURLで内容が同じ記事が複数ある場合、「優先するURLを通知する」するもので、「URLを正規化するもの」らしいです。正直これを聞いてもわからないと思います。

もう少しわかりやすくすると、ある記事をコピーして複数のブログに配置したとします。GoogleなどでWEB検索をした際、検索結果にコピーした同じ内容の記事がいっぱい並んでも困りますよね。なので、この記事はこのURLのコピー品(代替品)なので検索結果に出さなくていいですよと明記したものです。この明記する方法(タグ)がcanonicalタグです。

でも単純に考えれば、記事を作った人は同じ内容でも、検索結果にいっぱい表示されたほうが人の目につきいいと思いますよね。ですが、実際にはそうとも言えません。※次の章に書きます。

コピー記事にcanonicalタグがないとどうなる?

結果からいうと、GoogleなどのWEB検索の結果の一覧に、コピーした記事がそもそも表示されなくなったり、サイト全体の評価が下がり、コピーしていない記事も含めて、検索結果の表示順がかなり下がったりします。なので、Google検索をする人達にサイトを見てもらえなくなります。

GoogleなどのWEB検索業者では検索結果にコピー記事がいっぱい並ぶことを嫌がります。なぜならGoogleなどのWEB検索業者を使いやすくし、より良いサービスにしたいためです。 例えば、情報を知りたくて検索した人が、この記事は必要な情報がなかったと思い検索結果に戻っても、同じコピー記事が並んでいたら、そのWeb検索の検索結果は使えないと思いますよね。結果、その人は別のWEB検索を使うようになります。 なので、GoogleなどのWEB検索業者としては、コピーされた記事は不要なのです。 そして、そもそもコピー記事を配置しているサイトは良くないサイトというのもあり、サイト全体の評価を下げて検索結果の表示順位を下げたりするペナルティを与えているようです。 せっかく書いた記事がgoogleやyahooなどで検索されないと、ブログを見てもらえる機会が減ってショックですよね。

canonicalタグはどう書くの?

html内のheadタグ内に下記のような行を追加します。今回は、移動先のブログを残していきたいので、移動先のブログのURLを書くことにしました。

<link rel="canonical" href="検索結果に出したい記事のURL"/>

実際に追加してみた際のHTMLソースです。※もともとこのブログ内に記載していた私の記事で試したものです。 canonical

FC2ブログで記事単位のcanonicalタグは設定できるの?

やめたほうがよいとの結論に。。

通常のブログでは、html内のheadタグ内は、記事本文からは変更できません。通常テンプレートに記載されています。また、FC2ブログではテンプレートを編集はできるのですが、記事毎に移動先のブログのURLを設定することはできません。

その為、今回はJavaScriptを使って、画面表示後にcanonicalタグを設定するようにしてみました。が、結果としてJavaScriptでタグの設定自体はうまくいきましたが、Googleはサポートしていないようで、うまくいきませんでした。

※同じブログ内で、PCとスマホのURLが違う場合のcanonicalタグの設定は他のサイトで公開されていたので、同じブログ内であれば可能のようです。

※一旦、最大手のGoogleで確認しました。実際には正しく認識することもあるようですが、JavaScriptで変更するのは想定外とのことなのでうまくいったとしても、いつダメになるかわかりません。また、別の記事で試したところ、うまくいったものもあり、原因がわからないため、JavaScriptではやらないほうが安全です。

検証した内容

JavaScriptでhead内にcanonicalタグを追加するコードを書いたのち下記を確認しました。

  • ブラウザの開発者ツールでcanonicalタグが正しく追加されていることを確認。こちらはうまくいきました。
  • Google Search Consoleの「公開URLテスト」を実施。「ユーザーが指定した正規 URL」は「なし」のまま、「テスト済みのページ」でHTMLのソースを見るとcanonicalタグが反映されていませんでした。
  • 後日、Google Search Consoleの「クロール済みのページを表示」で確認しましたが、ある記事ではcanonicalが表示され、ある記事では表示されていませんでした。また、「クロール済みのページを表示」でcanonicalが表示されている記事でも、「ユーザーが指定した正規 URL」で正しく設定されている記事や、「なし」と表示されており、正しく設定されていな記事もありました。

今回、canonicalタグについては勉強になったのですが、無料ブログサービスなど、記事の内容しか変更できないブログサービスでは、canonicalタグは設定できないことがわかりました。ちょっと残念でした。レンタルサーバでWordpressや、MovableTypeを使用すようにすると、いろいろ自分の好きなようにできるのだろうなぁと思いました。