Få vist og optimeret, hvordan dine e-mail-designs ser ud i mørk tilstand

Mange e-mailklienter har en indstilling for mørk tilstand, hvilket kan lead til uoverensstemmelser med, hvordan dine marketing-e-mails vises i klienter med et lysere udseende aktiveret.

Slå preview i mørk tilstand til i e-mail-editoren

Sådan skifter du til en forhåndsvisning i mørk tilstand af din e-mail, mens du designer den:

• Klik på navnet på et udkast til en e-mail.
• Klik på Visningsindstillinger øverst i e-mail-editoren, og slå derefter forhåndsvisning i mørk tilstand til.

Forhåndsvisning af din e-mails udseende i specifikke klienters mørke tilstande

For at se, hvordan din e-mail vil se ud, når en kontakt åbner den i en browser eller klient med mørk tilstand aktiveret:

• Klik på navnet på en eksisterende udarbejdet e-mail.
• Klik på Forhåndsvisning øverst til højre i e-mail-editoren, og klik derefter på Forhåndsvisning af indbakke.
• Klik på Klienter i toppen af eksempelskærmen.
• Under Mørk tilstand skaldu markere afkrydsningsfeltet ud for den klient, du vil se en forhåndsvisning af.

• Klik på Test min e-mail nu øverst til højre.

Bedste praksis, når du designer e-mails til mørk tilstand

Når du forhåndsviser din e-mail med forskellige klienter i mørk tilstand, skal du huske på, at hver klient kan gengive din e-mail forskelligt. Hvis dine kontakter f.eks. åbner din e-mail med Apple Mail, vil den se nøjagtig ens ud, uanset om de har aktiveret dark mode eller ej. Men hvis en kontakt aktiverer mørk tilstand i apps som Gmail eller Outlook på Windows, kan du opleve mere drastiske forskelle i din e-mailstyling, f.eks. inverterede baggrundsfarver.

Se nedenstående tips for at sikre, at din e-mail-styling er konsistent mellem klienterne.

Brug billeder, der vises tydeligt på både lyse og mørke baggrunde

Konverter dine billeder til PNG-filer, før du uploader og tilføjer billeder til dine e-mails, hvilket er med til at sikre, at de gengives i e-mailklienter, der automatisk inverterer baggrundsfarven på e-mails i mørk tilstand. Hvis dit billede indeholder tekst, f.eks. et logo, kan du også tilføje en gennemskinnelig kontur omkring teksten for at få den til at skille sig ud.

Vælg webtilgængelige farver

Det er vigtigt at designe dit e-mailindhold, så det er tilgængeligt, uanset hvilken e-mailklient modtageren bruger. Hvis du overholder tilgængelighedsstandarderne, f.eks. ved at kontrollere farvekontrasten i din tekst, vil det også hjælpe dine e-mails med at blive gengivet korrekt i mørk tilstand. Læs mere om webtilgængelige farver på HubSpot-bloggen.

Angiv en medieforespørgsel til styling i mørk tilstand i iOS

Flere e-mailklienter, herunder Apple Mail og Outlook.com, tilbyder begrænset støtte til at registrere og tilføje tilpasset styling via en medieforespørgsel. Hvis du bruger den opdaterede klassiske e-mail-editor, og du har udviklerressourcer til at foretage CSS-ændringer i dine e-mails, kan du tilføje en medieforespørgsel med funktionen prefers-color-scheme media for at konfigurere, hvordan billeder og tekst skal se ud i mørk tilstand og lys tilstand