Newsletter mal découpée dans les clients mail

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : Newsletter mal découpée dans les clients mail

ludo2604

kitsch' me if u can

Bonjour,

J'ai effectué une newsletter html pour un futur client que je viens de terminer.
Au final, cela est parfaitement lisible dans thunderbird, sur firefox et safari.
Lorsque je fait le test sur hotmail et gmail le decoupage est un peu foireux.
Je voulais savoir qu'est ce qui ne va pas dans les webmails ?
Je n'utilise pourtant que de l'HTML.
Mon client l'a testé et pareil, des lignes découpés et des decallages d'images.

S'agit il de mon decoupage qui est foireux ? mauvaise interpretation du découpage par les clients mails ?
Je suis directeur artistique mais exceptionnellement je dois tout faire. Je n'ai pas eu de formation dédiée à la programmation c'est pour ça que je demande de l'aide.
Derniere question : les images découpées doivent elles etre envoyé avec le mail ou doivent elles etre hébérgé en ligne ?
Merci

Message édité par ludo2604 le 14-01-2008 à 15:05:02

Publicité

tpierron

Euh, t'espère sincèrement une réponse avec des éléments aussi vagues ? Ça dépend du HTML que t'envoie évidemment ...

ludo2604

kitsch' me if u can

Alors je suis parti de Photoshop CS3, puis decoupe en tranche avec image ready et un minimum d'optimisation dans Dreamweaver au niveau du background. L'html c'est du tableau tout bete avec du img bckg et img src dedans, donc tout est millimetre.

David Boring

Pas de possiblité d'image en background dans les newsletter pour commencer.
Et pour continuer, tu devrais nous donner ton code

Message cité 1 fois

ludo2604

kitsch' me if u can

David Boring a écrit :

Pas de possiblité d'image en background dans les newsletter pour commencer.
Et pour continuer, tu devrais nous donner ton code

Je ne le savais pas. Que de l'img src donc ?! c'est embettant ça
Pour le code, le voici un bout puisqu'il est assez long :

<html>
<head>
<title>realtime - decoup</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<style type="text/css">

</style>
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">

