Chcete mít jistotu, že vaše e-mailové kampaně budou vypadat skvěle a zůstanou čitelné bez ohledu na to, v jakém režimu si je příjemci otevřou? Čím dál tím více uživatelů dnes otevírá e-maily v tmavém režimu, což může při nesprávném návrhu způsobit zmizení loga, nečitelnost textu nebo splynutí tlačítek s pozadím. V tomto návodu vám ukážeme, jak e-mailovou šablonu v editoru Ecomail přizpůsobit tak, aby obstála při různém nastavení e-mailových aplikací.
V tomto článku najdete:
Jak funguje tmavý režim v e-mailingu
Tmavý režim (Dark mode) je styl zobrazení, který převrací barevnou škálu do tmavých odstínů, aby šetřil zrak uživatele i baterii zařízení. E-mailové aplikace však na tmavý režim nereagují jednotně. Navíc stejná aplikace se může chovat jinak na různých zařízeních.
V praxi pak může dojít k několika situacím:
Žádná změna zobrazení: E-mail zůstane v původních barvách, ztmavne pouze rozhraní aplikace.
Částečná změna: Aplikace přebarví světlé prvky na tmavé, ale tmavé barvy ponechá.
Kompletní převrácení: Aplikace přebarví světlé prvky na tmavé a naopak tmavé na světlé.
Vzhledem k těmto rozdílům je potřeba šablonu navrhnout tak, aby ustála jakoukoliv z těchto variant.
Pravidla správného návrhu šablony
Pro zajištění perfektního vzhledu vašich zpráv dodržujte při tvorbě šablony v editoru tato základní pravidla:
Barvy a kontrast
Vyhněte se extrémním barvám: Čistě bílé pozadí (hex kód barvy #FFFFFF) a čistě černý text (hex kód barvy #000000) jsou častými příčinami potíží. Místo toho zvolte pro pozadí jemně tlumenou bílou a pro text tmavě šedou.
Volte střední tóny: Syté barvy (např. výrazná oranžová nebo modrá) zůstávají dobře čitelné na světlém i tmavém pozadí. Velmi světlé pastelové odstíny naopak v tmavém režimu snadno zmizí.
Jak se v editoru barvy nastavují najdete v návodu Základní práce s interaktivním editorem šablon.
💡 TIP: Chcete si ušetřit práci s ručním nastavováním barev? Vyberte si některou z našich předpřipravených šablon v sekci Šablony, které jsou pro dark mode kompletně přizpůsobené.
Loga a obrázky
Světlý obrys nebo barevné pozadí
Pokud vložíte tmavé logo s transparentním pozadím, v tmavém režimu zcela splyne. V praxi tomu můžete předejít dvěma způsoby:
k transparentnímu tmavému logu přidejte jemný bílý obrys. Obtažení pak vynikne i na tmavém pozadí:
nebo nahrajte logo s plnou barvou pozadí. Pokud tmavému logu přidáte světlý podklad, bude viditelné vždy. Je však třeba počítat s tím, že na tmavém pozadí bude bílý čtverec či obdélník vyčnívat:
Předpřipravené verze
Pokud máte k dispozici světlou i tmavou variantu loga, uložte si do správce souborů předem obě. Budete tak mít po ruce vždy variantu, která se pro danou kampaň hodí více.
Tlačítka
Výrazná tlačítka s orámováním: Pro tlačítka s výzvou k akci (CTA) volte středně syté barvy pozadí. Výrazná oranžová nebo sytě modrá zůstane vidět na světlém i tmavém pozadí. Barvu textu volte silně kontrastně k barvě tlačítka, aby text zůstal dobře čitelný.
Zapněte si u tlačítka okraje– i kdyby e-mailový klient změnil barvu tlačítka, rámeček jej udrží viditelné.
Obrázky na pozadí
Pokud používáte obrázek na pozadí, vždy v nastavení bloku zvolte i barvu pozadí. V případě, že se obrázek nenačte nebo jej e-mailový klient potlačí, zobrazí se vybraná barva pozadí.
Kontrola šablony
Před odesláním ostré kampaně si zobrazení e-mailu důkladně prověřte přímo v aplikaci:
V editoru šablon přejděte do sekce Náhled.
Klikněte na přepínač Tmavý režim pro rychlé ověření základního vzhledu:
Klikněte na tlačítko Odeslat testovací e-mail a pošlete si zprávu na vlastní schránku.
Zkontrolujte e-mail přímo v mobilním telefonu i na počítači se zapnutým tmavým režimem.
💭 Nenašli jste odpověď?
Napište nám na chat nebo e-mail support@ecomail.cz. 😊