【2023年版】Webアナリストの私が愛用する19のChrome拡張機能

私はこれまでWebアナリストとして、月間100億PVあるWebサイトの分析であったり、膨大な変数を伴う計測が必要なWebサービスの分析など、15年以上に渡って300以上ものWebサイトのアクセス解析を支援してきました。

Webアナリストの仕事は、各種計測ツールの導入状況をチェックしたり、アクセス解析ツールのデバッグなど、様々な業務に対応していく必要があります。そうした業務を効率よく進めていくために、私が活用しているのが多くのChromeの拡張機能です。

今回は、2023年2月時点で私が愛用している19のChrome拡張機能を大きく以下の3つのカテゴリに分けて、一気にご紹介したいと思います。

• 分析環境構築・分析ツール
• 業務効率化ツール
• Web技術関連ツール

これらのChrome拡張機能はWebアナリストだけでなく、デジタルマーケティングやWeb制作などを生業にしている方にとっても役に立つツールが多く含まれているため、ぜひ参考にしてみてください。

分析環境構築・分析ツールとしておすすめのChrome拡張機能

01. Google Tag Assistant Legacy (by Google)

Googleの各タグが正しく設置されているかを簡単にチェックできる

Web解析を行うためには、そもそもで各種設定が正しく行われている必要があります。しかし、計測タグが設置されていなかったり、複数個設置されていたり、またiframeの親子それぞれにタグを設置していてダブルカウントされてしまっていたりすると、計測値自体が誤った値になってしまいかねません。

そこで、私が設定を確認するときに必ず使うのが、「Google Tag Assistant Legacy」です。これはGoogle純正の拡張機能で、GoogleアナリティクスやGoogle タグマネージャ、またGoogle 広告などの設定が正しく行われているかを簡易的にチェックすることができます。

特徴

• Google純正の拡張機能である
• Googleアナリティクス（GA）、Google 広告、Google タグマネージャ（GTM）等が正しく導入されているかをチェックできる
• どのGAプロパティID、GTMコンテナIDで実装されているかを確認できる

URL：Google Tag Assistant Legacy (by Google)

　

02. Google Analytics Debugger

Google純正のGAデバッガで、設定のエラー箇所や内容を確認できる

「Google Tag Assistant Legacy」でエラー表示があったときに、より細かなエラー原因を調べるために用いるのが、Google純正のGoogleアナリティクスデバッガである「Google Analytics Debugger」です。

また、「Google Analytics Debugger」ではGoogleアナリティクスにどういった値が送信されているかも確認できるため、Googleアナリティクスの細かなカスタム設定を行ったときは必ずチェックするようにしています。

特徴

• Google純正のデバッガ拡張機能
• Google Analyticsの各種設定のエラー内容を確認できる
• Google Analyticsに送信されている詳細な情報を確認できる

URL：Google Analytics Debugger

　

03. Google Optimize

Google オプティマイズでのA/Bテストを行う上で必須の拡張機能

CVR改善などを進めていく上で、A/Bテストは非常に有効です。そしてA/Bテストツールには様々な種類がありますが、私がメインで用いるのが、Googleが提供する無料のA/Bテストツール「Google オプティマイズ」（※）で、A/Bテストのパターンを編集する際に必要になるのが、この拡張機能になります。

「Google オプティマイズ」は無料で使えることはもちろん、Googleアナリティクスともシームレスに連携し、A/Bテストの実行結果をGoogleアナリティクスでも確認できます。

特徴

• Google オプティマイズでのA/Bテストのパターンを作成・編集するのに必須の拡張機能
• Googleアナリティクスとシームレスに連携

※2023年9月末にGoogle オプティマイズ はサービス終了が予定されています

URL：Google Optimize

　

04. Microsoft Clarity Live

確認したいページ上で即座にヒートマップを表示できる

こちらは、ヒートマップ・マウスレコーディングツールの「Microsoft Clarity」の拡張機能です。「Microsoft Clarity」のサービスページを開かずとも、ブラウザで開いているページ上にヒートマップを表示させることができるため、手間なくヒートマップを確認できる非常に使い勝手の良い拡張機能です。

類似のサービスとして、クリックヒートマップを確認できる「Page Analytics (by Google)」がありますが、GA4では利用できなくなってしまうため、私は代替手段として「Microsoft Clarity Live」を利用しています。

特徴

• 「Microsoft Clarity」のサービスページにアクセスすることなしに、該当ページ上にヒートマップを表示できる
• 無料で利用可能

URL：Microsoft Clarity Live

　