<table width="1025" height="1301" border="0" align="center" cellpadding="0" cellspacing="0" id="Tableau_01">
<tr>
<td colspan="36" background="images/img_010.gif"> </td>
<td>
<img src="images/spacer.gif" width="1" height="11" alt=""></td>
</tr>
<tr>
<td rowspan="38">
<img src="images/img_020.gif" width="100" height="1289" alt=""></td>
<td colspan="2">
<img src="images/img_03.gif" width="17" height="24" alt=""></td>
<td>
<img src="images/img_04.gif" width="9" height="24" alt=""></td>
<td colspan="16">
<img src="images/img_05.gif" width="484" height="24" alt=""></td>
<td colspan="14">
<img src="images/img_06.gif" width="278" height="24" alt=""></td>
<td rowspan="11">
<img src="images/img_070.gif" width="13" height="560" alt=""></td>
<td rowspan="38">
<img src="images/img_080.gif" width="123" height="1289" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="24" alt=""></td>
</tr>
<tr>
<td rowspan="9">
<img src="images/img_09.gif" width="16" height="509" alt=""></td>
<td colspan="2" rowspan="2">
<img src="images/img_10.gif" width="10" height="110" alt=""></td>
<td colspan="4">
<img src="images/img_11.gif" width="94" height="69" alt=""></td>
<td colspan="4">
<img src="images/img_12.gif" width="142" height="69" alt=""></td>
<td colspan="5">
<img src="images/img_13.gif" width="142" height="69" alt=""></td>
<td colspan="4">
<img src="images/img_14.gif" width="108" height="69" alt=""></td>
<td colspan="8">
<img src="images/img_15.gif" width="137" height="69" alt=""></td>
<td colspan="5">
<img src="images/img_16.gif" width="139" height="69" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="69" alt=""></td>
</tr>
<tr>
<td colspan="4">
<img src="images/img_17.gif" width="94" height="41" alt=""></td>
<td colspan="2">
<img src="images/img_18.gif" width="66" height="41" alt=""></td>
<td width="326" height="41" colspan="11" bgcolor="#FEEFE1"> </td>
<td colspan="8">
<img src="images/img_20.gif" width="137" height="41" alt=""></td>
<td colspan="5" rowspan="2">
<img src="images/img_21.gif" width="139" height="63" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="41" alt=""></td>
</tr>
<tr>
<td rowspan="2">
<img src="images/img_22.gif" width="1" height="30" alt=""></td>
<td rowspan="2">
<img src="images/img_23.gif" width="9" height="30" alt=""></td>
<td width="623" colspan="25" rowspan="2" background="images/img_240.gif">
<img src="images/img_240.gif" height="30" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="22" alt=""></td>
</tr>
<tr>
<td colspan="5">
<img src="images/img_25.gif" width="139" height="8" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="8" alt=""></td>
</tr>
<tr>
<td colspan="2" rowspan="5">
<img src="images/img_26.gif" width="10" height="369" alt=""></td>
<td width="302" height="57" colspan="12" bgcolor="#FFFAE2"> </td>
<td width="442" height="369" colspan="15" rowspan="5" bgcolor="#FFFAE1"><div>
<div align="center"><a href="http://purcity.free.fr/creas/Discovery/newsletter.html"><img src="http://purcity.free.fr/creas/Discovery/images/capture.jpg" alt="" border="0"></a></div>
</div></td>
<td colspan="3" rowspan="5">
<img src="images/img_290.gif" width="18" height="369" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="57" alt=""></td>
</tr>
<tr>
<td colspan="12">
<img src="images/img_30.gif" width="302" height="51" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="51" alt=""></td>
</tr>
<tr>
<td width="302" height="25" colspan="12" bgcolor="#FFFAE2"> </td>
<td>
<img src="images/spacer.gif" width="1" height="25" alt=""></td>
</tr>
<tr>
<td width="50" height="236" colspan="3" rowspan="2" bgcolor="#FFFAE1"> </td>
<td colspan="6">
<img src="images/img_33.gif" width="205" height="204" alt=""></td>
<td width="47" height="236" colspan="3" rowspan="2" bgcolor="#FFFAE1"> </td>
<td>
<img src="images/spacer.gif" width="1" height="204" alt=""></td>
</tr>
<tr>
<td width="205" height="32" colspan="6" bgcolor="#FFFAE2"> </td>
<td>
<img src="images/spacer.gif" width="1" height="32" alt=""></td>
</tr>
<tr>
<td colspan="6" rowspan="2">
<img src="images/img_36.gif" width="76" height="45" alt=""></td>
<td colspan="2" rowspan="2">
<img src="images/img_37.gif" width="103" height="45" alt=""></td>
<td colspan="4" rowspan="2">
<img src="images/img_38.gif" width="102" height="45" alt=""></td>
<td colspan="3" rowspan="2">
<img src="images/img_39.gif" width="47" height="45" alt=""></td>
<td colspan="2" rowspan="2" background="images/img_400.gif"> </td>
<td rowspan="2">
<img src="images/img_41.gif" width="24" height="45" alt=""></td>
<td colspan="12" rowspan="2" background="images/img_420.gif"> </td>
<td colspan="3" rowspan="2">
<img src="images/img_43.gif" width="18" height="45" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="27" alt=""></td>
</tr>
<tr>
<td>
<img src="images/img_44.gif" width="13" height="18" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="18" alt=""></td>
</tr>
<tr>
<td colspan="2" rowspan="2">
<img src="images/img_450.gif" width="17" height="162" alt=""></td>
<td colspan="4">
<img src="images/img_46.jpg" width="59" height="32" alt=""></td>
<td colspan="2">
<img src="images/img_47.jpg" width="103" height="32" alt=""></td>
<td colspan="4">
<img src="images/img_48.jpg" width="102" height="32" alt=""></td>
<td colspan="3">
<img src="images/img_49.jpg" width="47" height="32" alt=""></td>
<td colspan="2">
<img src="images/img_50.jpg" width="127" height="32" alt=""></td>
<td>
<img src="images/img_51.jpg" width="24" height="32" alt=""></td>
<td colspan="8">
<img src="images/img_52.gif" width="126" height="32" alt=""></td>
<td colspan="3">
<img src="images/img_53.gif" width="105" height="32" alt=""></td>
<td>
<img src="images/img_54.gif" width="60" height="32" alt=""></td>
<td colspan="3">
<img src="images/img_55.gif" width="18" height="32" alt=""></td>
<td>
<img src="images/img_56.gif" width="13" height="32" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="32" alt=""></td>
</tr>
<tr>
<td colspan="4" rowspan="2">
<img src="images/img_57.jpg" width="59" height="143" alt=""></td>
<td colspan="2" rowspan="2">
<img src="images/img_58.jpg" width="103" height="143" alt=""></td>
<td colspan="4" rowspan="2">
<img src="images/img_59.jpg" width="102" height="143" alt=""></td>
<td colspan="3" rowspan="2">
<img src="images/img_60.jpg" width="47" height="143" alt=""></td>
<td colspan="2" rowspan="2">
<img src="images/img_61.jpg" width="127" height="143" alt=""></td>
<td rowspan="2">
<img src="images/img_62.jpg" width="24" height="143" alt=""></td>
<td colspan="8" rowspan="2">
<img src="images/img_63.gif" width="126" height="143" alt=""></td>
<td colspan="3" rowspan="2">
<img src="images/img_64.gif" width="105" height="143" alt=""></td>
<td rowspan="2">
<img src="images/img_65.gif" width="60" height="143" alt=""></td>
<td colspan="3" rowspan="5">
<img src="images/img_66.gif" width="18" height="244" alt=""></td>
<td rowspan="5">
<img src="images/img_670.gif" width="13" height="244" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="130" alt=""></td>
</tr>
<tr>
<td colspan="2">
<img src="images/img_68.gif" width="17" height="13" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="13" alt=""></td>
</tr>
<tr>
<td colspan="4" rowspan="2">
<img src="images/img_690.gif" width="29" height="96" alt=""></td>
<td width="741" height="84" colspan="26" bgcolor="#FDF8CE"><div align="justify"><span class="Style1">Dans cette nouvelle émission française, c’est le défi que relève François Leverne chaque semaine en aidant des particuliers à aménager leur chez-soi avec inventivité et sans dépenser des fortunes ! Avec 500 euros en poche et une journée pour réaliser les travaux, l’expert déco de Discovery Real Time, accompagné de Nathalie et Sophie , bricole, aménage et prodigue ses bons conseils et astuces pour transformer son chez soi à moindres frais !</span></div></td>
<td>
<img src="images/spacer.gif" width="1" height="84" alt=""></td>
</tr>
<tr>
<td colspan="6" rowspan="3">
<img src="images/img_71.jpg" width="188" height="67" alt=""></td>
<td colspan="20" rowspan="3" background="images/img_720.gif"> </td>
<td>
<img src="images/spacer.gif" width="1" height="12" alt=""></td>
</tr>
<tr>
<td colspan="4" rowspan="6">
<img src="images/img_73.jpg" width="29" height="108" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="5" alt=""></td>
</tr>
etc etc etc
</table>

