088 - 120 34 00
Hét Online Marketing Bureau uit Arnhem

Hotmail speelt eigen rechter

Al eerder vorige week kwam naar buiten dat Hotmail ineens de speciale tekens voor bijvoorbeeld ©, ® en ™ vervangt door veel grotere afbeeldingen, met alle gevolgen voor het design van je e-mail van dien. Nu kwam ik net via de blog van Campaign Monitor ook nog te weten dat Hotmail tegenwoordig ‘mailto:’-linkjes ook blokkeert. Zo houden ze ons e-mail marketeers in elk geval van de straat.

Wat gebeurt er met deze speciale tekens?

image: voorbeeld Hotmail speelt eigen rechter Hotmail vervangt dus de speciale tekens door veel grotere iconen. Persoonlijk ben ik nog steeds aan het bedenken waarom dit voor Hotmail nou een handige stap is, maar ik ben nog niet tot de conclusie gekomen. Sterker nog, als je afbeeldingen in je design hebt staan die je het CSS-stijlattribuut ‘display:block;’ hebt gegeven, wordt het icoon ook nog eens op een eigen regel geplaatst doordat er direct na het symbool een witregel wordt geladen (Zie afbeelding).

Wat kan je eraan doen?

Oplossing hiervoor zijn inmiddels door diverse partijen alweer bedacht, gelukkig. Zo worden de iconen in Hotmail vervangen door een afbeelding die een class toegewezen heeft die altijd begint met het woord ‘Emoji’. Daarop is dus in je CSS codes een regel te maken die dit afvangt. De volgende regel zou een goede oplossing kunnen zijn:

.ExternalClass img[class^=Emoji] { width: 10px !important; height: 10px !important; display: inline !important; }

Door deze code in te voegen in je CSS-gedeelte worden alle afbeeldingen die een class toegewezen hebben gekregen beginnend met het woord ‘Emoji’ bijgeschaald naar 10 bij 10 pixels. Hierdoor past het teken in elk geval weer op de regel. Door daarnaast de eerder genoemde ‘display:block;’ van je afbeelding om te zetten naar ‘display: inline;’ voor dit specifieke geval wordt ook de witregel niet meer ingevoegd. Door dit als een ExternalClass in te voegen zorg je er tevens voor dat Hotmail zelf geen aanpassingen kan maken aan deze regel. Deze regel werkt prima voor het copyright symbool. Echter heb je natuurlijk ook symbolen zoals de ™ die kleiner zijn, en bovenin uitgelijnd zijn achter de tekst. Om dit ook te kunnen maken kan je de volgende code gebruiken.

.ExternalClass img[class^=Emoji] { width: 8px !important; height: 8px !important; vertical-align: super; display: inline !important; }

Een andere oplossing zou kunnen zijn dat je zelf eigen afbeeldingen gaat gebruiken in je e-mails. Dan heb je alles natuurlijk helemaal zelf in de hand.

Hotmail blokkeert ook ‘mailto:’- links

Wat ook genoemd wordt in die blog is dat Hotmail de ‘mailto:’-links blokkeert. Ze blijven wel gewoon in je code staan, maar werken simpelweg niet meer. Als je erop klikt gebeurt er niets meer. Het is dus beter om voortaan te linken naar een contactformulier in plaats van deze ‘mailto:’-links te gebruiken. Naast het feit dat deze links dan ook vanuit Hotmail weer werken is het bovendien mogelijk om clicks uit je e-mail naar deze contactpagina te tracken, en ‘mailto’-links zijn dus niet meetbaar.

2 reacties

Navin Poeran

Zoveel moeite om iets ‘werkend’ te krijgen in Hotmail, terwijl je toch liever GMail kunt gebruiken?

Ik snap eerlijk gezegd niet dat Hotmail nog populair is bij online marketing mensen :s

van Dijk

Hoi Navin,

Het gaat in dit artikel niet om het eigen gebruik van Hotmail als mailclient, maar worden er tips gegeven om je verstuurde (campaign) e-mail berichten er goed uit te laten zien in Hotmail.

Geef een reactie