05. Ghostery

　

競合サイトの利用ツールやプラグインがまるわかり

「Ghostery」は、もともとはアクセスしたサイトで不用意にデータが収集されないようにするトラッキング防止、および広告表示をブロックするための拡張機能です。そしてトラッキング防止のために、「Ghostery」が訪問サイトにはどういったツールが使われているのかを表示してくれるため、この機能を競合サイト調査にも利用することが可能です。

私の場合は競合調査はもちろん、各施策の実行難易度にも影響してくるため、クライアントのサイトにどういったツールが入っているのかを確認するための目的でも利用しています。

また、導入ツールがGoogle タグマネージャ配下なのかHTML上なのかを確認できるため、Google タグマネージャ配下にサービスを寄せたいときのチェック用途としても活用しています。

特徴

• 競合調査にも使えるプライバシー広告ブロッカーツール
• Google系だけでなく、国内外の様々なWebサービスを検知可能（アクセス解析・タグマネジメント・広告・MA・レコメンデーション等）

URL：Ghostery

　

06. Wappalyzer

タグ実装の参考にもなる利用CMS・サービス確認ツール

「Ghostery」と類似するサービスではありますが、「Wappalyzer」では訪問サイトがどういったCMSで構築されているのかを確認でき、またVue.js等のフレームワークの利用状況を見れたりと、該当サイトで使われている技術をワンクリックで調べられる拡張機能です。

たとえばCMSがWordPressなのかHubSpotなのかで、タグ実装の指示出しは変わってきます。そこでWeb解析の環境構築を行う際に、作業難易度や作業ボリュームの目星をつけるために私は活用しています。

特徴

• WordPress、Shopify、Hubspotなど、該当サイトの利用しているCMSが確認できる
• Vue.js等のフレームワークの利用状況を確認できる
• Googleアナリティクスなどの計測ツールの利用状況を確認できる

URL：Wappalyzer

　

07. Adobe Experience Platform Debugger 

Adobe Analyticsの計測チェックに必要不可欠な拡張機能

「Adobe Analytics」はアドビ社が提供するアクセス解析ツールで、カスタマイズ性の高いダッシュボードと幅広いデータを収集できることが特徴です。

そしてAdobe AnalyticsをはじめとするAdobe Experience platform専用のデバッガが、こちらの拡張機能「Adobe Experience Platform Debugger」になります。Adobe Analyticsを導入する場合、計測チェックには不可欠の拡張機能になります。

特徴

• Adobe AnalyticsをはじめとするAdobe Experience platform専用のデバッガ
• アドビ社の純正拡張機能

URL：Adobe Experience Platform Debugger

　

08. KARTE Action Viewer

CXプラットフォーム KARTEの計測データ専用のデバッガ

CXプラットフォームとして導入企業も多い「KARTE」ですが、KARTEを活用する上で、Webサイト上からKARTEに送信する変数の値に基づいて、イベントを出し分けするという設定が必要です。

その際に送信データを検証するために用いるのが、KARTEの純正デバッガである「KARTE Action Viewer」です。私の場合、クライアントがKARTEを利用している際に、サイト上の行動が正しく計測されているか、タグの設定が間違っていないかを確認するために活用しています。

特徴

• KARTEの計測データ専用のデバッガ
• KARTEを運営するプレイド社の純正拡張機能

URL：KARTE Action Viewer

　

業務効率化ツールとしておすすめのChrome拡張機能

09. Pasty

複数のURLを一気に開くために

Webアナリストとして仕事をしていると、計測チェックやページ確認などの目的で、大量のリンクを開きたいときがあります。しかし、ひとつひとつリンクをクリックするのは、意外と手間がかかります。

そこで便利なのが「Pasty」という拡張機能です。たとえばGoogleのスプレッドシートに大量のURLが記載されている場合でも、Pastyを使えば、それらのURLを全選択・コピーをして、ブラウザ上のPastyアイコンをクリックするだけで、新しいブラウザでリンク先のページが開かれます。

特徴

• 複数のリンクを一気に新しいブラウザで開ける
• コピーした内容にテキストとURLが混在していても、URLのみを自動抽出

URL：Pasty

　

10. Fireshot

追従バナーを考慮したスクリーンショットが撮影可能

Chromeのデベロッパーツール含め、スクリーンショットを撮影するツールはいろいろとありますが、私が活用しているのが「Fireshot」という拡張機能です。

