ブログ記事作成におけるタグとは?HTMLタグについても解説

コンテンツマーケティング

  • 投稿日
  • 編集日
ブログ記事制作のタブとは?
grooo編集部

企業ブログやオウンドメディアでWordpressを使用している人は、記事作成のページで「タグ」という項目を見たことがあるのではないでしょうか。

また、ブログの記事を作成するにあたり「見出しタグ」「リストタグ」といった言葉を耳にしたことがある人も多いはずです。

このようにブログ作成では「タグ」という言葉が頻出するにも関わらず、それぞれの違いや活用方法についてあまり理解できていない人も少なくありません。

そこで本記事では、Wordpressでのブログ記事作成における2つの「タグ」について解説します。

それぞれの概要だけでなく、設定するメリットやポイントにも触れているので、ぜひ記事作成の参考にしてください。

この記事の目次

ブログにおける「タグ」は2種類ある

ブログ記事を作成する際に使用する「タグ」とは2種類あります。

1つが各記事にキーワードを付けて分類するタグと、もう1つが記事のなかのテキストを装飾したり画像を表示させたりするためのタグです。

前者のタグに関しては、記事作成ページにタグを設定する項目が設けられています。そのため簡単に設定できます。

一方、後者はWEBページを構成するためのプログラミング言語「HTML」で使用されるタグです。プログラミングと聞くと難しいイメージがあるかもしれませんが、Wordpressの記事作成ページを使用すると比較的簡単に設定できます。

それでは、それぞれ詳しく見ていきましょう。

記事にキーワードをつける「タグ」

タグとは、ブログの各記事に特定のキーワードを付けて仕分けできるもので、札や付箋に似た意味をもちます。

オウンドメディアや企業ブログでは記事数が増えてくると、読みたい記事がどこにあるのかを探すのが大変になります。しかし各記事にタグが付けられていれば、知りたい情報に関連するキーワードのタグが付けられた記事を探すだけで、読みたい記事にたどり着けるのです。

タグ設定は必ずしも設定しなければいけないわけではありませんが、利便性を高める効果があるので、未設定の人はこれを機にタグ付けを検討してみましょう。

WEBページを作成するHTMLの「タグ」

WEBページはCSSやJavaScriptなどの言語を組み合わせて作成しますが、そのうちの1つが「HTML」です。

HTMLとは「Hyper Text Markup Language」の略で、テキストに意味づけをするためのプログラミング言語になります。HTMLではテキストに「タグ」と言われる目印をつけて、文字の装飾や画像挿入などを行います

コンピューターは人間のように文章を読んだだけでは重要な箇所がわからないため、太字にすべき箇所や改行すべき箇所などを自動で判断できません。そこでHTMLタグでテキストに意味づけをして、太字や改行などを指示してあげるのです。

ブログ運営ではどちらのタグも重要

キーワードを付けるタグは利便性を高める効果があり、HTMLタグは記事ページを構成するために欠かせない要素です。

どちらの「タグ」も意味合いは異なりますが、ブログ運営では重要なものとなるので知っておく必要があるでしょう。

これらの違いを理解して適切に使用できるようになるために、次からさらに深掘りして解説していきます。

キーワードのブログタグについて

ブログのタグ付け

まずはブログ記事にキーワードを付けるタグについて説明していきます。

こちらのタグは先述のとおり、各記事に関連するキーワードを付けるものです。詳細なキーワードを設定することで、読者はより早く知りたい情報にたどり着けます。

それでは、タグについて具体例をまじえながら設定するメリットやSEO効果などを解説します。

WordPressの「カテゴリー」との違い

タグのように記事を分類するものとして「カテゴリー」があります。当社のgroooブログでも「SEO」「コンテンツマーケティング」「システム開発」の3つのカテゴリーで記事を分類しています。

タグは詳細なキーワードを付けて分類しますが、カテゴリーはさらに大まかなキーワードで記事を分類します。カテゴリーというフォルダに、該当するそれぞれの記事を格納しているイメージです。

大まかな分類でのカテゴリーでは、タグのようにピンポイントで記事を探すことは困難です。しかし親となるカテゴリーのなかに子となるカテゴリーを作れるので、さらに細かく記事をグルーピングできるようになります。

また、それぞれのカテゴリーに分類された記事は、カテゴリーページにて一覧表示されるよう設計されているWEBサイトが多く見られます。

