cnil-cookie-banner について
フランスの利用者向けにCookieバナーを実装するチームのための設計・技術ガイドです。選択肢の同等表示、目的別同意、タグのブロック、同意記録、アクセシビリティに関するCNIL準拠の要件を説明します。
主な機能
- 01受諾と拒否を同等に目立たせる設計
- 02目的別の同意設定
- 03必須でない項目は初期状態でオフ
- 04期限切れやポリシー変更時の再提示
- 05同意前の必須でないタグのブロック
- 06キーボードとスクリーンリーダーへの対応
活用シーン
- 01階層型Cookieバナーの実装
- 02目的別同意記録の設定
- 03同意前のタグ動作の確認
- 04バナーのアクセシビリティの点検
インストール
コマンドをコピーしてターミナルで実行します。
npx skills add https:/ / github.com/ mukul975/ privacy-data-protection-skills --skill cnil-cookie-bannerインストール後、Claude Code で/cnil-cookie-bannerを入力して読み込まれたか確認します。
同梱ファイル
SKILL.md と一緒にインストールされる参考資料やスクリプト。
assets/template.mdreferences/standards.mdworkflows.mdscripts/process.py詳細
CNIL 準拠の Cookie バナーの実装
概要
フランスのデータ保護機関である Commission Nationale de l'Informatique et des Libertés(CNIL)は、EU でも特に厳格な Cookie 同意要件を適用しています。更新されたガイドライン(2020 年 9 月 17 日付審議決定第 2020-091 号)および Google LLC に対する 1 億ユーロ、Google Ireland Limited に対する 5,000 万ユーロの制裁金(2021 年 12 月 31 日)、Meta Platforms Ireland Limited に対する 6,000 万ユーロの制裁金(2022 年 12 月 31 日。その後の複数の決定により、合計 1 億 5,000 万ユーロに増額)を含む、画期的な執行措置を踏まえ、フランスのユーザーにサービスを提供する組織は、特定のデザイン要件と機能要件を満たす Cookie バナーを実装する必要があります。
CNIL の Cookie バナー要件
1. 同意ボタンと拒否ボタンを同等に目立たせる
CNIL は、Cookie を拒否する仕組みを、同意する仕組みと同じくらい簡単に使えるようにすることを求めています。これは Google と Meta に対する執行措置の中心的な問題でした。両社は目立つ「すべて許可」ボタンを表示する一方で、Cookie の拒否には複数回のクリックを必要としていました。
Pinnacle E-Commerce Ltd に準拠するデザイン:
+------------------------------------------------------------------+
| Pinnacle E-Commerce uses cookies |
| |
| We use cookies to improve your shopping experience, analyse |
| site traffic, and personalise content. You can accept all |
| cookies, reject non-essential cookies, or customise your |
| choices. |
| |
| [Accept All] [Reject All] [Customise] |
| |
| Privacy Policy | Cookie Policy |
+------------------------------------------------------------------+
デザインルール:
- 「すべて許可」ボタンと「すべて拒否」ボタンの視覚的な重みを同一にする必要があります。サイズ、フォント、配色、配置の優先度を同じにします
- いずれのボタンにもダークパターンを使用してはいけません(例:許可ボタンには明るい色、拒否ボタンにはグレーを使用する)
- 「カスタマイズ」または「設定を管理」する選択肢も同じ階層で利用できるようにする必要があります
- バナーでは操作を誘導する言葉(「最高の体験のために許可してください」など)を使わず、中立的な「すべて拒否」を使用する必要があります
2. Cookie ウォールの禁止
CNIL のガイドラインでは、ウェブサイトへのアクセスを Cookie への同意の条件としてはなりません。すべての Cookie を許可するまでコンテンツをブロックする Cookie ウォールは禁止されています。
禁止される実装:
+------------------------------------------------------------------+
| To access Pinnacle E-Commerce, please accept our cookies. |
| |
| [Accept All Cookies] |
+------------------------------------------------------------------+
準拠する代替案: ユーザーが「すべて拒否」をクリックした場合でも、サイトは完全に機能する必要があります(最低限、閲覧できる状態にします)。カート機能、認証、セキュリティに必要な Cookie は、厳密に必要な場合の例外として引き続き設定できます。
3. 目的ごとの詳細な同意
カスタマイズ画面では、ユーザーが各目的に個別に同意できるようにする必要があります。
レイヤー 2 — 設定のカスタマイズ:
+------------------------------------------------------------------+
| Manage your cookie preferences |
| |
| Strictly Necessary [Always Active] |
| Required for the site to function (cart, security, login). |
| These cannot be disabled. |
| |
| Analytics [Toggle OFF] |
| Help us understand how visitors use the site to improve our |
| services. Data is aggregated and anonymised. |
| Partners: Google Analytics |
| |
| Advertising [Toggle OFF] |
| Used to show you relevant advertisements on other websites. |
| Partners: Meta, Google Ads |
| |
| Functionality [Toggle OFF] |
| Remember your preferences such as language and currency. |
| |
| [Confirm My Choices] [Accept All] [Reject All] |
+------------------------------------------------------------------+
レイヤー 2 のルール:
- 必須ではない切り替え項目はすべて初期状態で OFF にします(同意にあらかじめチェックを入れません)
- 各カテゴリに、サードパーティのパートナー名を具体的に記載します
- 「選択内容を確定」では、現在の切り替え状態を保存します
- この画面でも「すべて許可」と「すべて拒否」を選べるようにします
4. 同意の有効期間と再同意
CNIL は、同意を定期的に更新することを推奨しています。
| パラメーター | CNIL の要件 |
|---|---|
| 同意の最大有効期間 | 6 か月(CNIL の推奨) |
| 拒否の保持期間 | 再度確認するまで 6 か月 |
| 同意の証明の保持期間 | 同意の有効期間に、適用される時効期間を加えた期間 |
| 同意の有効期限後の再確認 | バナーを自動的に再表示する必要があります |
| Cookie ポリシー変更後の再確認 | 必須 — 新たな同意が必要です |
Pinnacle E-Commerce Ltd での実装:
同意のタイムスタンプをファーストパーティ Cookie に保存します。
cookie_consent_timestamp=2026-01-15T10:30:00Z
cookie_consent_version=v2.3
cookie_consent_state=accepted_analytics|rejected_advertising|accepted_functionality
各ページの読み込み時に、次の点を確認します。
cookie_consent_timestampが存在するか- そのタイムスタンプが 6 か月以内のものか
cookie_consent_versionが現在の Cookie ポリシーのバージョンと一致しているか
いずれかの確認に失敗した場合は、バナーを再表示します。
5. 欺瞞的なデザインパターンの禁止
CNIL は、以下のダークパターンを明確に禁止しています。
| ダークパターン | 説明 | 禁止される理由 |
|---|---|---|
| 非対称なボタン | 同意ボタンは大きく色鮮やかで、拒否ボタンは小さく灰色 | 目立ちやすさに差があると、同じ容易さを求める要件に違反します |
| 拒否の隠蔽 | 拒否オプションが設定の階層の奥に埋もれている | 同意と同じ階層に配置する必要があります |
| 紛らわしいトグル | OFF のときに、トグルが視覚的に ON に見える | 十分な情報に基づく同意を損ないます |
| 罪悪感をあおる表現 | 「拒否すると、パーソナライズされた特典を逃してしまいます」 | 操作的な表現です |
| 目的の事前選択 | 分析や機能のトグルがあらかじめ有効になっている | 積極的な同意の要件(Planet49)に違反します |
| 繰り返しの表示 | 拒否後もページを表示するたびにバナーを再表示する | 強制にあたり、拒否を 6 か月間尊重する必要があります |
技術的な実装
バナーの読み込み動作
- 同意前に Cookie を設定しない:ユーザーがバナーを操作する前に、必須ではない Cookie を設定してはなりません。タグはコンテナレベルでブロックする必要があります。
- バナーを同期的に読み込む:タグ管理スクリプトを実行する前に、同意バナーを読み込む必要があります。
- サーバー側での適用:Cookie の設定をトリガーするリクエストについては、同意の状態をサーバー側で検証する必要があります。
タグブロックのアーキテクチャ
Page Load
│
├── Load consent banner script (synchronous)
│
├── Check consent state cookie
│ ├── No consent recorded → Show banner, block all non-essential tags
│ ├── Consent expired (>6 months) → Show banner, block all non-essential tags
│ ├── Consent recorded → Parse consent state
│ ├── Analytics accepted → Fire GA4 tags
│ ├── Advertising accepted → Fire Meta Pixel, Google Ads tags
│ └── Functionality accepted → Fire preference cookies
│
└── User interacts with banner
├── Accept All → Set all tags, store consent
├── Reject All → Block all non-essential tags, store refusal
└── Customise → Show Layer 2, await per-purpose selection
同意の保存
同意の証明は、少なくとも以下のフィールドを含めて保存してください。
| フィールド | 値 |
|---|---|
| 同意 ID | 同意イベントごとの UUID |
| ユーザー識別子 | 仮名化したユーザー ID または Cookie ID |
| タイムスタンプ | ISO 8601 UTC |
| バージョン | バナーのテキスト/デザインのハッシュ |
| Cookie ポリシーのバージョン | バージョン識別子(例:v2.3) |
| 選択内容 | 目的ごとの同意/拒否 |
| 収集方法 | "cookie_banner_layer_1" または "cookie_banner_layer_2" |
| IP アドレス | 位置情報の検証用(別途保管し、アクセスを制限) |
アクセシビリティ要件
Cookie バナーは WCAG 2.1 Level AA に準拠する必要があります。
- キーボードで操作できる(Tab、Enter、Escape)
- スクリーンリーダーに対応している(ARIA のロール、ラベル)
- 十分な色のコントラストがある(最低 4.5:1)
- 操作が完了するまでバナー内にフォーカスを閉じ込める(背後のページとの操作を防止)
- バナーのテキストのフォントサイズは最低 14px
CNIL の執行事例
| 日付 | 組織 | 罰金 | 主な違反 |
|---|---|---|---|
| 31 Dec 2021 | Google LLC | EUR 100,000,000 | 同等の拒否手段がないこと、同意前に Cookie を設定したこと |
| 31 Dec 2021 | Google Ireland | EUR 50,000,000 | Google LLC と同じ違反 |
| 29 Dec 2022 | TikTok | EUR 5,000,000 | 同等の拒否手段がないこと |
| 31 Dec 2022 | Meta Platforms Ireland | EUR 60,000,000 | 同等の拒否手段がないこと |
| 15 Jun 2023 | Criteo | EUR 40,000,000 | 同意が自由意思に基づいていないこと、情報が不十分であること |
| 28 Dec 2023 | Amazon France | EUR 32,000,000 | 同意なしに Cookie を保存したこと |
主な法的根拠
- CNIL Deliberation No. 2020-091(17 September 2020) — Cookie およびその他のトラッカーに関するガイドライン
- CNIL Recommendation on cookies(1 October 2020) — 同意を取得する実務上の方法
- ePrivacy Directive 2002/58/EC, Article 5(3) — デバイスへの情報の保存/アクセスに関する同意
- CJEU Case C-673/17(Planet49) — 積極的な同意、事前にチェックされたボックスの禁止
- GDPR Article 7 — 撤回を含む同意の条件
- CNIL Decision SAN-2021-023(Google) — Cookie の同意違反に対する総額 EUR 150M の罰金
- CNIL Decision SAN-2022-021(Meta) — Cookie の同意違反に対する EUR 60M の罰金