はてなブログで目次にリンクを簡単につける方法

f:id:mutant-tetsu:20160604092021p:plain

こんにちは、てつです。

先日、Googleアナリティクスの使い方を目的別にまとめた記事を書きました。

 

いろいろ書いていたら4300文字位のボリュームになって、これは目次をつけてすぐに見出しに遷移できるようにリンクを貼った方がいいな・・・と思っていました。

調べてみて初めて知ったのですが、はてなブログで目次をつけて見出しにリンクを付けるのってめちゃくちゃ簡単ですね。

今回は、はてなブログで目次を作って見出しにリンクさせる方法を紹介します。

 

目次記法という機能がある

よくこんな感じで目次を挿入しているブロガーさんいますよね?

f:id:mutant-tetsu:20160605055159j:plain

それぞれの目次をクリックしたら、連動する見出しまで遷移できるというものですが記事によっては(特にボリュームの大きな記事)導入すると読みやすくなりますよね。

はてなブログでは『目次記法』という名前でこの機能を提供しています。

 

使い方はとても簡単で、目次を挿入したい箇所に[:contents]を入れるだけ。

f:id:mutant-tetsu:20170428132408p:plain

見たままモードの画面で目次ボタンがあります。このボタンを挿入すれば、[:contents]が挿入されるという寸法です。

 

 

目次記法を使ってみた

で、さっそくこの目次記法を使ってみました。

まず前提条件として、コンテンツ内に見出しが配置されている必要があります。

そして、記事内に[:contents]をポチッと入れてみます。

 

f:id:mutant-tetsu:20160604090739j:plain

 

この時に注意したいのが、前後に文字や空白を入れないことです。

 

プレビューモードで見てみると、こんな感じで目次が表示されます。それぞれの目次をクリックすると対応した見出しの箇所までジャンプします。

 f:id:mutant-tetsu:20160604090738j:plain

 

目次記法はSEO的に効果がある?

目次記法を使うとSEOに効果があるという意見もあるようですが、個人的にはあまり気にしなくて良いと思います。

 

記事内に見出しを使うのはSEO上とても重要ですが、目次を挿入するか否かはそんなに気にしなくて良いと思います。(あくまで個人的な意見です)

 

ただ今回のように記事のボリュームが多く、読者の方がすぐに目的のものに辿り着くようにしたい記事では目次を挿入した方が、読む側も見やすいですよね。

 

例えば『この夏オススメしたい観光地20選!』などボリュームが大きくなりやすい『まとめ記事』には目次を使った方が読み手に親切な記事になるかなと思います。

 

まとめ

今回、はてなブログで目次をつける方法を紹介しました。

 

はてなブログ上級者の方は知っていると思いますが、はてなブログを始めたばかりの人で知らない人もいると思いますので、備忘録を兼ねてメモ。

 

特にまとめ記事をよく投稿する人は目次を付けてみると読み手に親切な記事になると思いますのでご参考までに。