たとえばWebサイトに追従バナーが設置されている場合、他のスクリーンショットツールですと、スクロールするごとに各画面の追従バナーが常にキャプチャされてしまいます。そのため、全画面のスクリーンショットを撮影しようとすると、追従バナーが何度もスクリーンショット内に表示されてしまいます。

しかしFireshotであれば追従バナーを考慮したスクリーンショットが撮影できるため、LPなどの長いページのスクリーンショットを撮影したいときに重宝する拡張機能です。

特徴

• スクリーンショットツール
• LPや長尺のページのスクリーンショットを綺麗に撮影可能
• 一部機能有償（30日トライアルあり）

URL：Fireshot

　

11. ColorZilla

Webサイトのカラーコードをワンクリックで抽出

「ColorZilla」はWebサイト全体の配色パターンや、任意の箇所のカラーコードを抽出できる拡張機能です。Webデザイナーでもない私がなぜColorZillaを活用するのか、それは資料作成時に非常に便利だからです。

たとえばA/Bテストの提案をする際に、ColorZillaを使うことでクライアントのWebサイトの配色をそのまま提案資料内でも使用することができます。そうすることでクライアントもイメージがつきやすく、よりスムーズな意思決定に繋がっていると感じています。

特徴

• ブラウザに表示されたサイトのカラーコードを取得できる
• サイト全体の配色パターンや任意の箇所のカラーコードを抽出できる

URL：ColorZilla

　

12. Tab Group Saver

ブラウザのタブを案件ごとにグループ化して保存できる

複数のクライアントワークを抱えていると、ブラウザで多くのタブを開かざるを得ないため、どうしても業務効率が悪くなってしまいます。

また、最近はオンライン会議の機会も増え、ブラウザを画面共有しながら話すということもあります。そのときに、別のクライアントのGoogleアナリティクスの画面であったり関連サイトを開いたままですと、情報セキュリティ上あまりよろしくありません。

そこで複数の任意のタブをグループ化して保存し、いつでもタブグループを開閉できるのが「Tab Group Saver」という拡張機能です。Chrome自体にもタブをグループ化する機能はありますが、保存することができないため、私はTab Group Saverを活用しています。

特徴

• 任意のタブをグループ化できる
• タブグループは保存できるため、ブラウザを閉じてもグループを残しておくことが可能

URL：Tab Group Saver

　

13. Notion Web Clipper

Notionを開かずとも、WebページをNotionにクリッピングできる

参考サイトであったり、後で読み返したいサイト含め、様々なWebページをブックマークしたり、Notion含め様々なツールに情報を集約されている方は多いと思います。

私自身は情報集約ツールとしてNoitonを利用しており、極力ストック情報はすべてNotionにクリッピングしています。ただ、Webページをクリッピングする際に、わざわざNotionを開いてコピペするのは手間がかかるため、そこで活用するのが「Notion Web Clipper」という拡張機能です。

開いているWebページ上からNotionへクリッピングでき、さらにどこにクリッピングするかも拡張機能上で選ばるため、情報集約で非常に重宝しているツールです。

特徴

• Webページをブラウザ上からNotionにクリッピングできる
• 拡張機能上で保存先を選べる

URL：Notion Web Clipper

　

Web技術関連でおすすめのChrome拡張機能

14. Clear Cache

面倒な操作は不要。ワンクリックでキャッシュをクリア

Webサイトの改修内容を反映させることはもちろん、Webアナリストとしてページ表示速度をある程度正しく測定するために、ブラウザに残っているキャッシュを消してから確認するということをよく行います。

ただ、ブラウザの設定画面からキャッシュをクリアするのは操作が面倒なため、そこで利用しているのが「Clear Cache」です。Clear Cacheを使うことで、該当ページだけのキャッシュをワンクリックで削除できるため、業務効率化に繋がっています。

特徴

• ワンクリックでキャッシュクリアができる
• 該当ページのキャッシュを削除するだけの単一機能で、操作もシンプル

URL：Clear Cache

　

15. EditThisCookie

Cookie削除に特化した拡張機能

「Clear Cache」はキャッシュクリアに特化した拡張機能でしたが、こちらの「EditThisCookie」はCookieの削除に特化した拡張機能です。

ブラウザの設定画面からCookieを削除しようとすると、ログイン情報なども合わせて削除されてしまいますが、EditThisCookieでは削除するCookieを指定できたり、現在表示しているドメインだけのCookieを消すといったことが可能です。

特徴

• 該当ドメインのCookieを全削除・一部削除できる

URL：EditThisCookie

　

16. Swoosh Cookie and Local Storage Specialist

ブラウザ上のLocal Storageの削除や書き換えが可能

