タグマネージャ導入前に知っておくべき基礎知識（全20回の2）

基本的にはどんなタグでも対応

さて、Googleタグマネージャは「タグを管理するツール」ですが、取り扱い可能なタグはどうなっているのか気になりますよね？ 実際に導入してみたものの「管理しようと思っていたタグが非対応だった」では目も当てられません。しかし、安心してください。Googleタグマネージャは、ごく一部を除いてほとんどのタグに対応しています。逆に非対応なタグの方が少ないため、ここでは非対応のタグの例を挙げていきます。以下に該当するタグを利用している場合だけ、注意してください。

●Googleタグマネージャが対応していないタグ

• ページ構造にかかわるタグ（SNSのシェアボタンを生成するJavaScriptなど）
• 同期処理が必要なタグ（Googleアナリティクスのウェブテスト機能など）

この2種類が、2014年11月現在「非対応」となっているタグです。将来的には対応するかもしれませんが、現状ではこれらのタグをGoogleタグマネージャで管理することはできません。ここからは少し技術的な話になりますが、それぞれなぜ対応していないのか、順に解説します。

「同期タグ」と「非同期タグ」

JavaScriptを含むタグは、大きく「同期タグ」と「非同期タグ」の2つに分かれます。これらはJavaScriptの処理のタイミングについての分け方で、「同期タグ」はページの読み込みと同期していて、逆に「非同期タグ」はページの読み込みとは独立して処理されます。

これがどういうことかというと、同期タグではJavaScriptが読み込まれたら処理が開始され、その処理が完了するまでページの読み込みは止まります。そのため、同期タグでは「JavaScriptが読み込まれたタイミングで確実に処理を開始」することができますが、その半面、ページの表示が遅くなってしまうなどの影響が出ます。

逆に、非同期タグの場合はJavaScriptが読み込まれてもそのタイミングでは必ずしも処理を開始しない代わりに、同期タグのようにページの読み込みを止めてしまうことがありません。「処理のタイミングが安定しない」というデメリットはありますが、ページの表示に悪影響を与えてユーザーにストレスを感じさせることがないため、Googleタグマネージャではすべてのタグが強制的に非同期タグとして扱われる仕様になっています。

●同期タグと非同期タグの違い

同期タグは処理されるタイミングが決まっている一方、エラーが起こるとページの読み込みが止まってしまうおそれがある。非同期タグはその心配はないが、タグが処理されるタイミングが安定しない。Googleタグマネージャではすべてのタグが「非同期タグ」として扱われる。

SNSへの投稿ボタンやウェブテスト機能は配信できない

1つ目の「ページ構造にかかわるタグ」は、非同期タグとして処理されると、例えばページ内の特定箇所のHTMLを変更するタグを利用しようとした場合、その変更しようとしている要素がまだ読み込み完了していない可能性が出てきます。例えば、「『hogehoge』といういうidが記述されているdivタグの中のテキストを変更する」といったタグの場合です。そのため、「ページ構造にかかわるタグ」は非対応とされているわけです。よく使われるものでは、TwitterやFacebookなどSNSへの投稿ボタンを生成するJavaScriptなども含まれます。

2つ目の「同期処理が必要なタグ」も、強制的に非同期タグとして扱われてしまうため非対応とされています。例えばGoogleアナリティクスのウェブテスト（A/Bテスト）機能がこれに当たります。ウェブテストのタグは、ページが表示される前にJavaScriptの処理が完了していないと、ユーザーに画面がちらついて見えるといった違和感を覚えさせる要因となります。

実際には、ページの読み込みが確実に終わったタイミングでタグを配信するなどひと工夫すれば対応は可能ですが、それにはJavaScriptの知識が必要になります。同期タグも普通に配信自体はできるのですが、どうしても処理の開始にタイムラグが発生してしまうため、非同期タグとして処理しても問題がないかを判断する必要があります。必ず同期タグとして処理しなければならないタグの場合は、素直にHTMLにタグを直接記述しましょう。

これらのJavaScriptを読み込むタイミングが重要なタグ以外は、基本的にはどんなタグにも対応しています。タグもGoogleタグマネージャもJavaScriptで動作している以上、JavaScript同士の相性などで正しく動作しない可能性が絶対にゼロだと保証はできませんが、筆者が利用している限りそうした場面に出くわしたことは一度もないため、高い確率で大丈夫といえます。「99％大丈夫だが、相性の問題がある可能性もある」ということを頭の片隅に入れておくと、万一問題が発生したときに解決の手がかりになるかもしれません。

