Best practices voor White Label-merkmateriaal

White Label Lite heeft aparte velden voor een licht logo, donker logo, favicon, primaire kleur en accentkleur. Deze handleiding helpt je een duidelijke merkset te maken, bestanden te gebruiken die het formulier accepteert en het resultaat te testen voordat klanten het zien.

Logo's uploaden

Er zijn twee logo-uploads: een licht logo voor lichte achtergronden en een donker logo voor donkere achtergronden. Upload beide als je ze hebt en controleer in de Branding-voorvertoning of elk logo in het bedoelde thema leesbaar blijft.

Ondersteunde bestandstypen:

• PNG: het beste voor transparantie en aanbevolen voor de meeste toepassingen.
• JPG / JPEG: geschikt voor logo's met een effen achtergrond; transparantie wordt niet ondersteund.
• SVG: momenteel niet ondersteund, omdat we werken aan veilige weergave van ingesloten scripts.

Maximale bestandsgrootte: 1 MB per upload. Comprimeer grotere bestanden met TinyPNG of pngquant. Normale logo's kunnen zonder zichtbaar kwaliteitsverlies tot minder dan 50 KB worden gecomprimeerd.

Aanbevolen brongrootte: gebruik een duidelijke bron met een redelijk hoge resolutie, niet een piepklein pictogram. Een vierkant of bijna vierkant logo is een veilig beginpunt. Een breder woordmerk werkt ook als het in de voorvertoning leesbaar blijft.

Achtergronden:

• Een transparante PNG wordt sterk aanbevolen. De dashboardachtergrond en kopbalk van merkmails zijn mogelijk niet zuiver wit. Een gekleurde achtergrond met harde rand aan je logo ziet er dan slecht uit.
• Transparantie laat een monogram of pictogram netjes op elke achtergrond staan.
• Heeft het logo een vaste gekleurde achtergrond, stem die dan af op de primaire of accentkleur van het dashboard.

Favicon

De favicon heeft een eigen afzonderlijke upload en wordt niet automatisch uit het logo afgeleid. Gebruik een eenvoudig vierkant pictogram in PNG-, JPG- of ICO-formaat van maximaal 1 MB. Een monogram of symbool werkt op tabbladformaat meestal beter dan een volledig woordmerk.

Houd de favicon vierkant. Gebruik voor het volledige woordmerk de velden voor licht en donker logo, niet de favicon.

Kleuren kiezen

De twee kleurvelden zijn:

• Primaire kleur: de hoofdkleur voor knoppen, links en actieve statussen.
• Accentkleur: een ondersteunende kleur voor markeringen.

Voer hexadecimale kleuren in, bijvoorbeeld #3b82f6. Bekijk het resultaat voor het opslaan in de live voorvertoning.

Primaire kleur kiezen

De primaire kleur zien bezoekers het meest. Houd rekening met drie zaken:

• Test op lichte en donkere achtergronden. Het dashboard ondersteunt beide thema's. Een kleur die op wit opvalt, kan op donker verdwijnen.
• Houd statuskleuren herkenbaar. Vermijd een merkkleur die sterk lijkt op waarschuwingen, successen of destructieve acties. Helder blauw, paars, petrol, antraciet of een andere onderscheidende merkkleur leest meestal beter.
• Effen, gemiddeld verzadigde tinten werken beter dan bijna wit of zwart. Vraag jezelf af of de kleur als knop op een witte achtergrond zou opvallen. Is het antwoord 'nauwelijks', dan is hij te bleek.

Accentkleur kiezen

De accentkleur ondersteunt de primaire kleur. Deze moet:

• Zichtbaar afwijken van primair, dus niet twee bijna blauwe tinten gebruiken
• Primair aanvullen zonder ermee te concurreren
• Duidelijk leesbaar zijn naast primair

Een goed patroon: primair is een diepe, verzadigde merkkleur en accent is een lichtere complementaire tint. Voorbeeld: primair #2563eb (indigo-600), accent #10b981 (emerald-500).

Contrast en toegankelijkheid

De interface kan lichte tekst over je primaire kleur plaatsen. Kies een tint waarbij knoplabels leesbaar blijven. Een heel lichte pasteltint kan aantrekkelijk zijn in een kleurstaal, maar op een echte knop onvoldoende contrast bieden.

Een contrastcontrole zoals die van WebAIM helpt om de combinatie van tekst en achtergrond te beoordelen. Gebruik de voorvertoning als laatste controle, want de omliggende interface beïnvloedt ook hoe een kleur overkomt.

Kleuren die bijna altijd werken: diepblauw, dieppaars, antraciet, donker petrol en diep bordeaux. Kleuren die vaak mislukken: lichte pasteltinten, middengrijs, middelgeel en neon.

