Designed item on Suzuri 👔

Wappalyzerでウェブサイトに利用されている技術を特定する

Wappalyzerウェブ
この記事は約3分で読めます。

訪問したウェブサイトで、どんな技術やサービスが利用されているか気になることはあると思う。

競合サイトの利用するアナリティクスツールやアドネットワーク、最適化処理などは、自社にも導入するメリットがあるかもしれない。

そんなリサーチ活動を効率化するのが「Wappalyzer」である。

読み方はおそらく、Wappalyzer:ワッパーライザー。

間違っていたら申し訳ない。

基本的な使い方は3つあり、

  • ブラウザの拡張機能
  • wappalyzer.comでURLを送信
  • node.jsによるコマンドライン

である。

本記事では、最も簡単で使いやすいブラウザの拡張機能に絞って解説したいと思う。

インストール

まず、対応するブラウザのウェブ拡張ストアからWappalyzerをインストールする。

Wappalyzer

Chromeのウェブストア経由でインストール可能なため、Brave BrowserでもOK。

これは、ブラウザの基盤がChromium(クロミウム)というオープンソースのもので同じだから。

Braveについてはこちらから↓

テクノロジーをチェック

例として私のサイトをチェックしてみる。

予め言っておくと、以下のような技術を使っている。

  • WordPress
  • Google Analytics
  • MySQL
  • Google Tag Manager
  • Cloudflare
  • HubSpot
  • Facebook Pixel

拡張機能が追加されると、ブラウザのタブにWappalyzerのロゴが表示される。

利用するには、そのロゴをクリックするだけでOK。

参考画像のように、利用されている技術が剥き出しになるのだ。

Wappalyzer
Wappalyzer

まとめ

普段何気なく見ていたサイトの見え方が変わったり、いちいちデベロッパーコンソールでチェックしていた作業がだいぶ楽になったりすると思う。

また、何かサイトを作りたいと思ったとき、参考となるサイトの技術が一目で分ければ、取り組むまでの速度は確実に早くなる。

拡張機能をインストールしても、ブラウザの使用メモリが逼迫し重くなるようなことはないので、プログラマーなりマーケターなりデザイナーは利用することをオススメしたい。

私が使った感じ、wappalyzer.comでルックアップしたり、EdgeやFirefoxで使うよりも、Google Chromeの拡張版が最も多くのテクノロジーを検出してくれた。

ということで、私の推奨は「Chrome最新版 × Wappalyzer拡張機能」である。

んじゃ!!