# WEBklar – Tracking-Plan

## Status: Google Analytics übersprungen

GA4 ist **nicht aktiv** und muss nicht eingerichtet werden. Solange `VITE_GA4_MEASUREMENT_ID` **nicht** in `.env` steht, sendet die Website **keine** Daten an Google.

Später optional aktivierbar — Abschnitt [GA4 aktivieren](#ga4-aktivieren-später-optional) unten.

## Übersicht

| Feld | Wert |
|------|------|
| Produkt | Marketing-Website (Vite + React SPA) |
| Tool | Google Analytics 4 (gtag.js) — **derzeit aus** |
| Mess-ID | nicht gesetzt (bewusst übersprungen) |
| Implementierung | `src/lib/analytics.ts`, `AnalyticsProvider` (liegt brach) |

## Ziele (Entscheidungen)

- Welche CTAs führen zu `/kontakt`?
- Wie viele Kontaktanfragen pro Kanal (UTM)?
- Welche Seiten werden besucht (inkl. SPA-Routen)?

## Events

| Event | Beschreibung | Properties | Trigger |
|-------|--------------|------------|---------|
| `page_view` | Seitenaufruf | `page_path`, `page_title` | Route-Wechsel (SPA) |
| `cta_clicked` | CTA-Klick | `button_text`, `location` | Klick auf `data-analytics-cta` oder Hero-Button |
| `form_submitted` | Kontaktformular erfolgreich | `form_type: contact` | Nach erfolgreichem Appwrite-Speichern |

## Conversions (in GA4 Admin markieren)

1. `form_submitted` – Haupt-Conversion (Lead)
2. Optional: `cta_clicked` mit `location: hero` – Interesse vor Formular

## UTM (Kampagnen-Links)

Beispiel für Newsletter oder Ads:

```
https://webklar.com/kontakt?utm_source=newsletter&utm_medium=email&utm_campaign=launch_2026
```

Konvention: Kleinbuchstaben, Unterstriche (`blog_footer_cta`).

## GA4 aktivieren (später, optional)

Nur wenn du messen willst:

1. In [Google Analytics](https://analytics.google.com/) Property → Datenstream → **Mess-ID** kopieren (`G-XXXXXXXXXX`).
2. In `.env`: `VITE_GA4_MEASUREMENT_ID=G-XXXXXXXXXX`
3. Dev-Server neu starten, in GA4 **DebugView** testen.

## Consent (EU)

Standard: `analytics_storage: denied` bis `grantAnalyticsConsent()` (z. B. Cookie-Banner). Ohne Banner bleibt Tracking inaktiv bis du die Funktion anbindest.

## Skills (Cursor)

Marketing-Skills liegen in `.agents/skills/` (analytics, copywriting, ai-seo, …). Im Agent-Chat z. B.: *„Richte GA4 für WEBklar ein“* – der `analytics`-Skill wird automatisch vorgeschlagen.