Outlook 2010 enthält kein Style-Tag in Signatur

Question

Ich habe Problem, HTML-Signatur-E-Mails für Outlook zu erstellen.

Ich habe ein Style-Tag vor der Unterschrift und fügen Sie Medienbreite für Responsive E-Mail.

<style type="text/css"> 
div, p, a, li, td { -webkit-text-size-adjust:none; } 

table { 
min-width:650px; 
} 

@media only screen and (max-device-width: 480px) { 
td[class=hidden-phone] { 
    width: 0px !important; 
    display: none !important; 
    overflow: hidden !important; 
    float: left !important; 
} 
td[class=description] { 
    width: 100% !important; 
} 

td[class=visible-phone] { 
    display: block !important; 
    width: auto !important; 
    height: auto !important; 
    overflow: visible !important; 
    float:none !important; 
} 
table { 
    min-width: auto !important; 
} 
} 
</style> 

<table width="100%" style="font-family:'arial';"> 
<tr> 
<td colspan="4" width="100%" style="height:10px;border-bottom:2px solid #96999e;height:0px;">&nbsp;</td> 
</tr> 
<tr> 
<td style="padding:10px;width:80px;min-width:80px;"><img src="http://urbanangles.com/fileserver/gallery/[[ID]]_original.png" /></td> 
<td class="description" valign="bottom" style="padding:10px 0 10px 10px;width:170px;color:#111;min-width:170px;line-height:11px;"> 
    <span style="font-size:11px"><strong>[[NAME]]</strong></span><br/> 
    <span style="font-size:11px;color:#007dc3;">[[TITLE]]</span><div style="margin-bottom:5px;"></div> 
    <span style="font-size:9px;">A Studio</span><br/> 
    <span style="font-size:9px;">10 Somewhere St, Suburb, STA&nbsp;1234</span><br/> 
    <span style="font-size:9px;margin-right:10px;">D&nbsp;&nbsp;</span><span style="font-size:9px;">[[DIRECT]]</span><br/> 
    <span style="font-size:9px;margin-right:10px;">P&nbsp;&nbsp;</span><span style="font-size:9px;">[[PHONE]]</span><br/> 
    <span style="font-size:9px;margin-right:9px;">M&nbsp;&nbsp;</span><span style="font-size:9px;">[[MOBILE]]</span><br/> 
    <span style="font-size:9px;margin-right:10px;">E&nbsp;&nbsp;</span><span style="font-size:9px;"><a href="mailto:[[EMAIL]]" style="color:#111;text-decoration:none;">[[EMAIL]]</a></span><div style="margin-bottom:5px;height:0px;"></div> 
    <span style="font-size:11px"><strong><a style="color:#111;text-decoration:none;" href="http://www.examples.com">www.examples.com</a></strong></span><br/> 
</td> 
<td class="hidden-phone" style="width:100%;"></td> 
<td class="hidden-phone" valign="bottom" style="padding:10px 10px 10px 0;width:360px;min-width:360px;"><span style="margin-right:15px;"><a href="http://www.facebook.com/urbanangles" style="margin-right:3px;"><img src="http://william.uadev.com.au/img/facebook.jpg" /></a>&nbsp;<a href="http://www.twitter.com/urban_angles"><img src="http://william.uadev.com.au/img/twitter.jpg" /></a></span>&nbsp;&nbsp;<a href="http://www.urbanangles.com"><img src="http://william.uadev.com.au/img/logo.jpg" /></a> </td> 
</tr> 
<!--[if !mso 9]><!--> 
<tr> 
<td colspan="1" width="100%" class="visible-phone" style="max-height:0;display:none;height:0;overflow:hidden;width:0;float:left"> 
    <span style="margin-left:10px;margin-right:25px;"> 
    <a href="http://www.facebook.com/examples" style="margin-right:5px;"><img src="http://william.uadev.com.au/img/facebook.jpg" /></a> 
    <a href="http://www.twitter.com/examples"><img src="http://william.uadev.com.au/img/twitter.jpg" /></a></span> 
</td> 
<td colspan="3" width="100%" class="visible-phone" style="max-height:0;display:none;height:0;overflow:hidden;width:0;float:left"> 
    <a href="http://www.urbanangles.com"><img src="http://william.uadev.com.au/img/logo" style="width:80%;margin-left:8px;" /></a> 
</td> 
</tr> 
<!--<![endif]--> 
<tr><td colspan="4" width="100%" style="height:10px;border-top:2px solid #96999e;"></td> </tr> 
</table> 

<p style="font-size:11px;font-family:'arial';margin:0 0 5px 0;padding:0"><i>Please consider the environment before printing this email.</i></p> 

<p style="font-size:9px;font-family:'arial';color:#999;margin:0 0 5px 0;padding:0">This email and any attachment(s) is intended only for the exclusive and confidential use of the addressee(s). If you are not the intended recipient, any use, interference with, disclosure or copying of this material is unauthorised and prohibited. If you have received this message in error, please notify the sender by return email immediately and delete the message from your computer without making any copies. [[COMPANY]] does not guarantee the integrity of any emails or attached files.</p> 

Ich habe alles funktioniert gut auf Apple Mail. Allerdings sieht Outlook mit meinem HTML nicht glücklich aus. Alle E-Mails von Outlook haben nicht das Style-Tag, das mein HTML auf dem iPhone seltsam aussehen lässt.

Meine Fragen:

1. Warum der Stil-Tag per E-Mail nicht im Preis enthalten? Von dem, was ich weiß, wird es in Outlook unterstützt. Siehe Ref here

2. Gibt es irgendwelche Arbeiten oder Korrekturen, die ich tun kann? Ich würde gerne reaktionsschnelle E-Mail-Arbeit auf dem iPhone haben und ich weiß, dass es funktioniert, wenn ich es von Apple Mail sende.

Cheers, Will

Answer 1

Wenn der Stil-Tag im Code nicht von Ihrer E-Mail wird erscheinen, könnte es sein, weil es nicht im Kopf ist. Nicht sicher, ob dies für Outlook erforderlich ist, aber dies könnte der Grund sein, warum es entfernt wird.

Answer 2

Sie sollten die HTML-E-Mail-Tabelle auschecken.

http://htmlemailboilerplate.com/

Answer 3

Die <style>-Tag wird von einigen E-Mail-Clients wie Google Mail gezupft, (vielleicht Outlook tut das gleiche?)

Stattdessen sollten Sie in-line Stile verwenden.

Von der gleichen Website zitiert Sie, Richtlinien für Arten mit: http://www.campaignmonitor.com/resources/will-it-work/guidelines/

Sie http://premailer.dialect.ca/ können Ihre signiture haben Inline-Styles, und sein freies :)

Answer 4

Sie sollten immer verwenden Inline konvertieren Stile für HTML-E-Mails, da dies die größte Kompatibilität mit verschiedenen Clients bietet. Ich weiß, dass es nicht so schön ist wie ein separater CSS-Block, aber so ist es.