Weergavenaam

De weergavenaam staat op het merkdashboard, in webmail en op ondersteunde e-mailvlakken. Drie goede patronen:

• 'JouwMerk E-mail': maakt duidelijk dat dit de e-maildienst is. Professioneel en geschikt voor resellers.
• 'JouwMerk': alleen de merknaam. Rustiger en geschikt als e-mail deel uitmaakt van een groter productaanbod.
• 'JouwMerk Dashboard': benadrukt het oppervlak. Handig om meerdere merkproducten duidelijk te benoemen.

Houd hem kort genoeg om in één oogopslag te herkennen. Controleer de voorvertoning op een smal scherm en in beide thema's in plaats van op een tekenlimiet te vertrouwen.

De weergavenaam verschijnt in:

• Navigatie van dashboard en webmail
• Merkaanmelding en browsertitels
• Ondersteunde transactionele e-mailvlakken

Voor het opslaan

Controleer voordat je op Save changes klikt of bestanden kleiner zijn dan 1 MB, beide logo's leesbaar zijn in hun voorvertoning, de favicon een eenvoudig vierkant pictogram is, de primaire kleur leesbaar contrast biedt en de weergavenaam natuurlijk klinkt als afzendernaam.

Open na het opslaan de actieve merkhost in een privévenster. Zo verwar je een gecachte afbeelding of favicon niet met de huidige versie.

Eenvoudige workflow voor voorbereiding

1. Begin met de oorspronkelijke logobestanden, niet met een schermafbeelding of bestand dat van een website is gekopieerd.
2. Exporteer een versie voor lichte en een voor donkere achtergronden.
3. Maak een afzonderlijke vierkante favicon van het herkenbaarste deel van het merk.
4. Voeg merknaam en kleuren toe in Branding en vergelijk de e-mail- en webmailvoorvertoning.
5. Sla op, test de actieve host op telefoon en desktopbrowser en bewaar de bronbestanden waar je team ze later kan bijwerken.

Later bijwerken

Je kunt merkmateriaal later wijzigen zonder het DNS-record van een bestaande merkhost te vervangen. Controleer de actieve host na elke visuele wijziging opnieuw.

Als je het verkeerde bestand uploadt of een onleesbare kleur kiest, corrigeer dit in Branding en sla opnieuw op. Houd bij de controle rekening met normale browsercaching.

Automatiseren met API en MCP

Als je integratie de vereiste machtigingen heeft, kan de REST API of MCP merkinstellingen en materiaal beheren. Dezelfde bestandstypen en limiet van 1 MB gelden. Gebruik het dashboard en de voorvertoning voor de laatste visuele controle.

Bekijk de White Label Branding API- en MCP-handleiding voor ondersteunde bewerkingen.

Veelvoorkomende situaties

'Mijn logo ziet er goed uit in de zijbalk, maar is wazig op mijn telefoon.' Upload een duidelijkere bron met hogere resolutie, sla hem op en test de actieve merkhost op de telefoon. Vertrouw niet alleen op een desktopvoorvertoning.

'Mijn primaire kleur werkt op het dashboard, maar de knoptekst is moeilijk leesbaar.' Kies een donkerdere of meer verzadigde tint en controleer die in de voorvertoning en op de actieve host.

'Mijn logo heeft een gekleurde achtergrond die niet bij het dashboard past.' Exporteer waar mogelijk een transparante PNG-versie. Vergelijk lichte en donkere versies op de bedoelde achtergronden.

'Kan ik een ander logo gebruiken in e-mail dan op het dashboard?' Gebruik de lichte en donkere varianten van Branding. Test de ondersteunde e-mailvoorvertoning en actieve klantvlakken voordat je een uiterlijk toezegt.

'Hoe zit het met donkere modus?' Het dashboard ondersteunt lichte en donkere thema's en je uploadt voor elk een afzonderlijk logo. Het lichte logo verschijnt op lichte achtergronden en het donkere op donkere, zodat je donkere inkt op licht en een wit of licht logo op donker kunt gebruiken.

'Kan ik een favicon los van het logo uploaden?' Ja. De favicon heeft een eigen upload (PNG, JPG of ICO, maximaal 1 MB) en wordt niet uit het logo afgeleid. Upload een eenvoudig, onderscheidend pictogram voor het browsertabblad.

Volgende stappen

• White Label Lite instellen: activering en DNS-instellingen.
• Wat het TrekMail-merk behoudt: wat klanten mogelijk nog van TrekMail zien.
• Veelgestelde vragen over White Label Lite-prijzen: vragen over facturatie en valuta.
• White Label Branding API- en MCP-handleiding: upload logo's en stel het merk in via REST of MCP.