Actualités : Sarbacane lance la nouvelle version de son logiciel. En savoir plus.
Plus de 100 templates emailing à votre disposition pour envoyer à vos abonnés des campagnes responsives et à votre image. Choisissez-en un et personnalisez-le facilement grâce à notre EmailBuilder, un éditeur glisser-déposer à la fois puissant et intuitif.
Voir tous les templatesAvec 100 pages d'astuces et conseils, Sarbacane Connect est le seul magazine dédié au marketing direct proposant une telle densité de conseils pratiques et applicables. Découvrez le numéro 3 avec son dossier spécial : L'IA au cœur des nouvelles stratégies marketing.
Voir le magazineSarbacane accompagne les entreprises à exploiter pleinement leur potentiel marketing.
Voir les témoignagesVersion numérique gratuite
Optimiser vos campagnes pour l’affichage mobile
Apparu en 1992 par IBM et diffusé plus largement par Apple en 2007 avec l’iPhone, le smartphone fait désormais partie intégrante de la vie des français.
71%
des français possèdent un smartphoneEn 2018, 71% de la population française possède un smartphone(1), contre 46% en 2014 (2) .
Le téléphone portable est rapidement devenu un outil de communication au service de l’homme. Cette véritable révolution a séduit dès son apparition. L’arrivée du smartphone a amplifié ce phénomène et a bouleversé les règles de la vie sociale. Il est devenu l’assistant personnel de près de la moitié des français.
90% des français se connectent au moins une fois par jour en 2018. Ils se connectent en moyenne 23 fois par jour et y passent en moyenne 1h42(3).
90%
se connectent au moins une fois par jourEn France, 53,8% de la population est mobinaute, représentant près de 30 millions de français(1). L'accès à Internet depuis son mobile est facilité grâce aux modes de connexions qui se diversifient par le déploiement du Wifi et du réseau 3G et 4G.
Selon Médiamétrie, la France compte plus de 52,5 millions d’internautes en septembre 2018.
21,5
millions d'internautesL’accès à Internet depuis son mobile est facilité grâce aux modes de connexions qui se diversifient par le déploiement du Wifi et du réseau 3G et 4G.
Si les applications d’email sont la catégorie la plus utilisée par les 15-60 ans, elle n’arrive qu’en 2ème position chez les 15-24 qui lui préfèrent les réseaux sociaux et les messageries instantanées (1).
78% les utilisent quotidiennement et lorsqu’on leur demande quelles sont les apps dont ils ne pourraient pas se passer, les 15-24 ans répondent : Facebook et Snapchat(1).
Leurs usages :
Avec toutes les applications intégrées à nos smartphones, ce petit appareil nous sert tous les jours pour toutes nos tâches quotidiennes.
En France, le secteur atteint un stade de maturité. À l’échelle mondiale, la croissance des ventes ralentit, mais ne baisse pas.
Ce recul qui devrait se poursuivre. Les Français sont désormais bien équipés en smartphones, plus de 70 % en possèdent un. L’heure n’est plus à l’achat d’un premier équipement, mais à son renouvellement et les consommateurs gardent leurs smartphones un peu plus longtemps.
Longtemps en avance par rapport aux autres constructeurs, Apple perd depuis quelques années des parts de marché. Désormais Android est en tête des systèmes d’exploitation de téléphonie mobile. Ce marché se dynamise avec la vente de nouveaux modèles proposés chaque année.
Avec une part de marché de 85,1%(1), Android demeure bien en première position.
La part de marché des systèmes d'exploitation en France(1)
En 2017, deux marques occupent le top 10.
Ce ne sont pas ceux dont l’on parle le plus, pourtant les smartphones bas et moyen de gamme sont ceux qui se vendent le plus en France, devant les célèbres Galaxy S de Samsung et iPhone d’Apple.
76% des internautes français se connectent depuis deux équipements et plus. 49% le font depuis 3 équipements et plus (1).
Le smartphone devient désormais le premier support de consultation des emails. C’est la conclusion d’une étude mondiale menée par Return Path (spécialiste de l’email intelligence) qui a analysé plus de 27 milliards d’emails ouverts entre mai 2016 et avril 2017 à l’aide de son outil de monitoring(2).
Le smartphone prend de plus en plus d’ampleur, en 2017, 55% des emails observés ont été consultés depuis un mobile contre 29% en 2012(2).
Conséquence mécanique, le taux d’ouverture sur Webmail (emails ouverts sur Gmail ou Yahoo Mail depuis un navigateur) a chuté de 26% en cinq ans, passant de 37% à 28%(2).
A chaque moment de la journée son support de connexion pour consulter ses emails(1) :
Le taux d’ouverture sur Webmail et clients augmente logiquement pendant la semaine lorsqu’on est au bureau et donc devant un PC fixe. Le Webmail compte ainsi pour 29% des ouvertures et 16 à 19% pour les logiciels clients (2).
Il existe plusieurs applications permettant de consulter ses emails sur un smartphone :
La majorité des personnes utilise les applications natives, donc déjà installées, pour consulter leurs mails. Elles se nomment Mail sur l’iPhone et Gmail sur Android.
Il existe plusieurs applications permettant de consulter ses emails sur un smartphone :
L'application est préinstallée, l'utilisateur n'a plus qu'à la paramétrer. Elle permet de regrouper plusieurs adresses emails dans une seule application, pratique lorsque l'on possède différentes adresses emails.
Aujourd'hui, toutes les messageries possèdent leurs propres applications mobiles. Même si les fonctionnalités sont identiques par rapport aux applications natives, l'ergonomie de l'application et le rendu du contenu des emails changent.
Pour l'utilisateur, il suffit de télécharger l'application et de paramétrer son email.
Chaque application, comme chaque messagerie, interprète à sa façon le code HTML du message pour afficher le contenu.
Il est aussi possible d'accéder à sa messagerie depuis le navigateur Safari sur iPhone ou le navigateur Internet sur Android, ces deux applications sont installées par défaut.
A partir du navigateur, le mobinaute accède au site Internet de sa messagerie.
La navigation sur les écrans tactiles est très intuitive. Mais elle n'est pas toujours facile à utiliser et peut même être agaçante si le contenu n'est pas adapté à ses spécificités. Le doigt n'étant pas aussi précis que la souris, il faut respecter certaines règles dans la conception de vos emails et sites :
Les éléments cliquables doivent être visuellement identifiables : contrairement à la souris qui donne l'information d'un élément cliquable avec une icône de main, sur écran tactile, on ne sait pas quel élément est cliquable car il n'y a pas de survol possible. C'est pourquoi vous devez faire en sorte que vos liens soient de préférence soulignés et que vos boutons d'action soient bien visibles (colorés, rectangulaires ou à bords arrondis...). Nous préconisons une taille minimum de 44 x 44 pixels pour un bouton facilement cliquable.
Espacez vos éléments cliquables : plusieurs éléments cliquables trop rapprochés seront difficiles à distinguer. Vous risquez d'énerver vos lecteurs si jamais ils cliquent malencontreusement sur un lien alors que c'était celui d'à côté qu'ils ciblaient !
Les tailles d'écrans étant réduites, il est désagréable de devoir faire défiler le contenu pour le consulter en totalité. Il est important de réduire les contenus de façon à pouvoir facilement consulter l'emailing.
Le preheader est la partie textuelle de votre email qui se trouve tout en haut. Bien souvent, il est composé d'un lien vers la page miroir (copie Web de l'emailing) sous la forme d'une phrase qui ressemble généralement à : "Si vous ne visualisez pas ce message, cliquez ici." C'est bien dommage car l'application mail de l'iPhone et de l'iPad affiche dans la liste des messages reçus le début des messages, juste après l'objet. Utilisez cet espace pour apporter des informations complémentaires, en plus de l'objet, et convaincre vos destinataires d'ouvrir votre message !
Afin d'être sûr que votre email soit correctement interprété sur smartphone, nous vous conseillons d'utiliser dans vos emails les polices Verdana ou Arial. Ces polices de caractères sont reconnues pour leur grande lisibilité et particulièrement adaptées à la lecture sur écran. Concernant les visuels, nous vous invitons à appliquer des contrastes forts. Les contrastes de couleur faibles ne sont pas conseillés sur les petits écrans, car la lecture est rendue plus difficile. Il faut penser aussi aux lecteurs qui ouvriront leurs emails dès le réveil, les couleurs ne doivent pas choquer. Evitez donc les couleurs flashies comme le jaune qui peuvent être désagréable pour la lecture.
En fonction des caractéristiques du support et de l'application utilisée pour consulter les emails, une campagne emailing classique (non optimisée pour mobile) s'affichera de 2 manières :
La largeur du document se redimensionne à la largeur de l'écran. Vous avez une vue globale de l'emailing ce qui permet de comprendre comment l'information est organisée. Mais les contenus sont difficilement lisibles, les liens sont trop petits pour être cliqués sans risque d'erreur. Vous devez alors zoomer pour lire l'email.
La largeur de l'email ne s'adapte pas à la largeur de l'écran et vous avez une vue de la taille réelle du contenu. Les mots ou les phrases sont lisibles mais l'ensemble d'un bloc texte peut être tronqué. La hiérarchie des informations n'est pas visible, il est donc plus difficile de trouver des repères de lecture.
Vous devez dézoomer pour comprendre la structure et repérer les informations.
Ces contraintes ne sont pas liées exclusivement à l'emailing, ce sont des caractéristiques du web mobile en général. Si vous consultez une page web non optimisée sur votre smartphone, il y a fort à parier que vous vous trouverez confronté à la même problématique. Qui n'a jamais connu cette expérience douloureuse avec un menu ou un formulaire.
Ce zoom initial peut être contrôlé grâce à la balise meta viewport à intégrer dans la balise <HEAD>. du code HTML. Celle-ci va permettre d'adapter automatiquement le contenu à la largeur du support de lecture.
Exemple :
<meta name="viewport" content="width=device-width, initialscale=1">
width : taille en pixels de l'écran
Le responsive design consiste à optimiser un site ou un emailing sur le maximum de supports différents. Cela peut se faire pour chaque support séparément ou plus globalement en ciblant les grandes familles d'écrans.
Comment le rendre responsive ?
Plusieurs méthodes sont possibles, nous vous les détaillons dans les chapitres suivants.
L'email fluide est une mise en page qui s'adapte aux petits et grands écrans. Le contenu est automatiquement redimensionné selon la largeur du support de lecture sans modifier la structure de la page. Si votre email est déjà composé en une seule colonne, vous pouvez utiliser l'email fluide.
Pour que l'email s'adapte, il est conseillé de définir les dimensions de chaque élément en pourcentage.
Le code à utiliser :
style = "width : 80%; max-width : 600px; height : auto;"
width : la largeur de l'image en pourcentage pour les petits écrans
max-width : la largeur maximum de l'image pour les grands écrans et ordinateurs
height : la hauteur en automatique pour garder la proportion de l'image
Attention : les propriétés max-width et min-width ne sont pas compatibles sur les messageries Outlook 2007, 2010 et 2013.
Pour adapter le contenu de son email aux différents mobiles, il est indispensable d'utiliser les Media Queries. Il s'agit d'une spécificité CSS3 permettant de détecter la largeur du support de lecture et d'appliquer un contenu différent selon la largeur du mobile.
La méthode la plus utilisée consiste à cibler la taille en pixels CSS de l'écran :
Le code à utiliser :
@media only screen and (max-device-width : 480px)
Dans cet exemple, nous avons fixé la limite à 480 pixels. Cela signifie que les emails ouverts sur un téléphone dont la largeur est inférieure à 480 px CSS afficheront la version optimisée.
Les Medias Queries permettent également des combinaisons multiples, voici parmi elles 2 possibilités à retenir :
Sélection en fonction de l'orientation du device (portrait ou landscape)
Exemple :
@media(max-device-width : 480px) and (orientation :portrait) {
/* largeur en-dessous de 480px et mobile orienté en portrait*/
}
Sélection en fonction de la résolution d'ecran ou pixel ratio
Exemple :
@media (min-device-pixel-ratio: 1.5) {
/* écran au-dessus de 144dpi*/
}
Voici un tableau récapitulatif des différents smartphones sur le marché (en gras les plus vendus en sept. 2014) :
La largeur en pixels CSS du smartphone correspond à la 3ème colonne de chiffres.
Les Medias Queries ont été testés sur :
Mobile
Android 4.4
Gmail app (Android)
Gmail app IMAP (Android)
iOS
Inbox by Gmail (Android)
Inbox by Gmail (iOS)
Outlook (Android)
Outlook (iOS)
Samsung Mail (Android)
Yahoo! Mail app (Android)
Yahoo! Mail app (iOS)
Desktop
Apple Mail 10
Outlook 2000-03
Outlook 2007-16
Outlook for Mac
Thunderbird
Windows 10 Mail
Webmail
AOL Mail
Gmail
G Suite
GMX.de
Inbox by Gmail
Libero
Office 365
Orange.fr
Outlook.com
Gmail
SFR.fr
T-online.de
Web.de
Yahoo! Mail
Compatibilité
Compatibilité
Compatibilité
En fonction des systèmes d'exploitation, certaines règles ne sont pas prises en compte, cela peut être le cas pour les Media Queries. Pensez à tester votre campagne sur votre téléphone pour vérifier que tout fonctionne correctement.
Les Media Queries doivent être intégrés dans la partie < HEAD > du message tel qui suit :
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf8">
<style type="text/css">
@media only screen and (max-device-width : 480px) {
.conteneur{
width: 80% !important;
}
.titre-rouge {
color: #F00 !important;
}
.img-mobile {
width:80%! important;
}
.colonne{
width:80% !important;
display:block !important;
}
.cacher-mobile{
display:none !important;
}
</style>
</head>
Suivi ensuite de la partie <BODY> présentant le contenu de l'email.
Dans les Media Queries, il suffit d'indiquer les spécificités de votre email tel qu'il doit s'afficher sur mobile :
Chaque classe CSS est à reporter dans la partie <BODY> du code HTML selon l'élément que vous souhaitez modifier. La règle de priorité !important doit être ajoutée dans les Media Queries pour que le style soit utilisé en priorité par rapport au style indiqué dans le <BODY>.
Voici un exemple :
<body style="padding:0; margin:0">
<table class="conteneur" align="center" width="600" border="0" cellspacing="0" cellpadding="0">
<tr>
<td style="padding:15px 0">
<p class="titre-rouge" style="font-family:Arial, Helvetica, sans-serif; color:#000; font-size:30px"><strong>Responsive design</strong></p>
</td>
</tr>
<tr>
<td style="padding-bottom:20px"><img class="img-mobile" src="image.jpg" width="600" height="150"></td>
</tr>
<tr>
<td>
<table class="conteneur" width="600" border="0" cellspacing="0" cellpadding="0">
<tr>
<td class="colonne" style="line-height:20px">
<p style="font-family:Arial, Helvetica, sans-serif;color:#000; font-size:16px"><strong>Titre</strong></p>
<p style="font-family:Arial, Helvetica, sans-serif;color:#000; font-size:12px">
Le Lorem Ipsum est simplement du faux texte employé dans la composition et la mise en page avant impression.</p>
</td>
<td width="15px" class="cacher-mobile"> </td>
<td class="colonne" style="line-height:20px">
<p style="font-family:Arial, Helvetica, sans-serif; color:#000; font-size:16px"><strong>Titre</strong></p>
<p style="font-family:Arial, Helvetica, sans-serif; color:#000; font-size:12px">
Le Lorem Ipsum est simplement dufaux texte employé dans la composition et la mise en page avant impression.</p>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
Newsletter Sarbacane Software
Emailing crée par l'Agence Sarbacane pour EMDE
Avec Sarbacane EmailBuilder, créer des newsletters devient un jeu d'enfant !
L'éditeur graphique révolutionnaire de Sarbacane guide pas à pas l'utilisateur dans la conception du message. Il suffit de glisser et déposer les blocs de textes et/ou de visuels, et le contenu se crée sans effort ni connaissances techniques !
Sarbacane EmailBuilder rend automatiquement les créations compatibles pour smartphones. Sans toucher au code HTML, l'outil s'occupe d'optimiser la création graphique et permet de visualiser en temps réel le rendu visuel du message sur le format mobile.
Il est possible de partir d'une page blanche ou de choisir une première base à retravailler par la suite :
Des modèles créés par des graphistes sont aussi proposés :
Qu'elle soit créée de toute pièce ou à partir d'un modèle choisi, chaque création est automatiquement adaptée pour le mobile :
En un tour de main, le contenu de l'email est créé et l'email s'adapte aux smartphones.
L'EmailBuilder est disponible sur le logiciel Sarbacane. Découvrez-le en téléchargeant le logiciel à www.sarbacane.com/telechargement
L'utilisation du smartphone et la lecture des emails sur ce support sont désormais ancrées dans les habitudes des consommateurs. Si l'entreprise ne prend pas en compte ce nouveau comportement, sa communication par email risque d'en subir les conséquences.
L'email peut être adapté pour la lecture sur mobile grâce aux méthodes présentées.
Rendre son email responsive, c'est prendre en compte ses destinataires et favoriser le confort de lecture de votre communication.
Leader sur le marché français de l'emailing, Sarbacane Software développe et édite un logiciel permettant d'accompagner les entreprises dans la création et la gestion de campagnes emailing.
Depuis 2001, le logiciel a constamment évolué pour répondre aux attentes et besoins des utilisateurs grâce à l'ajout d'outils : suivi comportement, prévisualisation des campagnes, optimisation de la délivrabilité ou encore la géolocalisation des destinataires.
Toutes ces fonctionnalités ont fait de Sarbacane Software une solution complète, simple à utiliser et un leader dans son domaine.
Toutes ces fonctionnalités ont fait de Sarbacane Software une solution complète, simple à utiliser et un leader dans son domaine.
En 2017, Sarbacane innove en tous points de vue en développant une nouvelle génération du logiciel, qui s’annonce comme l’outil complet de création marketing, solution incontournable parmi les acteurs de l’email marketing.
Le logiciel fait peau neuve et intègre de nouvelles fonctionnalités permettant aux entreprises de mettre en place facilement des campagnes emailing toujours plus performantes. En version logicielle pour PC et Mac, Sarbacane est désormais disponible en version web.
Chaque utilisateur peut désormais l’utiliser où il veut, quand il veut. Toutes les données sont enregistrées et sauvegardées pour être récupérées à tout moment sur l’interface web ou le logiciel.
EMAILING
SMS MARKETING
MARKETING AUTOMATION
Les équipes R&D de Sarbacane ont développé un algorithme, basé sur l’intelligence artificielle et permettant d’envoyer chaque email d’une campagne marketing au moment exact où chaque destinataire, selon ses spécificités uniques, sera le plus enclin à le lire.
Sarbacane propose un accompagnement sur mesure aux entreprises souhaitant être accompagnées dans leur stratégie marketing et dans la création et l’envoi de leurs campagnes emarketing.
Notre expertise :
Plus d’informations sur www.sarbacane.com/
Ou par téléphone au +1 646 867 2537
SARBACANE Software
S.A.S. au capital de 169 967 € - RCS Lille Métropole 509 568 598
Siège social : 3, avenue Antoine Pinay - Parc des 4 vents - 59510 HEM - FRANCE
www.sarbacane.com blog.sarbacane.comMars 2019
Toute reproduction commerciale sans l’autorisation expresse de SARBACANE SOFTWARE est strictement interdite. La marque Sarbacane est protégée par les droits de propriété.