</body>
</html>

Sous firefox, IE ou thunderbird, aucun probleme :

Sous des webmails comme hotmail(le pire!) par exemple :

Message édité par ludo2604 le 14-01-2008 à 20:34:26

gatsu35

Blablaté par Harko

c'est pas de cette maniere qu'on fait un emailing, surtout que le tiens est super mal fait

Message cité 1 fois

ludo2604

kitsch' me if u can

gatsu35 a écrit :

c'est pas de cette maniere qu'on fait un emailing, surtout que le tiens est super mal fait

:??: Et c'est tout ?mal fait dans quel sens ?
j'aimerai bien avoir des conseils dans ce cas

gatsu35

Blablaté par Harko

na pas avoir de balise style
coller les <td><img></td> correctement, ne pas laisser d'espace en gros
déjà fait ca

ludo2604

kitsch' me if u can

merci bcp, desole mais c'est là premiere fois que je fait ça !
je vais deja optimiser ça...
mais qu'entends tu par "cette maniere" ? il y a d'autre chose que je ne respecte pas ?

Message édité par ludo2604 le 15-01-2008 à 01:18:04

FORUM HardWare.fr

Programmation

HTML/CSS

Newsletter mal découpée dans les clients mail

Sujets relatifs
envoyer les info d'un formulaire par mail	Envoi d'un formulaire par mail
Mail HTML & Lotus Notes 6.5	Utiliser des Newsletter ?
Création d'un client mail IMAP	Mail automatique avec Gmail
Recup USERNAME + Envoi par mail (PJ)	Intégrer du Flash dans une Newsletter...?
Configurer la fonction mail de appache (php.ini)	Newsletter avec reload de page!
Plus de sujets relatifs à : Newsletter mal découpée dans les clients mail

Page générée en 0.066 secondes