悩めるWEB担当者様のための最新ノウハウをお届け

タグって何?躓きやすいワードを徹底解説!

ブログ_タグ_アイキャッチ

デジタルマーケティングに携わっている方は、タグという言葉をよく耳にすると思います。また多くの人が種類や設定方法が複雑で躓くポイントでもあります。
そこで今回は、難解なタグというワードついて意味や種類、各タグの使い方などを詳しく解説していきます。

>>UIUX改善でCVR2倍に?UIUXを改善したい方はまずは無料Web診断

タグとは?

インターネット上のウェブページはhtmlファイルによってGoogleChromeやfirefox、InternetExplorer(IE)などのブラウザに表示されます。htmlファイルとは、文字のフォントやサイズ、画像のサイズ、それらをサイトのどこに、どのようなスタイルで表示するかの情報が書かれたファイルです。ブラウザはそのhtmlファイルに書かれた命令式に沿ってページを表示させます。
このときhtmlファイルの中に書かれている命令式の一つ一つが「タグ」になります。
以下のWebサイトで例をお見せします。

デジマブログトップ1

このWebサイトのソースコードは
デジマブログソースコード1
上記図のようになっていて
< >で囲まれた文字列の塊、一つ一つが「タグ」です。このようにウェブページは無数のタグを組み合わせることによって成立していきます。

タグは複数組み合わさって意味を持つこともある

例えば
タグA:画像をページ中央に配置
タグB:改行
タグC:画像の説明文「~~~」を太字で表示する
のようにサイトを思い通りにきれいに表示させるには、複数のタグを順序通りに組み合わせる必要があります。なので、すでにできているページに新たにタグを追加する場合は、今あるタグに悪影響を与えないか注意する必要があります。

タグの命令がうまく伝わらないこともある

ブラウザはhtmlファイルの上の行から順番にタグの命令を実行していきます。そのため、

  • ページが全て表示されきる前に、他のページに遷移する。
  • ページが全て表示されきる前に、ページをリロードする。
  • ブラウザごと閉じる。

などのことを行ってしまうとhtmlファイルに記載された命令の一部が実行されないまま終わってしまう可能性があります。

では、命令が伝わらない場合に、どんな問題が起きるのでしょうか?

多くのページの場合には、ページビューを計測するためなどの計測タグがうめこまれています。
そのため、タグが埋め込まれたところまでページが読み込まれていない状態で遷移した場合、実際のページの来訪数が正しく測れなくなってしまいます。

次にタグにはどんな種類があるのでしょうか?

>>UIUX改善でCVR2倍に?UIUXを改善したい方はまずは無料Web診断

タグの種類

タグの種類は大きく分けて3つあります。

  • htmlタグ
  • コンバージョンタグ
  • ツール用タグ

この項ではその三つについて解説します。

htmlタグ

htmlタグはウェブページにおいて文字の大きさ、文字の色などを指定し様々表現をするためのタグです。

デジマブログソースコード2

こちらは先ほどのWebサイト例のトップ画面のソースコードです。画像の中に<head>のタグが見えると思います。他にも<body>や<title>のタグがあり、この一つ一つがhtmlタグになります。

タグは基本的に開始タグ<○○>と終了タグ</○○>で1セットになります。
この開始タグと終了タグによって、間にある文字の色や大きさを表現したり、画像やリンクを挿入することができます。

具体的には「○○ブログ」というページのタイトルを記述するには<title>○○ブログ</title>

「重要ポイント」という文字の色を赤にするには<font color=”red”>重要ポイント</font>

www.example.comというサイトのリンクを挿入するには<a href="www.example.com">リンクはこちら!</a>というように記述します。

コンバージョンタグ

コンバージョンタグとは、商品購入や資料請求など設定されたコンバージョンを計測するために設置するタグになります。
コンバージョンタグは、Google広告/Yahoo!広告などの広告媒体ごとにhtmlファイルに設置する必要があります。コンバージョンタグを目標の完了ページに設置することで、ユーザーがそのページに到達した回数を計測できます。

コンバージョンタグはウェブ広告の運用で必要です。
Web広告では広告の効果を計測するために、「広告が本当にコンバージョンにつながったのか」を測定する必要があります。

コンバージョンタグを設置することで、ユーザーがコンバージョンした時、そのユーザーが過去に広告をクリックしたかどうかがわかります。広告をクリックしたユーザーがコンバージョンタグを設置したページに到達すると、その数がカウントされていきます。

このデータを計測することで、広告がどれだけコンバージョンを生み出したかがわかるのです。

また、最近ではコンバージョンの確度が高いユーザーに対して広告エンジンが効果的配信する自動最適化が主流になりつつありますが、そうした自動最適化もタグがしっかり埋まっていないと機能しません。この点でもコンバージョンタグの重要性は高まっています。

ツール制御用タグ

ツール制御用タグとはウェブサイトの分析に使用するGoogleアナリティクス、ヒートマップツール、ABテストツールなどのツールを使うために埋め込まれるタグになります。

Googleアナリティクスについてはこちら

【GAとは?】Googleアナリティクスとは何か分かりやすく解説します!


ABテストツールについてはこちら

一度は聞いたことがある「ABテスト」とは?概要と実施方法まとめ

例えばGoogleアナリティクスではトラッキングコードというタグがあり、これを計測したいページのhtmlの終了タグの直前に設置する必要があります。
ユーザーがページに来訪するとこのタグが読み込まれ、Googleにデータが送られ、Googleアナリティクス上でそのデータを閲覧できるようになります。

タグによる正しい場所にタグを設置しないと、データが正しく計測できなくなる場合があるので注意しましょう。

タグには大きく分けて三種類のものがあることがわかったと思います。次からはそのタグを管理するためのツールについて見ていきましょう。

タグの管理にはタグ管理ツールを使用しよう

タグ管理ツールとは、複数のタグをまとめて管理できるサービスのことです。

今まで見てきたようにコンバージョンタグも媒体ごとに、ツール制御用タグも使うツールごとにそれぞれ必要なので、基本的にはタグを複数設置することになります。
大きなサイトでは、管理に手間取ってしまう上に、ミスが発生する原因でもあります。

そこで役に立つのがタグマネージャーと呼ばれるタグ管理ツールです。タグマネージャーでは複数のタグを一元管理でき上記のような負担を軽減することができます。

GoogleではGoogleのサービスのタグを管理できるGoogleタグマネージャー、
YahooではYahooのサービスのタグを管理できるYahooタグマネージャーがあります。
設置されているタグが少ない段階でもタグマネージャーで管理しておけば後々管理が楽になるので、ぜひ活用してみてください。

まとめ

いかがでしょうか?今回は躓きやすい「タグ」というワードの意味から種類、タグの管理の仕方まで紹介しました。
タグを上手に用いることでサイトでの表現をより効果的できたり、広告の効果を測定できることがわかったと思います。
皆さんもタグを使いこなして、ウェブサイトが与える印象改善や効率の最大化をめざしてください!

>>UIUX改善でCVR2倍に?UIUXを改善したい方はまずは無料Web診断

当サイトではこの他にもWebに関するお役立ち情報を多数ご紹介しています。
Web担当者の方、デジタルマーケティングに興味がある方はぜひご覧ください。


広告運用やSEO、解析・Web製作など、当社はWebに関わるベストソリューションをご提供しています。お悩み・ご相談も受け付けておりますので下記のボタンからお気軽にご連絡ください。

関連記事