●SNSの投稿ボタンは使えない

見覚えのある人も多いであろうSNSへの投稿ボタン。これはページの特定箇所のHTMLを書き換えるタグのため、Googleタグマネージャでは扱えない。

導入のコストはどれくらいかかる？

ここまで、Googleタグマネージャが一体どんなものなのかを解説してきました。では導入しようか、となる前に考えておきたいのが、「導入のコスト」です。コストといっても、Googleタグマネージャは無償で利用可能のため、利用料金は発生しません。そのため、目に見える形での出費は0円で利用できます。

しかし、利用料金というコストはかからなくても、「導入作業＝作業時間」というコストは絶対にかかってしまいます。導入作業について詳しくは次章にて取り上げますが、ざっと挙げただけでも以下のような作業が発生します。特に、導入しようとするWebサイトの規模が大きくなればなるほど、また、Googleタグマネージャへ管理を移行するタグの種類が増えれば増えるほど、作業量は増えていきます。

●導入で必ず発生する作業

• Webサイト内の全ページのHTMLにGoogleタグマネージャのタグを記述する
• Googleタグマネージャで管理することに決めたタグをHTMLから削除する
• Googleタグマネージャの管理画面で配信の設定を行う

また、Googleタグマネージャはあくまで「タグを管理しやすくする」ツールであり、導入しても直接的な売り上げや利益といった目に見えやすい成果につながるものではありません。そのため、導入の作業コストは無視できるものではないでしょう。しかし、今後のタグの編集などの作業量を格段に減らせることを考えれば、長期的に見れば導入した方が時間コストの面でも良くなることは確かです。

導入した方がいいけど、導入時にはそれなりの作業量が発生してしまう……。ジレンマが発生してしまっている状態ですが、どうすればいいのでしょうか？

おすすめはリニューアル時の「ついで」

筆者がおすすめしたいのは、Webサイト全体を編集するほかの作業のタイミングで「ついで」に導入してしまう、という方法です。実際の導入で時間が取られるのは、「Googleタグマネージャのタグを記述する」と「既存のタグを削除する」の2つの作業です。つまり、ネックとなるのはすべてのページのHTMLを編集する必要が出てくることなのです。

そこで、例えばWebサイトのリニューアル時など、全ページのHTMLを編集する作業があった際に一緒にGoogleタグマネージャの導入も行ってしまえば、別々に行うよりもその負担もぐんと減るというわけです。もちろんリニューアル時に限らず、新規にWebサイトを立ち上げる際も、最初からGoogleタグマネージャを導入しておけば後からHTMLを編集する必要がなくなります。また、もしWebサイトがCMSなどテンプレートで管理されている場合は、いくつかのテンプレートを編集するだけで済むので、比較的導入は簡単です。

ユニバーサルアナリティクス対応もきっかけの1つ

ほかにも、2014年にはGoogleアナリティクスが「ユニバーサルアナリティクス」と呼ばれる次期バージョンへとバージョンアップが行われました。特に無償版を利用しているユーザーは強制的にバージョンアップが適用され、今後は新しいバージョンを使う必要があります。ユニバーサルアナリティクスではタグの内容が旧バージョンから変化しているため、ユニバーサルアナリティクスを万全に使いたいなら、現在Webサイト内に記述されているGoogleアナリティクスのタグをすべて書き換えなければなりません。

一応、旧バージョンのタグのままでも利用面ですぐには不具合が出ないようにはなっていますが、当然そのままではユニバーサルアナリティクスの新しい機能は使えません。また、何かの機能を利用する際に、同一のWebページ内で旧バージョンのタグとユニバーサルアナリティクスのタグを混在させると問題が発生してしまいます。そのため、いつかはユニバーサルアナリティクスにタグを移行する必要があるのです。

この移行作業も、Webサイト全体のHTMLを編集する必要があります。その際にGoogleタグマネージャを導入して、タグの管理を移行してしまうのも1つの手です。できる限り導入の作業があまり負担にならないタイミングを選び、「一緒に」やってしまうことをおすすめします。

●Googleタグマネージャを導入するおすすめのタイミング

• Webサイトの新規立ち上げ時
• Webサイトのリニューアル時
• ユニバーサルアナリティクスへの移行時