# Cookie Consent for Microsoft Clarity in Switzerland: Dev Guide

Switzerland is unique. It's not in the EU, but its data protection laws are equally strict. The Federal Act on Data Protection (FADP) requires explicit consent before collecting behavioural data. Microsoft Clarity's Consent API V2 includes Switzerland in its October 31st, 2025 enforcement deadline.

If your website serves Swiss users, you need this implementation.

## The Swiss Legal Landscape

Switzerland has:
- Federal Act on Data Protection (FADP)
- Cantonal-level variations
- Requirements nearly identical to GDPR

The bottom line: Swiss users expect their data to be treated with extreme care. Consent isn't optional. It's mandatory.

Microsoft recognizes this. That's why Switzerland is included in Consent API V2 enforcement. Starting November 1st, your Clarity tracking in Switzerland requires explicit user consent.

## The Implementation Strategy

Your code needs to:
1. Detect Swiss users
2. Show a clear consent banner
3. Fire consent signals to Clarity
4. Handle preference changes
5. Log consent for audit purposes

Here's how:

## Step 1: Detect Swiss Users

async function detectSwissUser() {
  try {
    const response = await fetch('https://ipapi.co/json/');
    const data = await response.json();
    return data.country_code === 'CH';
  } catch (error) {
    // Fallback: assume strict compliance for uncertain locations
    return true;
  }
}

This checks user IP geolocation. If you can't determine location reliably, default to strict compliance.

## Step 2: Create Consent Banner

For Swiss users, display a clear consent banner:

<div id="consent-banner" class="consent-banner">
  <h3>Your Privacy Matters to Us</h3>
  <p>We use Microsoft Clarity to understand how you use our website. This helps us improve your experience. We respect your choice.</p>
  
  <div class="consent-options">
    <label>
      <input type="checkbox" name="analytics" checked>
      Allow analytics tracking (required for improvements)
    </label>
    <label>
      <input type="checkbox" name="advertising">
      Allow advertising tracking (optional)
    </label>
  </div>
  
  <div class="consent-actions">
    <button id="accept-consent">Accept</button>
    <button id="reject-consent">Reject All</button>
    <button id="save-preferences">Save Preferences</button>
  </div>
</div>

Key points:
- Be specific about what you're tracking
- Explain why (improve experience, etc.)
- Make granular choices available
- Don't use dark patterns

## Step 3: Fire Consent Signals

function fireConsentSignal(preferences) {
  // Convert user preferences to Clarity format
  const analyticsStorage = preferences.analytics ? "granted" : "denied";
  const adStorage = preferences.advertising ? "granted" : "denied";
  
  // Fire signal to Clarity
  window.clarity('consentv2', {
    analytics_storage: analyticsStorage,
    ad_storage: adStorage
  });
  
  // Log for compliance audit
  logConsentEvent({
    timestamp: new Date().toISOString(),
    analytics: analyticsStorage,
    advertising: adStorage,
    country: 'CH'
  });
}

// When user clicks Accept
document.getElementById('accept-consent').addEventListener('click', function() {
  const preferences = {
    analytics: true,
    advertising: true
  };
  fireConsentSignal(preferences);
  storePreferences(preferences);
  hideBanner();
});

// When user clicks Reject All
document.getElementById('reject-consent').addEventListener('click', function() {
  const preferences = {
    analytics: false,
    advertising: false
  };
  fireConsentSignal(preferences);
  storePreferences(preferences);
  hideBanner();
});

// When user saves custom preferences
document.getElementById('save-preferences').addEventListener('click', function() {
  const preferences = {
    analytics: document.querySelector('input[name="analytics"]').checked,
    advertising: document.querySelector('input[name="advertising"]').checked
  };
  fireConsentSignal(preferences);
  storePreferences(preferences);
  hideBanner();
});

## Step 4: Persistent Storage

Swiss law requires you to log and prove you captured consent. Store preferences:

function storePreferences(preferences) {
  const consentRecord = {
    timestamp: new Date().toISOString(),
    preferences: preferences,
    version: '1.0', // Update if your banner changes
    ipHash: hashIP(getUserIP()), // Anonymized user identifier
  };
  
  // Store locally (session storage is fine for Swiss law)
  sessionStorage.setItem('clarity_consent', JSON.stringify(consentRecord));
  
  // Also send to your server for audit trail
  fetch('/api/log-consent', {
    method: 'POST',
    body: JSON.stringify(consentRecord)
  });
}

Maintain server-side records for compliance audits. Swiss regulators may ask for proof.

## Step 5: Handle Preference Updates

Users might change their minds. Add a preference center:

function showPreferenceCenter() {
  // Open modal to update preferences
  const currentPrefs = getStoredPreferences();
  
  // Update UI to show current state
  document.querySelector('input[name="analytics"]').checked = currentPrefs.analytics;
  document.querySelector('input[name="advertising"]').checked = currentPrefs.advertising;
  
  // Show modal
  document.getElementById('preference-modal').style.display = 'block';
}

function updatePreferences(newPreferences) {
  // Fire new signal
  fireConsentSignal(newPreferences);
  
  // Update storage
  storePreferences(newPreferences);
  
  // Close modal
  document.getElementById('preference-modal').style.display = 'none';
}

## Key Swiss Compliance Points

• **Clear Language**: Use simple, non-technical language. FADP requires transparency.

• **Granular Control**: Users must control analytics and advertising separately. Don't force bundled consent.

• **Timing**: Show banner before