このような設計のWEBサイトでは、トップページが第一階層となり、カテゴリーページが第二階層、記事ページが第三階層となります。つまりカテゴリーページはSEO的にも重要度が高いWEBページとなるため、適切なSEO対策が必要です。

ちなみに、それぞれのタグでグルーピングされた記事はタグページで一覧表示できます。しかしタグページはカテゴリーページのようにWEBサイトの階層ではないので、重要度は低いでしょう。

タグ付けの例

ブログ記事のタグについて具体的にイメージしてもらうため、ここではタグ付けの例を紹介します。

たとえば、全国の飲食店情報を紹介するWEBサイトで「新橋にできた新しいデカ盛り豚骨ラーメンのお店を紹介する」という記事を執筆したとします。

この記事に付けられるタグとして、以下の例が挙げられます。

  • 新店情報
  • 新橋
  • 豚骨ラーメン
  • デカ盛り
  • グルメレポ
  • 行列店
このようにタグは、記事に関連する詳細なキーワードを付けます。こうすることで「新店の記事を読みたい」「デカ盛りのお店の情報が知りたい」といった読者が、記事を見つけやすくなるのです。

ブログのタグ付けのメリット

ブログ記事にタグ付けをするメリットは、読者が読みたい記事をピンポイントで探しやすくなる点です。自分が知りたいキーワードのタグをクリックするだけで関連する記事を探せるので、読者にとっての利便性が向上するでしょう。

また同じタグが付けられていると「ほかの記事も読んでみよう」という気持ちにもさせられます。そのためWEBサイト内の回遊率が高まり、PV数向上も期待できるのです。

タグ付けのSEO効果

タグ付けは読者にとっての利便性を高める効果がありますが、実は直接的なSEO効果はありません。タグを付けたからと言って、Googleに高く評価されたり検索順位が上がったりするわけではないのです。

しかし間接的なSEO効果は期待できます。

なぜならGoogleは「ユーザーファースト」を掲げており、ユーザーにとっての利便性が高いコンテンツほど高く評価すると公言しているのです。

タグ付けされたブログ記事は読者にとっての利便性が高く、WEBサイト内が整理されているため見やすさも向上します。つまりGoogleが推奨するユーザーファーストに則っていることになるため、Googleから見たときに「良いサイト」と判断してもらいやすくなるでしょう。

ブログのタグ付けのポイント

ブログ記事のタグ付けは読者に対してもGoogleに対しても有用な方法ですが、むやみに設定しても効果を得られません。ブログのタグ付けの際に意識すべきポイントについて、3点紹介します。

5個以内にする

タグは数の制限がないため、いくらでも付けることが可能です。

「複数のタグを付けたほうが、多くの読者に読んでもらえそう」と思うかもしれませんが、複数のタグを付けるのは好ましくありません。なぜならタグがありすぎると情報が乱立してしまい、かえって読者の利便性を損ねてしまう可能性があるからです。

そのためタグを設定する際には、タグの個数は5個以内におさめましょう。

できれば3~5個で設定するとある程度の情報量を与えることができ、読者が記事を探しているときに、その記事にはどのようなことが書かれているのかわかりやすくなります。

同じ意味のタグは付けない

タグ付けでよくある失敗が、似たような意味のタグを付けている例です。

たとえば以下のようなタグは、言葉は違っても意味合いは似ています。

・リーズナブル
・格安
・激安
・お手頃

このような同じ意味のタグを付けていると、読者はどのタグで探せばいいのかわからないため利便性を損ねます。似たようなタグページが乱立することで、Googleにコピーコンテンツと判断されるリスクもあるでしょう。

もともとタグはWEBサイト内をスッキリと整理するものなので、同じ意味合いのタグは複数作らずに一つにまとめるのがおすすめです。

カテゴリーと同じタグは付けない

記事に関連するキーワードをタグとして設定するため、カテゴリーと同じキーワードをタグにしてしまう例も少なくありません。

しかしこれでは、カテゴリーで分けている意味がなくなってしまいます。

また、カテゴリーページとタグページが同じ内容になってしまう可能性もあるでしょう。この場合はタグページをnoindexするという方法もありますが、不要なWEBページが増えると管理が大変になってしまいます。

そのため、タグを設定する際にはカテゴリーと同じキーワードを使わず、さらに細かい視点で分類するようにしてください。

