2012-04-05 3 views
0

Lorsque j'inclure le code HTML suivant dans un e-mail, l'image est automatiquement téléchargée par Outlook:image liée en HTML ne télécharge pas dans Outlook 2010

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head></head><body><div><p><br /></p></div><div style="border-style:solid;border-width:2px;border-color:rgb(0,0,0);background-color:rgb(255,232,0);width:302px;height:185px"><img style="position:relative;z-index:100;left:126px; top:39px;" src="https://s3.amazonaws.com/signoffmainbucket/8CA8EC1A-C1C5-4390-9FC4-649648AA26C8.jpg" alt="image"/><p style="opacity:1.00;color:rgb(0,0,0);position:relative;margin: -123px 0px 0px 18px;font-family: Helvetica, Helvetica;font-size:14px"><b>John</b></p><br /><br /><br /><br /><p style="opacity:1.00;color:rgb(0,0,0);position:relative;margin: 0px 0px 0px 18px;font-family: Helvetica, Helvetica;font-size:14px"><b>XYZ Company</b></p><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /></div></body></html> 

Cependant, la même image dans le code HTML suivant est pas automatiquement téléchargé par Outlook:

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="UTF-8" /> 
    <title>Render this</title> 
    <style type="text/css"> 
     div, p { 
      margin:0; 
      padding:0; 
      font-family: Helvetica; 
      font-size:14px; 
      color:#000; 
      font-weight:bold; 
     } 
     div.box { 
      padding:15px; 
      width:272px; 
      height:155px; 
      border:2px solid #000; 
      background-color:rgb(255,232,0); 
     } 
     div.box div.inner { 
      height:100%; 
      background:url("https://s3.amazonaws.com/signoffmainbucket/8CA8EC1A-C1C5-4390-9FC4-649648AA26C8.jpg") bottom right no-repeat; 
     } 
     p.name { 
      margin-bottom:65px; 
     } 
    </style> 
</head> 
<body> 
    <div class="box"> 
     <div class="inner"> 
      <p class="name">John</p> 
      <p>XYZ Company</p> 
     </div> 
    </div> 
</body> 
</html> 

Pourquoi l'image serait-elle téléchargée dans le premier exemple mais pas dans la seconde?

Répondre

0

C'est parce que la création de courriels HTML sucent. Outlook, depuis 2007 je crois, est passé de l'utilisation du moteur de rendu d'Internet Explorer à l'utilisation d'un moteur de rendu HTML basé sur Word. Cela rend le support CSS extrêmement limité. Votre meilleur espoir pour faire un e-mail HTML sans perdre la tête est d'utiliser des tables pour structurer votre contenu et utiliser les styles en ligne directement sur les éléments. Oui, pour atteindre l'audience la plus large possible avec des e-mails HTML, vous devez coder comme en 1997.

2

Les clients de messagerie ne fournissent pas un support CSS complet. These tables montrer quel cauchemar c'est ... Selon eux, Outlook 2000-2003 a supporté background-image, mais il a été abandonné dans Outlook 2007 et 2010.

0

Outlook 2007 et 2010 ne prennent pas en charge les images d'arrière-plan, car votre navigateur Web dans ces applications n'est pas IE. C'est Microsoft Word. Vous devez utiliser VML pour configurer les images de fond (je sais, j'ai dû le faire).

Voici une page sur le hack VML.

http://www.campaignmonitor.com/blog/post/3363/updated-applying-a-background-image-to-html-email/

Vous pouvez également vous abonner à un bulletin d'information à MSNBC et voir comment il est fait dans leur en-tête de bulletin (mon travail manuel).

Questions connexes