経済的自由のススメ

好きなことで労働所得を得て、投資で不労所得を得て、それを死ぬまでに全部使い切る、という生き方のススメ

はてなブログの新しい「高度なタイトル設定」というのは一体何なのか

昨日、生まれて初めて買った株の話について書いていたら、「編集オプション」の一番下に「高度なタイトル設定」という、今まで見たことがない謎の設定オプションがあることに気づきました。面倒だったので昨日は無視したんですが、今日やっぱり気になって調べました。

はてなブログ開発ブログでは、このように説明しています。

はてなブログで記事ページ(1つの記事だけのパーマネントリンク)を表示すると、記事編集画面の「タイトル」欄に入力した記事タイトルが、さまざまなタイトルのデータとして利用されます。今回の機能追加により、このうちHTMLのヘッダ部に記述されるtitle要素とog:titleを個別に設定できるようになりました。

http://staff.hatenablog.com/entry/2016/06/22/112000

この説明で「高度なタイトルの設定」をどう使えばいいのか分かった人は、この先を読む必要はありません。よければ代わりにあたしが昨日書いた生まれて初めて買った株の話でも読んでくつろいでいってください。

この説明読んで「はあ??つまりどういうことよ???」と思った人、あたしもそう思いました!で、よく分からないなりに調べましたので、よければ読み進んでください。

記事タイトル、title要素、og:titleとは

まず、なんなのそれ?という疑問から。

記事タイトル

これは簡単ですね。文字通り記事のタイトルです。編集画面にあるこれです。↓

記事タイトル

HTMLのヘッダ部に記述されるtitle要素

これは実際にページのヘッダ部分のHTMLのtitleタグの中に入っている内容です。Googleの検索結果のタイトルなどに使われます。はてな仕様のデフォルトは「記事タイトル - ブログ名」です。あたしが昨日書いた記事のソースコードを見てみると、このようになっています。↓

記事のソースコード

そしてこれはGoogleでの検索結果でこのように表示されています。↓

Googleでの検索結果

じゃあ「高度なタイトル設定」でtitle要素を別に設定すると「記事タイトル - ブログ名」となってしまうところを設定し直せるのか?と言うと、ちょっとそういうわけでもないようです。試しに「高度なタイトル設定」でtitle要素を「消費者としてグッと来た企業の株を買うということ」に変えてみると、タグはこのようになりました。↓

記事タイトル

なので、厳密に言うと変えられるのは「記事タイトル - ブログ名」の「記事タイトル」の部分のみで、ブログ名を削除することはできないようです。ちなみに、実際にブログのページに表示されるタイトルは編集画面で設定したもののまま変わりません。

og:title

上記のはてなブログ開発ブログでは、このように説明されています。

og:titleは、ソーシャルシェアされた際にどのように表示されるかを指定するOGP(Open Graph Protocol)のタイトルです。【追記】Twitterカードで利用されるtwitter:titleにも同じものが設定されます。

昨日書いた記事ではog:titleの設定をしなかったので、HTMLのヘッダにあるtitle要素がそのまま使われていますが、このような感じでツイッターなどのSNSで使われるタイトルもog:titleで別に設定すれば変更できるということです。

SNSで使われるタイトル

ただ、これもtitle要素と同様、厳密に言うと変えられるのは「記事タイトル - ブログ名」の「記事タイトル」の部分のみで、ブログ名を削除することはできないようです。

どう使い分ければいいのか

でも、そもそもなぜtitle要素とog:titleを別設定する必要があるんでしょうか?あたしがざっと調べただけなので、もしかするとこれから述べる理由以外にも何かあるかもしれません。でも、考え方としてはヒントになると思いますので見ていきましょう。

(他にもあったら教えてください。)

文字数を調節する

あたしの昨日の記事はたまたまタイトルが短かったので、ブログ名が足された状態でもなんだかちょうどいい長さになってすっぽり検索結果でもツイッターでも収まって表示されていますが(単なる偶然)、例えば、はてなブログ開発ブログの記事は検索結果ではこんな感じでタイトルが切れています。↓

はてなブログ開発ブログの記事の検索結果

なので、実際の記事タイトルは長くしたいけれど、検索やSNSで表示されるタイトルは短くしたい場合、title要素とog:titleを別設定にすればいい、ということになります。

ちなみに、ざっと調べた限りでは、title要素は28文字程度に抑えるべきという意見が多いようです。SNSについては、文字数制限はGoogleより緩いみたいですがいろいろなようなので、自分や自分の読者が使うものを検証してみるといいかと思います。

検索向けのタイトルと読者向けタイトルを別にする

タイトルについて考えるとき、よく「クリックされるタイトルのつけ方」みたいなハウツーが語られたりしますが、これは要するに読者向けのタイトルです。「まだ◯◯で消耗してるの?」みたいなフレーズもクリックを煽るもので、実際の記事の内容の説明にはなっていないし、「まだ消耗中」みたいなキーワードで検索する人もあまりいないはずです。たぶん。

一方、検索向けのタイトル、つまりSEO対策としてのタイトルのつけ方としては、キーワードを必ず盛り込むとか、重要なキーワードはなるべく左にもってくるとかそういう話になります。これを踏まえると、以下の使い分けアプローチが考えられます。

  • title要素:基本的に検索用。ただ、検索で上がってきてもクリックしたくならないタイトルではマズイので、SEO対策が第一ではあるが、ユーザーが探している情報があることを示唆するタイトルにすることが大事。でも基本的にはユーザーが探していたものズバリのタイトルだったら煽らなくてもクリックされるはず。
  • og:title:SNSで拡散されたとき用。ユーザーは別に特定の情報を探しているわけではないので、目についてクリックされるタイトルにすることが第一。SEO対策は基本的に必要なし。

実際にどれだけ使いこなせるか、っていうのはありますねー。あとブログ名を自由に削除できないのは残念ですね。でもなかなか面白くないですか?