Vous souhaitez intégrer une couleur, une image d’arrière-plan ou encore une vidéo en fond de votre email ? Oui, une vidéo c’est possible sur Apple Mail via Mac !
Quelle messagerie supporte quel format ? Nous vous éclairons sur l’arrière-plan de votre campagne emailing !
Comme indiqué ci-dessus, l’arrière-plan de votre email peut afficher 3 formats. Toutes les messageries ne supportent pas la vidéo ni l’image. Vous êtes donc dans l’obligation de renseigner au moins la couleur d’arrière-plan de votre campagne, même si c’est blanc.
Les 3 formats peuvent être intégrés dans le code de votre campagne :
– La vidéo pour Apple Mail sur Mac
– L’image d’arrière-plan pour les messageries ne supportant pas le format vidéo
– La couleur de fond pour les messageries qui n’affichent pas l’image
Pour cela, il faut intégrer dans la balise <HEAD> :
<STYLE> @media screen and (-webkit-min-device-pixel-ratio: 0) { div[class="line1"]{display: block;border-top: 1px solid #d3d3d3;width: 25%;float: left;margin-top: 15px;} div[class="format"]{width: 50%; display: block; float: left;} div[class="line2"]{display: block;border-top: 1px solid #d3d3d3;width: 17%;float: left;margin-top: 15px;} div[class="last-year"]{display: block; width: 66%; float: left;} div[class="video-wrap"]{height: 100%;height: 750px;position: relative;overflow: hidden;padding:0;margin:0;} video[class="video"]{min-height: 100%; min-width: 100%;position: absolute;top: 0p;left: 0;z-index: 2;display:inline-block !important;} div[class="overlay"]{height: 100%;position: relative;min-height: 100%;margin: 0 auto;padding: 0 20px;z-index:3;} td[class="no-padding"]{padding: 0 !important;} td[class="title"]{display: block !important; padding-top: 35px;} td[class="webkit-hide"]{display: none !important;} } </STYLE>
Et dans la balise <TR> du tableau :
<TD class=no-padding width="100%" align=center> <DIV class=video-wrap style="BACKGROUND: url(http://VOTREIMAGE.jpg) no-repeat center top; PADDING-BOTTOM: 50px; PADDING-TOP: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; background-size: cover" bgColor=#VOTRECOULEUR> <VIDEO class=video style="DISPLAY: none" autoplay="autoplay" loop="loop"><SOURCE src="https://VOTREVIDEO.mp4" type="video/mp4"></SOURCE> </VIDEO></DIV> </TD>
Attention à bien remplacer les indications :
– « votreimage.jpg » et « votrevideo.mp4 » par l’image d’arrière plan et le vidéo que vous souhaitez afficher, les deux fichiers doivent être hébergés
– « votrecouleur » par la couleur définie en valeur hexadécimale, exemple : #f3a956
Créer une image d’arrière-plan est indispensable pour 2 raisons :
– la majorité des messageries n’affichent pas la vidéo
– certains lecteurs peuvent avoir des difficultés à télécharger la vidéo de fond à cause de la taille du fichier
Il est indispensable de définir une couleur de fond pour les messageries qui n’affichent pas l’image d’arrière-plan.
Le format affiché selon la messagerie utilisée :
|
Vidéo
|
Image
|
Couleur
|
|
|---|---|---|---|
| Apple Mail sur Mac |  |
||
| Apple Mail sur iPad & iPhone | |
||
| Outlook 2003 | |
||
| Outlook 2007, 2010 et 2013 | |
||
| Thunderbird | |
||
| Outlook.com | |
||
| Gmail | |
||
| Yahoo | |
||
| Zimbra | |
||
| SFR | |
||
| LaPoste | |
||
| Numericable | |
||
| Windows Live Mail | |
||
| Windows Mail | |
||
| Bouygues Telecom | |
Pour les messageries qui n’affichent pas la vidéo, vous pouvez intégrer une animation .gif simulant une vidéo. Nous vous invitons à lire l’article sur la tendance « GIF ».