デジタルマーケティングではこれまで、ユーザーを識別してユーザー行動を追跡するための仕組みとしてCookieを用いてきました。しかし昨今はCookieのみならず、Local Storageも併用してユニークユーザ判定をしていたりします。

そこでキャッシュやCookie削除と同様、該当ページのLocal Storageを消したいときや書き換えたいときに活用するのが、「Swoosh Cookie and Local Storage Specialist」です。こちらはCookieの削除も可能ですが、私は使い勝手の面からCookieは前述の「EditThisCookie」、Local strageは「Swoosh Cookie and Local Storage Specialist」と使い分けています。

特徴

• Cookieだけでなく Local Storageの削除、書き換えが可能

URL：Swoosh Cookie and Local Storage Specialist

　

17. Spectrum

色覚バリアフリーチェックができる拡張機能

スマートフォンやタブレットが普及し、誰もがWebサイトにアクセスできるようになった昨今において、ユニバーサルデザイン視点でのWebサイト制作の重要度は高まってきています。

そしてユニバーサルデザインの実現において、色覚特性を持っている方にも伝わるような、色覚バリアフリーなWebサイトであるかどうかがひとつ重要な要素です。

そこで私が色覚バリアフリーであるかどうかを指摘する際に用いるのが、この「Spectrum」という拡張機能です。頻度は多くありませんが、クライアントのサイトが色覚特性を持っている方にどう見えているのかということを確認し、ファクターとして提示する際に使用しています。

特徴

• 色覚バリアフリーチェックができる
• 専門用語の英単語が多く使われているため、やや難しい

URL：Spectrum

　

18. Virtual Hosts

PCの再起動などせずにhostsファイルの切り替えが可能

サイトリニューアルを行う際に、公開前のサイトを自分のPC環境のみで確認したい場合、hostsというファイルの書き換えが必要になります。一般的なやり方の場合は、hostsファイルを書き換えた後にPCの再起動が必要であったりと、手間がかかる作業です。

そこで私は、hosts切り替えを簡単に行える「Virtual Hosts」という拡張機能を使っています。特にWebアナリストとして、私の場合はサイトリニューアル時にアクセス解析の計測設定など諸々整備することが多いため、「Virtual Hosts」は重宝している拡張機能のひとつです。

特徴

• hostsファイルを書き換えなくてもhostsを切り替えた状態をエミュレートできる

URL：Virtual Hosts

　

19. Requestly

自ブラウザのみに反映される簡易的なテスト環境をつくれる

Googleタグマネージャの設定を大幅に変更する必要がある場合、不用意に設定を追加していってしまうと、本番環境に影響が出てしまう可能性があります。そこで自分のブラウザ上で簡易的なテスト環境をつくりたいときに用いるのが、この「Requestly」です。

Requestlyを使うことで、GoogleタグマネージャのコンテナIDを別のGoogleタグマネージャのコンテナIDに置き換えて動作検証するといったことが、自ブラウザ上で可能になります。また、自ブラウザ上のみでサイトに表示されている画像を別のURLを指定して差し替えるなど、サイトのネットワークリクエストをダミーで自由にリダイレクトできる拡張機能です。

特徴

• ブラウザ上の特定のURLの読み込みを止めたり、別URLにリダイレクトさせることが可能
• Googleタグマネージャの設定変更をする際、簡易的なテスト環境をつくりたいときに便利

URL：Requestly

　

おわりに

今回ご紹介した拡張機能の中には、多くの人は使わないものもあったかもしれません。ただ、デジタルマーケティングに関わる方であれば、Webアナリストでなくとも以下の5つの拡張機能は本当にオススメなので、ぜひ入っていないものがあればご自身のChromeに追加してみてほしいなと思います。

• Google Tag Assistant Legacy (by Google)
• Microsoft Clarity Live
• Ghostery
• Fireshot
• Clear Cache

またGoogleアナリティクスを本格的に習得したいと思っている方であれば、Google Analytics Debugger をぜひ使い倒してみてください。若干古い記事にはなりますが、「Google Analyticsのトラッキング状況をChromeの拡張機能で簡単にデバッグする」に使い方が詳細に書かれているので参考になると思います。

そして、まだまだ私の知らない便利なChrome拡張機能はたくさんあると思います。もしオススメのChrome拡張機能がある場合は、ぜひTwitterで「#アナリストのChrome拡張 」とつぶやいて教えて下さい。

またMOLTSでは現在、GA4の導入や運用などアクセス解析を中心とした支援に注力しています。詳細はサービスページをご覧ください。