タグマネジメントに必要なChrome拡張機能３選とデベロッパーツール

f:id:debutete:20140507011218j:plain
タグマネジメントの際に必要な、「タグが実装されているか？動作(発火)しているか？」を簡易的にチェックするChrome拡張機能(アドオン)とデベロッパーツールの活用法(さわり程度ですケド)について。

動的なページで生成されたり、header/footerが共通で設定できたりする場合でも何が起きるかわからないのが、タグマネージャー。設置するメリットが大きい分、デメリットも享受しつつサイトの表示に細心の注意をする必要がある。

＜目次＞

Tag Assistant
Adwords Remarketing Tag Validation Tool
Ghostery
デベロッパーツール

Tag Assistant(by Google)

f:id:debutete:20140507010859j:plain
Google社純正のChrome拡張機能。Googleタグマネージャ、Googleアドワーズのサービスタグ(CVタグ、リマーケティングタグ)やGoogleアナリティクスの計測タグ、DoubleClickの各サービスタグなどが対象ページ内で正しく動作しているかどうか確認できる。

Tag Assistant (by Google) - Chrome Web Store

Adwords Remarketing Tag Validation Tool(by Google)

f:id:debutete:20140507010917j:plain
Tag Assistantがリリースされる前までのメインで使っていたGoogle社純正のChrome拡張機能。Adwordsリマーケティング(動的リマーケティングを含む)の動作をチェックできる。Tag Assistantと違い、JavaScriptが動くたびに検知しメニューに表示するためリマーケティングの動作確認を二重に行う場合に重宝する。
※アドインが削除されることが決まっているため、早いうちにインストールを！

https://chrome.google.com/webstore/detail/adwords-remarketing-tag-v/iokkmdmobnhjmhbapieilipodaaeohol

Ghostery

f:id:debutete:20140507010939j:plain
Ghostery社のタグチェック用の拡張機能。Googleサービスタグだけでなく、ソーシャルタグなどほぼすべてのサービスタグの動作を確認することができる。しかも、日本語に完・全・対・応！だけでなく、FireFox・Opera・Safariにも対応しているという優れもの。タグチェックだけでなくブロックもできるため、広告ブロックツールとしても利用されている。

Ghostery - Chrome Web Store

デベロッパーツール/開発タブ(F12)

タグマネジメントではソースを開き、要素をチェックすることが多々。開発タブを使って何ができるか？は下記記事を参照を。2010年の記事なので多少違うものもあるけども、根本的なことは変わらないため参考になる。
Google Chrome版Firebug：デベロッパーツール取扱説明書：特集｜gihyo.jp … 技術評論社