Signature e-mail – image SVG et affichage sur mobile

Résolu/Fermé
Jimm15300 Messages postés 274 Date d'inscription samedi 27 janvier 2007 Statut Membre Dernière intervention 21 avril 2021 - 31 janv. 2020 à 00:46
Jimm15300 Messages postés 274 Date d'inscription samedi 27 janvier 2007 Statut Membre Dernière intervention 21 avril 2021 - 31 janv. 2020 à 14:11
Bonjour,


J’ai créé une signature pour mes e-mails professionnels avec une image au format SVG :


<html>
<body>
<div style="min-height: 60px; line-height: 17px; margin: 0; padding: 10px 0; font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif; font-size: 11px; color: #3a342c; min-width: 530px;"


id="sig"> <img src="https://sendeyo.com/up/d/471cea7f04" style="float: left; padding: 0 10px 0 0;"


height="102" width="200"> <strong style="color: #3a342c; font-size:12px;">Jimmy
D.</strong><br>
<span style="font-size: 12px; color: #666666;">Assistant de gestion
locative</span><br>
Adresse<br>
Tél. 01 XX XX XX XX <br>
<a href="mailto:etudecouderc@gmail.com" style="color: #403120; text-decoration: none">xxx@xxx.com</a><br>
<a href="http://www.etudecouderc.com" style="color:#0095a2; text-decoration:none;">www.xxx.com</a>
</div>
</body>
</html>



J’ai deux problèmes :
le logo ne s’affiche pas sur certains clients de messagerie (notamment Gmail) ;
l’alignement n’est pas conservé lorsqu’on ouvre les e-mails sur mobile (cf. photo ci-dessous).

Pouvez-vous m’aider, s’il vous plaît ?

Cordialement,
Jimmy

https://forums.cnetfrance.fr/filedata/fetch?id=6490991
A voir également:

3 réponses

jordane45 Messages postés 38137 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 17 avril 2024 4 649
31 janv. 2020 à 10:24
Bonjour,

Certains clients de messagerie ne chargent pas les images qui sont mises en "lien".
Déjà, tu pourrais commencer à intégrer directement l'image au contenu du mail en l'encodant en base 64.

Idem pour certains styles qui ne sont pas interprétés.
Chaque navigateur internet peut avoir des comportements différents lorsqu'il s'agit de style (css) et du code html.
Chaque "logiciel" de messagerie peut également avoir un comportement différent.

Certains peuvent tout simplement ignorer les styles et/ou les liens....
Cela peut venir de leur paramétrage et/ou de leur fonctionnement ... et dans ces cas la, tu ne pourras malheureusement pas y faire grand chose.






0
[Dal] Messages postés 6174 Date d'inscription mercredi 15 septembre 2004 Statut Contributeur Dernière intervention 2 février 2024 1 083
31 janv. 2020 à 10:25
Salut Jimm15300,

1.

Pour ton image, certains clients de messagerie n'affichent pas les images externes pour des raisons de sécurité. Si tu veux maximiser les chances que ton image s'affiche partout, tu dois l'inclure dans ton e-mail.

Je te suggère aussi de ne pas utiliser d'image .svg, mais une image .png ou .jpeg, qui sont des formats d'images plus communément supportés.

Pour embarquer l'image dans ton .html, tu peux encoder le contenu du fichier en base64, et l'inclure en ligne dans le tag
<img>
.

Tu as un outil d'encodage et des explications là : https://www.base64-image.de/tutorial

Cela va augmenter la taille de tes e-mails, mais au moins l'image devrait s'afficher sur un maximum de clients.

2.

Pour le problème d'alignement, je comprends que tu veux que le logo soit à gauche et les informations de contact à droite. Le plus simple est de les mettre dans un tableau html à une ligne et deux colonnes.

<table border="0">
  <tr>
    <td>logo</td>
    <td>infos<br>de<br>contact</td>
  </tr>
</table>


Tu peux aussi faire avec des div et css, mais à mon sens cela complique les choses dans ton cas très simple.

Dal
0
Jimm15300 Messages postés 274 Date d'inscription samedi 27 janvier 2007 Statut Membre Dernière intervention 21 avril 2021 15
31 janv. 2020 à 12:23
Bonjour,

Merci beaucoup pour vos éclaircissements.

J’ai donc modifié le code en conséquence et j’ai converti mon image .svg en .bmp car dans les autres formats (.png et .jpeg) la qualité n’était pas bonne.

J’ai maintenant un nouveau problème : le fond de l’image appraît en noir sur certains clients (notamment Gmail). Est-ce un problème de transparence ? Comment corriger ce problème ?

Cordialement,
Jimmy
0
[Dal] Messages postés 6174 Date d'inscription mercredi 15 septembre 2004 Statut Contributeur Dernière intervention 2 février 2024 1 083
Modifié le 31 janv. 2020 à 12:31
S'il y a de la transparence, c'est le format .png que tu dois utiliser. Le format .bmp ne gère pas la transparence (et .jpeg non plus).

Le format .png est un format d'images avec compression mais sans perte (contrairement à .jpeg, qui est avec perte). Si ton image n'a pas l'air jolie en .png c'est lié à autre chose.

Pour travailler avec .svg et exporter dans différents formats dans la résolution que je souhaite, j'utilise habituellement Inkscape. C'est un logiciel libre et gratuit.
0
Jimm15300 Messages postés 274 Date d'inscription samedi 27 janvier 2007 Statut Membre Dernière intervention 21 avril 2021 15 > [Dal] Messages postés 6174 Date d'inscription mercredi 15 septembre 2004 Statut Contributeur Dernière intervention 2 février 2024
31 janv. 2020 à 14:11
Bonjour,

J'ai pu faire la conversion en .png avec une bonne qualité finalement !

Merci beaucoup :)
0