本サイト内のコンテンツはNORILOGが独自に制作しています。メーカー等から商品提供を受けることもありますが、その場合は記事内に明記しております。コンテンツの内容や評価に関するランキングの決定には一切関与していません。メーカー等の指示による表示部分にはPRを表記します。記事内で紹介する商品を購入することで、当サイトに売り上げの一部が還元されることがあります。詳しくはサイト運営ポリシーをご覧ください。
みなさん、こんにちは、NORI(@norilog4)です。
スマホやPCからの検索でたまたま辿り着き閲覧した美しいと思うWEBサイト、どんな技術などを使って作られてるんだろうって思うことありませんか?
EC担当者、WEB制作ディレクターや、WEBデザイナーなどでもこの「Wappalyzer」を使うと簡単にサイトの技術を覗くことができます。
NORI
Apple製品の他、カメラやドローンが好きです。趣味で2021年から登山やキャンプもはじめました。国交省全国包括許可承認取得済 三陸特/アマ無線4級/DJI CAMPスペシャリストを取得。運営者の詳しい情報はこちら
Wappalyzer とは
「Wappalyzer」の読み方はいろいろありますが、「ワッパライザー」と呼ぶのが正式な読み方のようです。
Wappalyzerを利用すると、1クリックで表示中のWebページで利用されているソフトウェアやサービス、フレームワークなどを一覧表示してくれます。
このツールはChromeの拡張機能・Firefoxのアドオンで提供されており、拡張機能を追加・インストールすることで利用することが可能になるツールです。
Wappalyzer 使い方の解説動画
Wappalyzer の使い方
Wappalyzerの基本的な使い方ですが、利用するには拡張機能をインストールする必要があります。今回はChromeの拡張機能を使って紹介していきます。
Chromeの拡張機能のインストール方法
Wappalyzerは Chrome ウェブストアから追加することができます。
WrappalyzerのChromeの拡張機能にアクセスしたら、右上にある「Chromeに追加」ボタンをクリックするだけです。
拡張機能を追加するかどうかボックスが開くので、「拡張機能を追加」すると完了です。
Chromeの拡張機能が表示されない場合
拡張機能を追加すると、以下の画像のようにWappalyzerの紫のアイコンがChromeの右上のURLバーの横の表示されるようになります。
Googleのアカウントのすぐ左横にあるパズルのようなアイコンをクリックすると拡張機能を管理する画面が開くので、ピン()のアイコンをクリックすると表示されるようになります。
Wappalyzer を使って調べる方法
気になるサイトをChromeで表示して、拡張機能としてインストールしたアイコンをクリックします。
今回は個人的に好きなカメラ関連グッズを販売する PeakDesign のサイトを調べてみました。
ECサイトの場合
EコマースのベースとしてShopifyを利用している他、無料でも利用可能なヒートマップツールのHotjar、CDNはCloudflareを利用して構築しているようです。支払い方法もApple PayやAmazon Payにも対応しているのが確認できます。
このようにボタンを1クリックするだけでWebサイトの技術やら何を使って構築されているのかが確認できてしまう無料ツールです。
NORI
ブログサイトの場合
ガジェットブロガー界隈では有名なマクリンさん。月間100万PV・売上300万円のサイトを構築しています。このブログがどんな仕様でどんなプラグインなどを使ってるのかめちゃくちゃ気になりますよね。
サイトにアクセスして、Wappalyzerのアイコンをクリックすると….
CMSはWordPressで作られているようです。アナリティクスについては、Google Analyticsを利用、CDNはCloudflareを利用して構築。
キャッシュツールとしてWP Rocketを利用しているのは驚きです。このプラグインと国内最速!初期費用無料の高性能レンタルサーバーConohaを使って、サイトの高速化を実現されているようです。
このような形で、ECサイトやブログなどで利用しているコンテンツ管理システム、eコマースプラットフォーム、Webサーバー、JavaScriptフレームワーク、分析ツールなどを検出して情報を見ることができます。
NORI
Wappalyzer の注意点
このWappalyzerは、ちゃんと対策をしておかなければサイトが丸裸にされてしまい、そのサイトが使用しているCMSや言語などの種類だけでなく、バージョンもわかってしまいます。
調べられる内容においてのリスク
サイトが使用しているCMSや言語などの種類だけでなく、バージョンがわかってしまうと、そのバージョンに脆弱性がある場合にはハッカーから攻撃を受けやすくなってしまうという点がリスクとしてあります。
サイトを構築したあとでも、ちゃんとセキュリティー対策までしておくことをおすすめします。WordPressは特にバージョンによっては脆弱性があって乗っ取られたりする危険性もあるので、「Word Pressのバージョン非表示設定」や「PHPのバージョン非表示設定」などは最低入れておきましょう。
特に5年前に作ったまま放置されているサイトは結構危ないかもしれないですね。
Wappalyzerの使い方・解説まとめ
本記事は、気になるWebサイトの技術を調べる便利なツール Wappalyzer(ワップライザー)についての使い方。解説記事です。
サイトを構築する人や、WEB制作ディレクターなどはここらへんの情報とても気になると思います。
こういったツールを使って素敵なサイト制作に役立ててください。
以上、NORI(@norilog4)でした。