Modaliteti i errët u lançua vetëm disa vjet më parë dhe adoptimi vazhdon të rritet. Modaliteti i errët tani është i disponueshëm në të gjithë macOS, iOS dhe Android si dhe një mori aplikacionesh duke përfshirë Microsoft Outlook, Safari, Reddit, Twitter, Youtube, Gmail dhe Reddit. Megjithatë, nuk ka gjithmonë mbështetje të plotë në secilin.
Modaliteti i errët zvogëlon përdorimin e energjisë së ekranit dhe rrit fokusin. Disa përdorues gjithashtu deklarojnë se ndiejnë një zvogëlim të lodhjes së syve, por kjo është janë pyetur.
Kohët e fundit, ne zhvilluam një model Marketing Cloud që përfshinte Modalitetin e Errët në kodin e tij që i bën sektorët e postës elektronike të kontrastohen në mënyrë dramatike kur shikohen në një klient email. Anshtë një përpjekje që mund të shkaktojë norma shtesë të angazhimit dhe klikimeve për pajtimtarët tuaj.
Jo shpesh ka përparime në teknologjinë e postës elektronike, kështu që është mirë të shohësh miratimin e kësaj përvoje në të gjithë industrinë. Kuptimi i praktikave më të mira, kodi për t'u zbatuar, si dhe mbështetja e klientit është thelbësore për suksesin tuaj të zbatimit të modalitetit të errët. Për atë arsye, ekipi në Uplers publikoi këtë udhëzues për modaliteti i errët mbështetje email.
Kodi i postës elektronike të modalitetit të errët
Hapi 1: Përfshini meta të dhënat për të mundësuar modalitetin e errët në klientët e postës elektronike - Hapi i parë është të aktivizoni modalitetin e errët në postën elektronike për abonentët që kanë të aktivizuar cilësimet e modalitetit të errët. Ju mund ta bëni këtë duke përfshirë këtë metadata në etiketë
<meta name="color-scheme" content="light dark">
<meta name="supported-color-schemes" content="light dark">
Hapi 2: Përfshini stilet e modalitetit të errët për @media (skema e ngjyrave të preferuara: e errët) - Shkruani këtë pyetje mediatike në tuajin e ngulitur tags to customize the dark mode styles in Apple Mail, iOS, Outlook.
com, Outlook 2019 (macOS) dhe App Outlook (iOS). Nëse nuk doni një logo të përshkruar në emailin tuaj, mund të përdorni klasat .dark-img dhe .light-img siç tregohet më poshtë.
@media (prefers-color-scheme: dark ) {
.dark-mode-image { display:block !important; width: auto !important; overflow: visible !important; float: none !important; max-height:inherit !important; max-width:inherit !important; line-height: auto !important; margin-top:0px !important; visibility:inherit !important; }
.light-mode-image { display:none; display:none !important; }
}
Hapi 3: Përdorni prefiksin [data-ogsc] për të kopjuar stilet e modalitetit të errët - Përfshini këto kode që email-i të jetë i pajtueshëm me modalitetin e errët në aplikacionin Outlook për Android.
[data-ogsc] .light-mode-image { display:none; display:none !important; }
[data-ogsc] .dark-mode-image { display:block !important; width: auto !important; overflow: visible !important; float: none !important; max-height:inherit !important; max-width:inherit !important; line-height: auto !important; margin-top:0px !important; visibility:inherit !important; }
Hapi 3: Përfshini stilet vetëm në modë të errët në HTML të trupit - Etiketat tuaja HTML duhet të kenë klasat e sakta të modalitetit të errët.
<!-- Logo Section -->
<a href="http://email-uplers.com/" target="_blank" style="text-decoration: none;"><img src="https://campaigns.uplers.com/_email/_global/images/logo_icon-name-black.png" width="170" alt="Uplers" style="color: #333333; font-family:Arial, sans-serif; text-align:center; font-weight:bold; font-size:40px; line-height:45px; text-decoration: none;" border="0" class="light-mode-image"/>
<!-- This is the hidden Logo for dark mode with MSO conditional/Ghost Code --> <!--[if !mso]><! --><div class="dark-mode-image" style="display:none; overflow:hidden; float:left; width:0px; max-height:0px; max-width:0px; line-height:0px; visibility:hidden;" align="center"><img src="https://campaigns.uplers.com/_email/_global/images/logo_icon-name-white.png" width="170" alt="Uplers" style="color: #f1f1f1; font-family:Arial, sans-serif; text-align:center; font-weight:bold; font-size:40px; line-height:45px; text-decoration: none;" border="0" />
</div><!--<![endif]-->
</a>
<!-- //Logo Section -->
Këshilla për modalitetin e errët dhe burimet shtesë të postës elektronike
Unë kam qenë duke punuar në Martech Zone gazetat ditore dhe javore për të mbështetur modalitetin e errët, sigurohuni që regjistrohuni këtu. Ashtu si me shumicën e kodimit të postës elektronike, nuk është një proces i thjeshtë për shkak të klientëve të ndryshëm të postës elektronike dhe metodologjive të tyre të kodimit të pronarit. Një çështje që hasa ishin përjashtimet… për shembull, ju doni tekst të bardhë në një buton, pavarësisht nga modaliteti i errët. Sasia e kodit është paksa qesharake… Duhej të kisha përjashtimet e mëposhtme:
@media (prefers-color-scheme: dark ) {
.dark-mode-button {
color: #ffffff !important;
}
}
[data-ogsc] .dark-mode-button { color: #ffffff; color: #ffffff !important; }
Disa burime shtesë:
- Lakmus - udhëzuesi përfundimtar për modalitetin e errët për tregtarët e postës elektronike.
- CampaignMonitor - udhëzuesit e zhvilluesve për modalitetin e errët për email.
Shikoni Infographic Interactive të Uplers