Home > SEO
SEO
Google が検索エンジン最適化（SEO）方法を示したクイックチェックシートを発表しました。
このシートに従えば、Google の検索エンジンに自分のブログの内容がより正確に伝わるはず。更新時のちょっとした努力で、検索サイト経由のアクセス数が大幅に上昇する…こともあるかもしれません。
実物はリンク先で見てもらうとして、こちらではそれぞれの項目を実現するために、Blogger でどういうことをすればいいか見ていこうと思います。
１．検索結果での見栄えを良くする
Ａ．ページのタイトル情報
ページのタイトル情報は、Google の検索結果で表示されるタイトルの候補として利用されます。あなたのビジネスを簡潔でわかりやすく説明するものにしましょう。ページには分かりやすいタイトルをということですね。「ホームページ」とか漠然としたものはやめた方がいいとのこと。検索にヒットさせるために、固有名詞など、具体的な表現を使うがいいかと。タイトル情報に現れる順序にも意味があるようなので、ブログタイトルと投稿タイトルの順を変えるというのもアリかもしれません。
Ｂ．ドメイン名、URL
ドメイン名は Google の検索結果の重要な要素です。ウェブサイトには、わかりやすくて読みやすいドメイン名、URL を設定しましょう。数字の羅列のような意味のない URL を避けて、意味のとりやすいものにせよとのこと。Blogger では、2012 年から自分で投稿の URL が指定できるオプションがついているので、それを活用すればいいと思います。
Ｃ．メタデータ（descriptions）
メタ データ（descriptions）はページの概要を表すものであり、Google や他の検索エンジンの検索結果ページで頻繁に使用されます。ページごとに、160 文字以下の固有の説明を設定しましょう。ページの概要を示すメタタグ
<meta name="description" content="なんとかかんとか…" /> のことですね。2012 年から Blogger でも、この赤字部分を投稿画面から設定できるオプションが用意されています。ブログ管理画面「設定 ＞ 検索設定」ページの「メタタグ ＞ 説明」欄にブログ全体の説明を入力すると、各投稿の編集画面にも「検索用説明」入力欄が現れるようになります。
２．画像が Google に認識されるようにする
Ａ．画像ファイル名
画像ファイルには短くてわかりやすい名前を付けましょう。アップロードする前の画像のファイル名の話です。「DSC_1234.JPG」みたいなのより、意味のある名前にした方がいいということだと思います。
Ｂ．画像の alt 属性
「alt」属性で画像の内容を説明しましょう。この情報により Google が画像の内容を認識しやすくなります。画像タグ
<img src="temple.jpg" width="500" height="375" alt="Temple" /> でいう、赤字部分ですね。Blogger の投稿編集画面、「作成」モードで画像を追加した後、画像をクリックして「プロパティ」リンクをクリックすることで、「代替テキスト（alt）」を入力することができます。
Ｃ．キャプション
ページ上の各画像の下に短いキャプションを添えます。重要な情報は画像ではなくテキストで表しましょう。これも Blogger に用意されています。Blogger の投稿編集画面、画像をクリックして「説明を追加」リンクをクリックで、画像のキャプションを入れることができます。
３．更新を頻繁に行う
ウェブサイトはお店の店頭のようなものです。そう考えると、6 か月も放っておくというのはあり得ないことです。ブログを開 設したり、新商品やセール情報、特典の案内を掲載したりして、サイトをいつも最新の状態にしておきましょう。これまでに紹介した内容を守りつつ、マメにブログを更新しないといけないようです。古い記事ばかりで、Google から「あり得ない…」と呆れられないようにしないといけませんね。
でお知らせしたとおり、Blogger でも各投稿の URL（パーマリンク）を自由に指定できるようになりました。そうなると、迷うのが各投稿にどういう URL をつければいいのかという点。参考になりそうな記事を見つけたのでご紹介します。
日本語にすると「Blogger のパーマリンクを最適化するための正しい方法」という、なかなか強気のタイトルです。
ポイントを短くまとめてみるとこんな感じ。
4 単語以内にする
ページファイル名は短いほどいいです。検索エンジンでは、ファイル名に単語が 5 つ以上あっても大抵 4 単語に切り取り続きを表示しないようにしています。そのため、企業のメディアやニュースブログの多くがこの制限に従っています。
30 文字以内にする
Google や Yahoo は、ページファイルのタイトルの最初の 30 文字を表示し、Bing は 36 文字表示します。Bing はともかくとして、Google や Yahoo に対応するため、30 文字以内にするのがいいでしょう。
投稿タイトルを要約する
投稿タイトルを単純に英訳して並べるのではなく、要約して短くまとめます。前置詞や冠詞は省いても OK です。それらをキーワードにして検索する人は、ほとんどいませんから。
投稿タイトル中のキーワードを言い換える
検索の際にいろんな単語でページがヒットするように、投稿タイトル中のキーワードを別の単語に言い換えて URL に含めるというのも一つの手です。
単語の区切りにはハイフンを使う
Blogger 以外のブログサービスでもそうしているように、単語の区切りにはハイフン（-）を使うのがいいでしょう。ハイフンとアンダーバーで扱いを変えている検索エンジンもあるようですし（参考）、アンダーバーで単語を区切るのはあまりよくありません。
ページファイル名は短いほどいいです。検索エンジンでは、ファイル名に単語が 5 つ以上あっても大抵 4 単語に切り取り続きを表示しないようにしています。そのため、企業のメディアやニュースブログの多くがこの制限に従っています。
30 文字以内にする
Google や Yahoo は、ページファイルのタイトルの最初の 30 文字を表示し、Bing は 36 文字表示します。Bing はともかくとして、Google や Yahoo に対応するため、30 文字以内にするのがいいでしょう。
投稿タイトルを要約する
投稿タイトルを単純に英訳して並べるのではなく、要約して短くまとめます。前置詞や冠詞は省いても OK です。それらをキーワードにして検索する人は、ほとんどいませんから。
投稿タイトル中のキーワードを言い換える
検索の際にいろんな単語でページがヒットするように、投稿タイトル中のキーワードを別の単語に言い換えて URL に含めるというのも一つの手です。
単語の区切りにはハイフンを使う
Blogger 以外のブログサービスでもそうしているように、単語の区切りにはハイフン（-）を使うのがいいでしょう。ハイフンとアンダーバーで扱いを変えている検索エンジンもあるようですし（参考）、アンダーバーで単語を区切るのはあまりよくありません。
もちろんこれが絶対的なルールというわけではないんですが、カスタムパーマリンク指定の際のひとつの目安として、覚えておくといいかもしれませんね。
いつも Blogger への移行方法ばかり書いてきたので、たまには Blogger からの移行についても、リンクを紹介しようと思います。
Blogger から WordPress へと引っ越してブログデータを移行した際に、おそらく問題となるのが古いページへのアクセスです。検索サイトからのアクセスや、せっかくリンクを張ってくれたブログからのアクセスなんかが、急になくなってしまうのはさみしいですもんね。
古いページから新しいページへと自動的にリダイレクトできれば問題ないんですが、Blogger と WordPress はページの URL の構成が異なるので、そうすんなりとはいきません。
こういったことでお困りで、.htaccess や PHP の設置なんかにそれほどハードルの高さを感じないという人は、これらのブログを参考にしてみてはいかがでしょうか？
カスタムドメインの Blogger ブログから WordPress へ移行した場合に、旧ページへのアクセスを .htaccess で新ページへとリダイレクトしてくれます。
上のリンク先の内容を踏まえた上で、blogspot.com（blogspot.jp）からの移行に対応します。旧ページへのアクセスを JavaScript で新サイトへ飛ばし、そこから .htaccess でリダイレクトされるという仕組みのようです。
旧ページに対する検索エンジンのインデックスはいずれ減少していくものと思いますが、Blogger 時代に得たリンクが、新しいブログサービスでもできるだけ生かせるといいですね。
Blogger ブログの各エントリには、個別の URL（いわゆるパーマリンク）がついています。これまで、Blogger のパーマリンクは、投稿タイトル中のアルファベットを元にして、自動的に生成されてきました。この Blogger の自動 URL 付加の仕組みについては、以前に記事にしているので、興味のある人はご確認を。
上のスクリーンショットのように、Blogger in Draft からブログの新規投稿を行うと、投稿オプション設定に「パーマリンク」という欄が出てきます。
ここに
blogger-custom-permalink と入れると、このブログの場合だと、http://www.kuribo.info/2012/07/blogger-custom-permalink.html という URL になります。
これまで、投稿を公開し終えるまでその記事の URL が分からなかったことを思うと、前もって URL が分かるだけでもずいぶん進歩です。さらに URL を自由に指定できるとは！ブログ URL 中の単語自体 SEO に影響があると言われてすでに久しいですが、Google 傘下の Blogger もようやく SEO に本腰を入れてきたというところでしょうか。
このカスタムパーマリンク機能ですが、一応注意点をあげておくと、
- パーマリンクのカスタマイズは Blogger ではなく、Blogger in Draft から。
- URL で使えるのは半角英数とハイフン
-とドット（ピリオド）.。 - ハイフンやドットは、ファイル名の先頭でも末尾でも使える。連続もＯＫ。
- 大文字と小文字は区別される。（ABC と abc は別）
- 文字数制限なし。長すぎても公開はできる。アクセスすると 414 エラーが出る場合も。100 文字は OK、3000 文字は無理でした。（テスト）
- URL が指定できるのは、新規投稿時のみ。公開済み投稿の URL は変更できない。
…と、こんなところです。現在 Blogger in Draft にしかない機能のため、途中で仕様が変わる可能性も大いにあります。パーマリンクの指定は、無理せずこれまでの Blogger のきまりにしたがって、半角英小文字とハイフンのみ、39 文字以内にしておいた方が無難でしょうね。
関連：
追記（2012-07-18）：
コメント欄で教えてもらいました。このカスタムパーマリンク機能が、Blogger in Draft を卒業して、Blogger 標準でも使えるようになりました。
Blogger （新インターフェースダッシュボード）に新しい設定項目が増えました。その名も「検索設定」。
- メタタグ
- エラーとリダイレクト
- クローラとインデックス
メタタグ
Blogger の「検索設定」で設定できる「メタタグ」というのは、Google などの検索エンジンに「ここは、こんな内容のページですよ」と伝えるためのタグ
<meta content='クリボウが Blogger の機能の実験をしているブログです。' name='description'/>
のこと。Blogger では「検索記述子」と呼ぶようです。（ヘルプ）この項目の入力欄には、赤字部分にあたる、ブログの説明を入力します。
この入力欄に説明を入れても、ページのソースに description の meta タグが出ない場合には、テンプレートの <title>... </title> の次の行に
<b:if cond='data:blog.metaDescription != ""'>
<meta expr:content='data:blog.metaDescription' name='description'/>
</b:if>
というコードを挿入するといいです。<meta expr:content='data:blog.metaDescription' name='description'/>
</b:if>
エラーとリダイレクト
ここには２つの項目があります。
- カスタム ページが見つかりません
- カスタム リダイレクト
ややこしい表記ですが、「カスタム ページ」が見つかりませんではなくて、カスタム「ページが見つかりません」です。誤った URL やすでに削除されたページの URL でアクセスされた場合に、表示するメッセージをカスタマイズできるようになりました。（ヘルプ）
以前は、ブログとは別の Blogger の 404 ページが表示されていたんですが、いつの間にかこのメッセージがブログ内で表示されるようになっています（例）（ちゃんと 404 ステータスコードは出る）。この、ページがない時にブログ内に表示されるメッセージを、ブログ運営者が指定できるようになったというわけ。
カスタム リダイレクト
ブログ内のディレクトリやページへのアクセスを、同じブログ内の別のディレクトリやページへリダイレクトすることができます。（ヘルプ）
この機能を使うと、記事の整理や訂正などでページを削除した場合に、削除したページへのアクセスを別の新しい記事に振り向けることができます。
これは、別に削除したページの URL に限った話ではないので、特定の投稿や「ページ」に別のわかりやすい URL を付けて、読者に知らせたりするのにも便利です。
クローラとインデックス
ここにも２つの項目があります。
- 独自の robots.txt
- 独自の robots ヘッダー タグ
検索エンジンのクローラがサイトを訪れた時に確認するのが robots.txt というテキストファイルです。クローラは robots.txt の内容から、どのページをインデックスすべきか判断します。
robots.txt 自体は、以前から Blogger ブログにも用意されていました（参考）が、今回このファイルの内容もブログ運営者側で指定できるようになりました（ヘルプ）。
この設定は、ブログの特定の記事を検索エンジンにインデックスしてほしくないときに使います。詳しくは、Google ウェブマスターツールのヘルプを確認してください。間違って指定すると、ブログ内の全ページが検索エンジンから削除されてしまう可能性もあるので、基本的にこの項目は触らなくていいと思います。
独自の robots ヘッダー タグ
これも先の「メタタグ」と同様に、検索エンジンのクローラに、「このページをインデックスする・しない」「リンクをたどる・たどらない」といった情報を伝えるためのタグです。
この項目では、Blogger によってブログのページに書き出される
<meta content='noindex,nofollow' name='robots'/>
というコードの赤字部分を、「all, noindex, nofollow, none, noarchive, nosnippet, noodp, notranslate, noimageindex, unavailable_after」の選択肢から、チェックボックス簡単に指定することが可能です（ヘルプ）。各値の詳細は、Google ウェブマスターツールのヘルプで確認してください。
rel='nofollow' 属性のリンク
「検索設定」については、以上なんですが、検索関連でもう一つ Blogger に新しい機能がついています。
それは、投稿内のリンクで
rel="nofollow" 属性を追加できるようになったこと（ヘルプ）。ブログの投稿エディタで別ページにリンクを張るときに、「Add rel='nofollow' attribute」というオプションが選べるようになっています。この属性のついたリンクのリンク先は、検索エンジンのクローラで追跡されません。Google ウェブマスターツールの ヘルプ では、「信頼できないコンテンツや有料リンク、クロールの優先順位付け」といった場合に、この属性を追加することが推奨されています。
…とまあ、Blogger の SEO 対策設定についてみてきましたが、ようやく Blogger も「Google のブログ」という感じになってきましたね。今後の機能追加にも、期待大です。
（画像は実験中のもの）
Blogger のブログの投稿単独のページは、
クリボウの Blogger Tips: Blogger の「スライドショーガジェット」の画像表示サイズを大きくする方法
のように、通常「ブログタイトル: 投稿タイトル」という順番でページタイトルがつけられています。が、テンプレートをカスタマイズすることで、これを
Blogger の「スライドショーガジェット」の画像表示サイズを大きくする方法 | クリボウの Blogger Tips
のように「投稿タイトル | ブログタイトル」の順に変更することが可能です。今回区切り文字に
| を選んだのは、Blogger のダイナミックビューで、ページタイトルが「投稿タイトル | ブログタイトル」となっているので、それに合わせたもの。手順
１．ブログの管理画面「テンプレート ＞ HMTL の編集」（旧インターフェースでは「デザイン ＞ HMTL の編集」）を開く。
２．次のコードを見つける。（ブラウザの検索機能を使うと便利です。）
<title><data:blog.pageTitle/></title>
３．見つけたコードを次のものに書き換える。
<b:if cond='data:blog.pageType == "item"'>
<title><data:blog.pageName/> | <data:blog.title/></title>
<b:else/>
<title><data:blog.pageTitle/></title>
</b:if>
<title><data:blog.pageName/> | <data:blog.title/></title>
<b:else/>
<title><data:blog.pageTitle/></title>
</b:if>
４．「テンプレートを保存」ボタンを押す。
これだけです。
備考
静的ページ（Blogger のいわゆる「ページ」）も同様にページタイトルを変更したい場合には、３のコードを
<b:if cond='data:blog.pageType == "item"'>
<title><data:blog.pageName/> | <data:blog.title/></title>
<b:else/>
<b:if cond='data:blog.pageType == "static_page"'>
<title><data:blog.pageName/> | <data:blog.title/></title>
<b:else/>
<title><data:blog.pageTitle/></title>
</b:if>
</b:if>
にします。<title><data:blog.pageName/> | <data:blog.title/></title>
<b:else/>
<b:if cond='data:blog.pageType == "static_page"'>
<title><data:blog.pageName/> | <data:blog.title/></title>
<b:else/>
<title><data:blog.pageTitle/></title>
</b:if>
</b:if>
もちろん、投稿タイトルとブログタイトルの間の区切り文字は、違うものでも構いません。別のものにしたい人は、３のコードの赤字部分を差し替えてみてください。
