HTML-dashboards met Claude: flexibeler dan een BI-tool

Een HTML-dashboard is een webpagina met analyse en slides, die Claude uit je marketingdata bouwt en die je op Cloudflare host. Een grafiek aanpassen of een metriek als CAC, CLV of een cohortanalyse toevoegen, is één prompt en staat seconden later online. Een klassieke tool zoals Data Studio past beter wanneer veel mensen zelf rapporten bouwen.

Als Google Analytics bureau bouwen we zulke dashboards met Claude. Hieronder lees je waarom, hoe je de belangrijkste metrieken correct definieert, wanneer een klassieke tool toch beter past, en hoe je de data afschermt.

Waarom wij dashboards in HTML bouwen

De grootste winst is flexibiliteit. Een BI-tool beperkt je tot zijn grafieken, connectors en berekende velden. Een HTML-pagina kan alles tonen wat je kunt beschrijven, in de huisstijl van je merk.

Wat dat in de praktijk betekent:

• Aanpassen in seconden. Een extra kolom, een andere periode of een nieuwe metriek is een prompt, geen avond slepen in een rapportbouwer.
• Geavanceerde metrieken binnen handbereik. CAC, CLV en cohorten zijn voor Claude rekenwerk, geen aparte module.
• Goedkoop hosten. Verzoeken naar statische bestanden zijn bij Cloudflare gratis en onbeperkt ^[1].
• Eerst testen. Een nieuwe versie krijgt een eigen URL voor ze live gaat ^[2].

Onze route: Coupler.io haalt de data op een vast schema op, Markifact ontsluit de advertentieplatformen, en via MCP leest Claude beide. Claude bouwt de pagina en publiceert ze op Cloudflare; een tussenversie delen we soms als Claude-artifact.

Wat je verder nodig hebt: vaste afspraken over de definities en iemand die nakijkt. Het dashboard volgt ook je design system, zodat rapport, site en decks één merk vormen. Hoe dat werkt, lees je in een design system voor Claude.

Definieer CAC, CLV en cohorten vóór je ze toont

Claude rekent uit wat je vraagt. Is de definitie vaag, dan schuift het cijfer bij elke aanpassing. Leg daarom per metriek de formule vast, in de prompt én zichtbaar in het dashboard.

De eenvoudigste formule voor CLV is gemiddelde transactiewaarde maal gemiddeld aantal transacties maal levensduur van de klant ^[4]. Shopify noemt een verhouding van CLV tot CAC tussen 3:1 en 5:1 efficiënt ^[3]. Wat klikken en campagnes kosten, en dus je CAC voeden, lees je bij Benjamin in wat kost Google Ads.

Wanneer Data Studio beter past

Data Studio van Google is gratis voor wie rapporten maakt en bekijkt, en koppelt rechtstreeks aan meer dan 1.400 databronnen ^[6]. Het heette tot voor kort Looker Studio. De betaalde Pro-versie voegt teamruimtes toe, en rapporten die eigendom zijn van de organisatie in plaats van één gebruiker ^[7].

Kies een klassieke tool als:

• veel mensen zelf rapporten willen bouwen, zonder iemand die de code beheert;
• je live connectors wil zonder eigen datastroom naar het dashboard;
• eigendom en beheer van rapporten in een groot team zwaarder wegen dan vormvrijheid.

Kies HTML als je eigen metrieken en gecombineerde bronnen wil, een vaste groep lezers hebt, zoals directie of klant, en vaak iets verandert.

Reken wel op onderhoud. Nieuwe data moet op een vast schema binnenkomen, en elke wijziging moet iemand nakijken. Dat is het echte prijskaartje van een HTML-dashboard, niet de hosting.

Scherm je data af

Een statische pagina is leesbaar voor iedereen die de link kent. Ook testversies op Cloudflare zijn standaard publiek; je schermt ze af met Cloudflare Access ^[2]. Access weigert standaard iedereen: alleen wie aan een toegangsregel voldoet, komt binnen, en elk verzoek wordt op een geldig token gecontroleerd ^[8].

Drie regels die altijd gelden:

• Alleen samengevatte cijfers, geen namen, e-mailadressen of klantnummers.
• Geen sleutels of wachtwoorden in de pagina. Alles in een HTML-bestand is leesbaar in de broncode.
• Accounts op naam van het bedrijf, met tweestapsverificatie op de hosting en de code.

Een tussenversie als Claude-artifact is bij de start alleen voor jou zichtbaar ^[9]. Hoe de schakels van onze stack samenwerken en welke rechten elk krijgt, lees je in onze AI-marketingstack.

Zo bouw je er een

Een eerste versie staat er sneller dan de vergadering om ze te bespreken. De volgorde:

1. Kies vijf tot acht KPI's en schrijf van elk de formule uit.
2. Laat de data samengevat binnenkomen, op een vast schema.
3. Vraag Claude de pagina, met je design system en je definities erbij.
4. Leg per metriek één cijfer naast de bron. Waarom GA4 en Google Ads daarbij kunnen verschillen, legt Cédric uit in waarom GA4 en Google Ads andere cijfers tonen.
5. Publiceer eerst als testversie of als Claude-artifact, zet Access aan en ga dan live.

Een dashboard is zo goed als de meting erachter. Twijfel je daaraan, begin dan met de gratis tracking-audit.