Prikazovanje e-mailov v različnih e-mail klientih običajno vedno prinaša težave. Ena takšnih težav je tudi nepravilno prikazovanje slik e-mailov v Outlooku. Razlog zato tiči v »umetnem« povečevanjem elementov, ki se nastavi skozi nastavitve Windows.
T.i. »DPI Scaling« v Outlooku 2007-2013 je glavni krivec za nepravilno prikazovanje slik v e-mail sporočilih. Običajno takšnih napak ne opazimo, če sami nimamo ustreznih nastavitev, ampak se z njimi srečamo, ko prejmemo »screenshote« nepravilnega prikazovanja. V praksi se napaka kaže v obliki praznih prostorov na desni ali levi strani slik.
Outlookovo delovanje na e-mail
Vsakič, ko odpremo e-mail v Outlooku, se vsebina prikaže s pomočjo motorja za renderiranje. To pa je osnova naših težav, namreč umetna povečava naredi naslednje:
- Vse širine in višine definirane s pomočjo HRML atributov se ohranijo, kot PX vrednosti.
- Vse dimenzije VML oblik se ohranijo v PX vrednostih.
- Vse ostale vrednosti se pretvorijo v PT vrednosti.
- DPI povečevanje, ki se vklopiv Windowsih se nanaša na vse PT vrednosti. V praksi to pomeni, da se 10PT enot pri 150% povečanju spremeni v 15PT.
Zaradi tega se spremenijo velikosti fontov, odmikov, … ker pa tabele in slike uporabljajo PX enote se te vrednosti ne spremenijo.
Rešitev za Outlook povečevanje slik
Vsem tabelam oz. njenim celicam v e-mailu določimo »inline« stile v katerih dorečemo višine in širine.
<!-- Wrapper table is percent width, no inline style needed -->
<table width="100%" cellspacing="0" cellpadding="0" border="0">
<tr>
<td align="center">
<table cellspacing="0" cellpadding="0" border="0" align="center">
<tr>
<td height="200" align="center" style="width: 600px; height: 200px;">
<!-- Use inline styles for pixel widths and heights -->
<!-- Still need height attribute for Gmail -->
</td>
</tr>
</table>
</td>
</tr>
</table>
Za ustrezno VML prikazovanje potrebujemo še naslednjo kodo v glavi.
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:v="urn:schemas-microsoft-com:vml"
xmlns:o="urn:schemas-microsoft-com:office:office">
<head>
<!--[if gte mso 9]><xml>
<o:OfficeDocumentSettings>
<o:AllowPNG/>
<o:PixelsPerInch>96</o:PixelsPerInch>
</o:OfficeDocumentSettings>
</xml><![endif]-->
</head>
Za ustrezno »cellspacing« in »cellpadding« dodamo naslednje mso stile.
<table cellspacing="5" cellpadding="10" border="0" style="mso-cellspacing: 5px; mso-padding-alt: 10px 10px 10px 10px">
...
</table>
Pred uporabo vedno naredite ustrezne teste.
Vir: https://litmus.com/community/discussions/151-mystery-solved-dpi-scaling-in-outlook-2007-2013