HTMLタグについて

HTMLタグ

付箋のような役割をするタグについて理解したところで、次はWEBページを構成するために使用するHTMLタグについて解説します。

HTMLは先述のとおりプログラミング言語の一つで、WEBページのテキストを装飾したり画像を挿入したりする際にタグを使います。

HTMLタグはブログ記事を作る際に重要になるので、以下の内容についてしっかりと理解しましょう。

WEBページを作成するために使用

先述のとおり、HTMLタグはWEBページを構成するためのプログラミング言語です。HTMLタグを使うことで、テキストを太字にしたりリンクを付けたりできます。

HTMLタグは「<>」の記号のなかに該当する英単語を入れて使います。また開始タグ「<>」と終了タグ「</>」でテキストを囲むことで、テキストに意味をもたせることが可能です。

たとえばテキストを太字にできる「bタグ」を使用する場合、以下のように記述します。

<b>テキスト</b>
プログラミングと聞くと難しそうなイメージをもちますが、HTMLタグは初心者でも比較的記述しやすいため、知っていて損はありません。

WordPressではテキストエディタで使う

HTMLタグは、Wordpressの記事作成画面で使用できます。

HTMLタグを使ってブログ記事を作成する際には、編集方法を「テキストエディタ」に選択します。「ビジュアルエディタ」のほうが直感的に使いやすいですが、テキストエディタでは細かな装飾が可能です。

しかしテキストエディタやビジュアルエディタは、2018年12月にリリースされたWordPress5.0以降の現行Wordpressには搭載されていません。現行Wordpressは「ブロックエディタ」という方法でブログ記事を作成していくため、テキストエディタを使えないのです。

ただしプラグインの「Classic Editor」(クラシックエディタ)をインストールすることで、ブロックエディタではなくテキストエディタ・ビジュアルエディタを使用できるようになります。

ブロックエディタが使いにくい人は、クラシックエディタを試してみましょう。

HTMLタグ設定のメリット

HTMLタグを設定すると、テキストが強調されたり箇条書きになったりします。また画像や表の挿入も可能になります。

このようにHTMLタグを使用するとブログ記事に装飾ができるため、読者にとって記事が読みやすくなるというメリットがあります。

またリンク設定やボタン作成などのHTMLタグもあるため、内部リンクをつけてWEBサイト内の回遊率を上げたり、商品購入ページに遷移させたりすることも可能です。

HTMLタグのSEO効果

HTMLタグを使うことで、Googleにブログ記事の内容を正しく伝えられます

Googleはクローラーと言われるロボットプログラムを各WEBページに巡回させ、書かれている情報を読み取ります。ただしクローラーは人間ではないため、テキストが羅列されているだけでは重要な箇所を判断できません。

そこでHTMLタグを設定し、重要な箇所を強調させたり見出しごとに内容を整理したりすることで、クローラーはブログ記事の内容を正確に読み取れるのです。

またHTMLタグを設定するとブログ記事が読みやすくなるため、読者にとっての利便性が向上する効果もあります。つまりGoogleが提唱するユーザーファーストに則った記事コンテンツとなるため、高評価にもつながりやすくなるでしょう。

さらに最近ではGoogleの検索結果ページがリッチになり、リンクを示すHTMLタグを使用して箇条書きにした箇所が表示されることもあります。検索結果ページにてほかのコンテンツよりも目立つことができれば、読者のクリック率を上げられるでしょう。

主なHTMLタグの種類と概要

htmlの種類

それでは、ここからは実際によく使われるHTMLタグを7つ紹介します。

hタグ:見出し

見出しを示す「hタグ」は、ブログ記事作成では頻出するタグです。記述方法は以下になります。

<h1>見出し1</h1>

<h2>見出し2</h2>

<h3>見出し3</h3>

Hタグにはh1~h6まで6種類あり、数字が若いほど上の階層となります。しかしh6まで使用すると情報が膨大になりすぎるため、多くてもh4までにとどめておくと良いでしょう。

またh1は1ページに1度しか使わないものなので、通常はタイトルや記事のトップに使用します。そのため実質的に記事内で見出しとして使用するのはh2となり、小見出しではh3が使用されます。

strongタグ(bタグ):太字

テキストを太字にするタグは2種類あり、特に強調する意味をもつ「storngタグ」と、通常の太字を示す「bタグ」があります。以下のように記述します。

