個人サイトのアクセス解析とメアド取得スタック(2026-05 時点)
GitHub Pages で動かしている個人サイト(nikinakamura.com / この TIL)について、「誰が来ているか知りたい」「連絡フォームでメアドを受け取りたい」という素朴な要件を、無料・静的サイト前提・日本の法律で安全という 3 つの制約で組み直した記録。前提を置き間違えると「アクセス解析で個人を特定できる」と思い込んだり、海外 SaaS に丸投げして個人情報保護法に触れたりするので、何が原理的に取れて何が取れないかから整理する。
1. アクセス解析が答えられること / 答えられないこと
まず最大の誤解から潰す。アクセス解析ツール(GA4・Clarity 等)が見せてくれるのは 匿名の client_id 単位の行動データ であって、生身の「誰」ではない。
| 取れる | 取れない | |---|---| | 流入元(referrer、UTM、検索クエリの一部) | 氏名 | | ページ動線(landing → 離脱、scroll depth、event) | メアド・電話番号 | | デバイス・OS・ブラウザ・解像度 | 住所・所属 | | 国・都道府県・市区(IP geolocation 精度) | 「誰の」セッションか | | PV、UU(同一 client_id 単位)、滞在時間 | 同一人物の cross-site 履歴 |
GA4 が記録する client_id は cookie ベースの乱数 UUID で、本人がログインしたサービス側(YouTube・Search Console)と紐づかない限り、人物に解決できない。「誰が来たか」を知る唯一の道は、サイト側で本人に自発的にメアド・氏名を入力してもらうこと(フォーム / 認証 / メルマガ登録)。これは技術の問題ではなく、個人情報保護法 17 条が要求する取得時の利用目的明示の枠組みに乗らない方法では取得しちゃいけないという意味で、法律の問題でもある(https://www.ppc.go.jp )。
つまりアクセス解析と email 取得は 目的が違う 2 つのスタック として組む。アクセス解析は「全体傾向」、メアド取得は「個別の連絡先」。これを混同するとプライバシーポリシーで詰む。
2. 無料の行動解析スタック(2026 現在)
「無料 + 静的サイトに JS スニペット 1〜2 行で乗る」基準で生き残っている選択肢を並べる。
2.1 各ツールの素描
- Google Analytics 4 — Universal Analytics 廃止(2023-07)以降の事実上のデフォルト。Search Console・Ads・YouTube との連携、BigQuery export(free)、Looker Studio 統合などエコシステムが圧倒的。弱点はレポート反映が即時でないこと(リアルタイム以外のレポートは通常 24〜48 時間遅延、サンプリングあり)、cookieless 圏で精度が落ちること、UI が複雑であること。
- Microsoft Clarity — Microsoft が 完全無料・上限なし で提供している(https://clarity.microsoft.com 公式の「無期限で無料」「トラフィックに制限はありません」表記で確認済)。セッションリプレイ(録画)とヒートマップ、AI による行動サマリ、Dead/Rage クリック検出が標準装備。GA4 と用途が補完的(GA4 が定量、Clarity が定性)。JS 1 行で導入、cookie ベース。
- Cloudflare Web Analytics — privacy-first、cookie 不要、JS スニペット 1 行。Cloudflare の DNS / proxy 配下である必要は無い(公式 docs に "without changing DNS or using Cloudflare proxy" 明記、https://developers.cloudflare.com/web-analytics/ )。集計のみでセッションリプレイは無い。
- Plausible Analytics — cookieless、GDPR 親和、OSS でセルフホスト可(https://plausible.io 、SaaS は Starter $9/月から、30 日無料トライアル)。
- GoatCounter — 軽量 OSS、個人 / 小規模なら無料 SaaS、セルフホスト可、cookie 不要(https://www.goatcounter.com 、"offered for free for reasonable public usage")。
- Fathom Analytics — 商用、cookieless、$15/月〜(free tier 無し)。プライバシー重視サイトでよく使われる。
2.2 比較表
| ツール | 無料 | セッションリプレイ | クロスドメイン | cookie | GDPR/JP親和 | 設置難易度 | |---|---|---|---|---|---|---| | GA4 | ◎ | × | △(要設定) | 要 | △(同意要) | 中(GTM 推奨) | | Microsoft Clarity | ◎ 上限なし | ◎ | ○ | 要 | △ | 低 | | Cloudflare Web Analytics | ◎ | × | × | 不要 | ◎ | 低 | | Plausible | × | × | ○ | 不要 | ◎ | 低 | | GoatCounter | ○(個人無料) | × | × | 不要 | ◎ | 低 | | Fathom | × | × | ○ | 不要 | ◎ | 低 |
2.3 個人サイトの結論
GA4 + Microsoft Clarity の 2 枚刺しで十分。両方無料・補完的・JS 数行。プライバシーの過敏さを優先するなら Cloudflare Web Analytics 単独もアリだが、Clarity のセッションリプレイで得られる UX 学習量は個人サイトでも大きい。
3. 無料の email 取得スタック
GitHub Pages は静的ホスティングなのでフォーム処理サーバを持てない。送信先は外部 SaaS に丸投げするか、Cloudflare Workers のような自前サーバレスで受ける。
3.1 各サービスの素描
- mailto: リンク — インフラゼロ。最大の弱点は メアドが HTML 上で world-readable になり、スクレイピング bot のスパム標的になること。
- Web3Forms — Access Key を取って
<form action="https://api.web3forms.com/submit">で POST、サイト側にバックエンド不要、月 250 送信まで無料(https://docs.web3forms.com で確認済「Web3Forms free tier includes 250 submissions per month」)。CAPTCHA 連携あり。 - Formspree — Free プランは月 50 送信(https://help.formspree.io 「Submission allowances vary by plan, starting at 50 per month on the Free tier」)。設定 UI が親切、reCAPTCHA・file upload・Slack 連携あり。
- Buttondown — newsletter 向け。100 subscribers まで無料(https://buttondown.com/pricing 「Absolutely nothing for your first 100 subscribers」)。markdown editor、custom domain、archive が free 範囲。analytics と paid newsletter は $9/月〜。
- Cloudflare Workers + Email Routing — Cloudflare 配下のドメインなら、Email Routing で受信メールを Worker に流して任意宛先に転送できる(無料枠で十分)。フォームから fetch で Worker に POST → Worker から SMTP API(Resend / MailChannels)に投げる構成も可能。コードは書くが完全無料運用。
- HubSpot Free / Mailchimp Free — CRM/MA。無料枠あるが個人サイトには重い。Mailchimp の free は 500 contacts、月 1,000 送信まで(2024 改定後)。
- Netlify Forms — Netlify ホスティング前提(GitHub Pages からは使えない)。legacy 無料プランは月 100 送信、2026-04-14 以降の credit-based プランでは form submission が課金対象外になった(https://docs.netlify.com/manage/forms/usage-and-billing/ )。
3.2 比較表
| サービス | 無料上限 | バックエンド | 自動返信 | 配信機能 | dashboard | JP 法対応 | |---|---|---|---|---|---|---| | mailto: | 無制限 | 不要 | × | × | × | △ スパム懸念 | | Web3Forms | 250/月 | 不要 | ○ | × | ○ | ○ | | Formspree | 50/月 | 不要 | ○ | × | ◎ | ○ | | Buttondown | 100 subs | 不要 | ○ | ◎ | ◎ | ○ | | CF Workers + Email | 実質無制限 | Worker 必要 | 実装次第 | × | × | ◎ | | Mailchimp Free | 500 contacts | 不要 | ○ | ◎ | ◎ | ○ | | Netlify Forms | 100/月(legacy) | Netlify 必要 | ○ | × | ○ | ○ |
3.3 個人サイトの結論
- 単発の「連絡してください」フォーム → Web3Forms(250/月は個人サイトには十分余裕)。
- 将来 newsletter を出す予定 → Buttondown free。100 subs を越えそうになったら有料に切り替える明確な閾値がある。
- 既に Cloudflare 配下のドメインなら Cloudflare Workers + Email Routing で自前構成も合理的(外部 SaaS に依存しない、永続無料)。
4. 法律的に注意するべきこと(日本)
個人サイトでも、メアドを取る瞬間に 個人情報取扱事業者 の義務が発生する。誤解されがちな 3 点を整理する。
4.1 個人情報保護法
- メアド単体でも個人情報に該当する: ドメインや local-part から本人が特定できる場合(
taro.yamada@example.co.jpのような)、連絡先情報として個人情報に当たる。仮にそうでなくとも「個人関連情報」として規律される。 - 利用目的の明示(17 条): フォームの近くに「お問い合わせ対応のためにのみ使用し、第三者に提供しません」のような 取得時の利用目的の公表または通知 が必須。
- 安全管理措置(23 条): SaaS(Web3Forms 等)に渡す = 「委託」扱い。委託先の監督義務が生じる(プライバシーポリシーに「お問い合わせフォームの運営は Web3Forms に委託しています」と書く)。
4.2 特定電子メール法
商業的内容のメール(広告、宣伝、サービス紹介を含む newsletter)を送る場合:
- 事前同意(opt-in)必須: チェックボックスで同意を取る。「メール受信欄」に自動チェックは違反。
- 配信停止リンク必須: メール本文に unsubscribe 導線を必ず置く。Buttondown は自動で挿入される。
- 送信者情報の明示: 氏名 / 名称、住所、連絡先メアドの記載義務。
4.3 改正電気通信事業法(2023-06-16 施行)の外部送信規律
いわゆる「日本版 Cookie 規制」。GA4 のような第三者送信を含む解析ツールを使うと cookie 等の利用者情報が Google に送られることになり、原理的にはこの規律の対象だが:
- 個人サイト / 個人ブログは規制対象外: 「自社商品等のオンライン販売のためのホームページ運営や企業等のホームページ運営・個人ブログの場合は、電気通信事業に該当しないため、対象にはなりません」(総務省解説、https://www.soumu.go.jp/main_sosiki/joho_tsusin/d_syohi/gaibusoushin_kiritsu.html )
- ただし望ましい運用: 規制対象外でも、プライバシーポリシーに「Google Analytics・Microsoft Clarity を使用しており、cookie および行動ログが当該サービスに送信されます。詳細は各社のポリシーを参照」と書くのが慣行。透明性は正味プラス。
- 対象事業者の閾値: 利用者数が「相当数」(明確な数値は無いが、政省令上は一定規模の電気通信役務)。個人サイトはまず該当しない。
4.4 プライバシーポリシーの最低構成
/privacy/ に 1 ページ置く。必要要素:
- 取得する情報(フォーム入力情報、cookie/解析データ)
- 利用目的(連絡対応、サイト改善)
- 第三者提供の有無(しない)
- 委託先(Web3Forms、GA4、Clarity 等を列挙)
- 開示・削除請求の連絡先
- cookie 説明と無効化方法(ブラウザ設定リンク)
- 改定履歴
雛形は政府の個人情報保護委員会ガイドライン(https://www.ppc.go.jp )から要素を引く。Termly や Iubenda のような generator もあるが、英語ベースで JP 法と完全一致しないので参照のみ。短くて良いので自分の言葉で書くのが結局速い。
5. 推奨構成(個人サイトの場合)
| 用途 | ツール | 設置場所 | 月コスト |
|---|---|---|---|
| 行動解析(定量) | Google Analytics 4 | _layouts/default.html の <head> | 0 円 |
| 行動解析(定性) | Microsoft Clarity | 同上、GA4 の下 | 0 円 |
| 連絡フォーム | Web3Forms | about ページ末尾 | 0 円(250/月) |
| newsletter(将来) | Buttondown | dedicated page | 0 円(100 subs まで) |
| プライバシーポリシー | 自作 markdown | /privacy/index.md | 0 円 |
切り替え基準:
- 月 250 フォーム送信を超えそう → Web3Forms 有料か Cloudflare Workers 自前へ
- newsletter 100 subs 超 → Buttondown $9/月 か Mailchimp / ConvertKit へ
- セッションリプレイのプライバシーが気になる → Clarity を切って Cloudflare Web Analytics 単独へ
6. GitHub Pages 上での設置注意
- バックエンドを持てない: フォーム処理は外部 SaaS / Worker に丸投げ必須。
- JS スニペット injection: Jekyll なら
_layouts/default.htmlに{% if site.google_analytics %}<script>...</script>{% endif %}のガード付きで埋め込む。_config.ymlで本番のみ有効化。 - フォーム HTML だけ置けば送信は SaaS 側で完結: Web3Forms なら
<form action="https://api.web3forms.com/submit" method="POST"><input type="hidden" name="access_key" value="YOUR_KEY">...</form>だけ。リダイレクト先は同じドメインの thank-you ページにできる。 - honeypot 必須:
<input type="checkbox" name="botcheck" style="display:none">のような hidden 項目を入れて、bot がチェックしたら弾く。Web3Forms / Formspree とも標準対応。 - プライバシーポリシーへのリンク: フォームの送信ボタン近くに
<a href="/privacy/">プライバシーポリシー</a>を必ず置く。
7. まとめ
- アクセス解析は「全体傾向」、メアド取得は「個別の連絡」。目的が違う 2 スタックとして組む。匿名解析からは個人を特定できないし、してはいけない。
- 個人サイトの 2026 ベスト構成は GA4 + Microsoft Clarity(解析)+ Web3Forms(フォーム、月 250 まで無料)+ Buttondown(newsletter、100 subs まで無料)。全部無料で運用が回る。
- 日本の法律: メアドは個人情報、利用目的明示と委託先監督は最低限。改正電気通信事業法の外部送信規律は個人サイトは原則対象外、ただしプライバシーポリシーに GA4 / Clarity を書くのが慣行。
- GitHub Pages 静的ホスティング前提なら、バックエンドは持てないので外部 SaaS(Web3Forms 等)か Cloudflare Workers + Email Routing でフォーム処理を外出しする。
参考・引用元
- Google Analytics 4 — 公式ドキュメント, Google
- Microsoft Clarity — サイト, Microsoft
- Web3Forms — サイト, Web3Forms
- Buttondown — サイト, Buttondown (Justin Duke)
- Cloudflare Email Routing — 公式ドキュメント, Cloudflare
- 改正電気通信事業法 外部送信規律 — 公式サイト, 総務省
- 個人情報保護委員会 — 公式サイト, PPC(日本)
- Formspree alternatives comparison — サイト, Formspree
2026-05-18