Signature mail en HTML

[Lyaume]

Bonjour,

 

Dans un cadre professionnel, j'utilise Thunderbird pour consulter et envoyer mes mails.

J'ai donc une signature en fin de mail permettant de m'identifier et de donner les informations de contact.

 

J'ai créé un petit bout de code en html que j'importe depuis Thunderbird. Mais, étant novice en la matière, je souhaite avoir une expertise sur ce sujet pour faire quelque chose de propre (et professionnel).

 

L'idée, c'est d'avoir le logo de l'entreprise à gauche et les coordonnées à droite.

Voici ce que j'ai :

<table border="0" cellpadding="2" cellspacing="2" height="110" width="300">	<tbody>		<tr>			<td valign="top">				<p>					<span style="font-family:tahoma,geneva,sans-serif; font-size:11px;">						<img alt="Logo societe" src="http://www.siteweb.com/uploads/LOGO.png">					</span>				</p>			</td>			<td valign="top">				<p>					<span style="font-family:tahoma,geneva,sans-serif; font-size:11px;">						<span style="color:#808080;">Prenom Nom</span><br> 						<span style="color:#808080; font-size:9px">Ingénieur EPF</span><br>						<span style="color: rgb(255, 140, 0);"> <strong>NomSociete</strong></span><br>						<span style="color:#808080;"> 							T. : +334.00.00.00.00<br>							M. : +4179.000.00.00						</span><br>						<a href="mailto:prenom.nom@siteweb.com">prenom.nom@siteweb.com</a><br>						<a href="http://www.siteweb.com">www.siteweb.com</a>					</span>				</p>			</td>		</tr>	</tbody></table>

C'est peut être très moche pour vous au niveau du code, mais ça fonctionne.

Est-ce que je peux améliorer le bouzin? Si oui, comment?

 

Enfin, je joins le logo de la société dans la signature, mais il doit aller le récupérer sur le site. Est-ce la bonne méthode? Ou est-il préférable de joindre le logo au mail pour qu'il n'est pas besoin d'aller le récupérer?

 

Je vous remercie pour votre aide.

[Aloyse57]

Le problème avec les images intégrées aux emails, c'est qu'il faut les insérer en pièces jointes d'une façon particulière.

Et certains programmes les affichent du coup en pièces jointes, plutôt qu'en signature.

 

Cherchez de l'aide avec ces mots-clés : images email html cid

 

Je génère des emails en HTML avec des images pour faire du mass-mailing (en usage interne->1000 employés).

Du coup je sais que selon l'appareil, ça ne donne pas toujours le résultat escompté (Taux de réussite=98% sur les 1000, c'est potable quand même)

Outlook est très permissif, mais tout le monde n'utilise pas Outlook.

[Lyaume]

Ok, merci pour ce partage d'expérience.

Pour le moment, je pense que ma solution implantée convient mieux. Sous Thunderbird, je reçois des mails avec un lien pour un logo, et il le met en tant que pièce jointe, donc pas top. La mise en page devient vraiment horrible dans ces cas la.

 

Et concernant le code html, quelque chose à redire la dessus?

[maximeK]

Le 20/07/2016 à 14:55, Lyaume a dit :

Ok, merci pour ce partage d'expérience.

Pour le moment, je pense que ma solution implantée convient mieux. Sous Thunderbird, je reçois des mails avec un lien pour un logo, et il le met en tant que pièce jointe, donc pas top. La mise en page devient vraiment horrible dans ces cas la.

 

Et concernant le code html, quelque chose à redire la dessus?

L'élément table n'a pas d'attribut height.

Je pense que ton P pour ton image n'est pas nécessaire.

En revanche pour le 2eme TR la oui mais pas de span dans un span, voici la version  

<table border="0" cellpadding="2" cellspacing="2" width="300">	
	<tbody>		
		<tr>			
          <td valign="top">								
              <span style="font-family:tahoma,geneva,sans-serif; font-size:11px;">
                  <img alt="Logo societe" src="http://www.siteweb.com/uploads/LOGO.png">
              </span>				
          </td>
          <td valign="top">
              <p style="font-family:tahoma,geneva,sans-serif; font-size:11px;">>					
                  <span style="color:#808080;">Prenom Nom</span><br>
                  <span style="color:#808080; font-size:9px">Ingénieur EPF</span><br>
                  <span style="color: rgb(255, 140, 0);"> <strong>NomSociete</strong></span><br>
                  <span style="color:#808080;">
                      T. : +334.00.00.00.00<br>							
                      M. : +4179.000.00.00
                  </span><br>	
                  <a href="mailto:prenom.nom@siteweb.com">prenom.nom@siteweb.com</a><br>
                  <a href="http://www.siteweb.com">www.siteweb.com</a>
              </p>
          </td>
		</tr>
	</tbody>
</table>

 

[BreizFenrir]

Une possibilité pour le logo (du moment qu'il n'est pas de trop grande taille) est de l'intégrer directement au corps de la signature en l'encodant en Base64. Il s'agit d'encoder l'image d'origine dans un format texte, placé via un format spécifique dans l'attribut "src" de la balise <img>. Pour convertir une image, il y a par exemple le service en ligne http://dataurl.net/#dataurlmaker. Pour plus de détail, le site d'Alsacreation a un article dessus : http://www.alsacreations.com/article/lire/1439-data-uri-schema.html.

Par contre, il faudra vérifier que ça fonctionne bien avec tous les logiciels de messagerie cible. Je pense que ça ne pose pas de problème, mais je me rappelle de la grogne parmis certains développeurs web quand Microsoft a changé le moteur de rendu utilisé par Outlook de celui d'Internet Explorer à celui de Word (oui oui, les deux avaient -- j'ose espérer que ça n'est plus le cas -- des moteurs de rendu différents, et celui de Word était bien moins évolué).

Aussi, dans la seconde cellule de ton tableau, je pense qu'il est plus correcte d'utiliser la balise <address> plutôt que <p> ; mais il y a des chances que ça ne change rien du point de vue de l'affichage ou de ce que les logiciels de messagerie des destinataires peuvent en faire.

Après, je suis aussi curieux de savoir si certains logiciels de messagerie comprennent le microformat hCard (http://microformats.org/wiki/hcard-fr). Si oui, ça peut être intéressant de se pencher dessus car ça permettrait aux destinataires des courriels de facilement ajouter le profil avec l'ensemble des informations contenues dans la signature dans leur carnet d'adresses. Mais pour être honnête, je serai surpris si c'est bien pris en charge.

[Lyaume]

Merci pour vos réponses.

Et désolé pour la réponse tardive, quelques petits soucis avec le nouveau forum m'ont retardé.

Concernant le nouveau code, je vais essayer et vous faire un retour. Merci pour l'aide.

Pareil pour les images, il faut que je fasse le test et je vous dit aussi. La méthode semble intéressante mais compliquée à mettre en place cependant. Si j'ai un moment, je vais tester.

[RaphAstronome]

Concernant les signatures dans tes mails il est fondamental de rester extrêmement léger, moins de 10ko. Pour la compression d'un logo le gif sans antialias est pas mal, essaie le png aussi. Le format jpg est prévu pour les photo et sera vraiment dégueux sur un logo pour une compression pas forcément meilleure.

Pour ma part je préfères les mails en texte brut. Ne pas oublier que les mails sont de plus en plus lus sur un téléphone portable donc connexion souvent <128 kbps voire moins et dans tous les cas mauvaise latence. De plus le texte brut à l'assurance d'être lisible sur tous les écrans même très petits, ce n'est clairement pas le cas des messages HTML surtout un peu complexes avec des tables.