<storng>強調</storng>

<b>太字</b>

storngタグはGoogleに強調していることを伝えることができ、bタグは単に太字にするだけです。ただし、どちらを使ってもSEO効果に差はないと言われています。

参照:https://www.youtube.com/watch?v=awto_wCeOJ4

リストタグ

箇条書きにする際にはリストタグを使用します。リストタグを使用しなければGoogleは箇条書きだと認識できないため、単に「・」マークで箇条書きにするだけでは不十分です。

リストタグには2種類あり、番号無しリスト「ulタグ」番号ありリスト「olタグ」があります。

ただしulタグとolタグは単独で記載しても意味をもたないため、リストを記述することを示す「liタグ」と一緒に使用します。記述方法は以下のとおりです。

<ul>

<li>番号なしリスト</li>

<li>番号なしリスト</li>

</ul>

<ol>

<li>番号ありリスト</li>

<li>番号ありリスト</li>

</ol>

リストタグを使用する際には、記述方法と番号あり・なしに注意しましょう。

pタグ:段落

「pタグ」は、文章を見出しや画像などと区別した段落であると示すためのタグです。以下のように記述します。

<p>テキスト</p>
テキストエディタでは2回エンターキーを押して改行すると自動で挿入されるので、意識的に使用することは少ないでしょう。

brタグ:改行

改行を示すタグは「brタグ」です。記述方法は以下のとおりです。

テキスト<br>テキスト
お気づきの人もいるかもしれませんが、brタグは終了タグを設置しません。<br>だけで改行の意味をもつことができます。

ただしpタグと同様に、テキストエディタでは改行すると自動で挿入されるタグです。

aタグ:リンク

内部リンク・外部リンクなど別のWEBページをリンクする際には「aタグ」を使用します。aタグは単体で使用せず「href」というハイパーリンクを設定するための属性も使います。

たとえば「株式会社○○」というテキストに「https://○○.com」をリンクさせたい場合、以下のように記述します。

<a href=”https://○○.com/”>株式会社○○</a>
少し使い方が難しいため、テキストエディタの上部にある「a」と書かれたタグボタンを使用するのもおすすめです。テキストを選択してタグボタンを選択し、URLを入力するだけでaタグを設定できます。

またタグボタンを使用すると、リンク先を開くときに別タブで開くよう設定もできます。外部サイトをリンクする際には、自社サイトからの離脱を防ぐために別タブで開くよう設定しましょう。

tableタグ:表

表を作成したい場合は「tableタグ」を使います。ただしtableタグは表全体を定義するため、行=trタグ、列の項目=thタグ、列の内容=tdタグも使用します。

記述の仕方は以下のとおりです。

<table>

<tr>

<th>列の項目1</th>

<td>列の内容1</td>

</tr>

<tr>

<th>列の項目2</th>

<td>列の内容2</td>

</tr>

</table>

少し複雑ですが、表を使うと見栄えがグッと良くなるのでぜひ覚えてください。

まとめ

ブログ記事の作成では、付箋の役割をもつタグHTMLタグの2種類のタグがあります。

記事を探しやすくしたり読みやすくしたりする効果があり、読者の利便性を高めるものです。またSEOの観点からも有用と言えるでしょう。

ブログ記事を作成する際には、どちらのタグも活用して利便性の高い記事を作成してください。

「効果的なタグを設定したい」「HTMLタグを活用して見やすい記事を作成したい」このような人はぜひ弊社、株式会社groooにご相談ください。

groooでは記事制作代行サービスを提供しており、記事作成の豊富な実績があります。またタグだけでなくさまざまなSEO観点から記事を作成するため、ブログ記事の検索順位を上げて流入を増やします。

お問い合わせは下記お問い合わせフォームから受け付けておりますので、ぜひお気軽にご相談ください。

記事検索

カテゴリー

Contact お問い合せ

弊社にご関心をお持ちいただきまして、誠にありがとうございます。案件のご相談や料金のお見積もりなど、お気軽にお問い合せください。
担当者よりご連絡させていただきます。

お電話でのお問い合せも承っております。

03-6823-1334

営業時間:10時〜18時(土日祝休み)

Download お役立ち資料ダウンロード

コンテンツマーケティングの実務に使える「お役立ち資料」を、無料でダウンロードいただけます。
ぜひご活用ください。

TOP

CONTACT