L responsive. Optimisez vos campagnes pour les smartphones Guillaume Fleureau»

Transcription

1 L responsive Optimisez vos campagnes pour les smartphones Guillaume Fleureau»

2 Sarbacane Software Editeur de solutions e-marketing Implantée à Lille et à Barcelone Société créée en collaborateurs 6000 clients dans le monde 5,3 millions d euros de CA en 2012 (+17% par rapport à 2011)

3 Le logiciel Sarbacane Leader des logiciels ing sur les TPE- PME utilisateurs Service de routage professionnel associé : Plus de 100 millions d s délivrés chaque mois campagnes routées en 2012

4 Autres activités Studio Sarbacane Conception et création de vos campagnes ings sur-mesure Getinbox Vérifiez le rendu de vos ing sur les principales messageries Primotexto La solution d'envoi de SMS professionnelle personnalisés et enrichis

5 Le Responsive Design Technique de design ayant pour objectif d offrir une lisibilité optimale des s et des sites web sur toutes les résolutions et tous les devices, principalement les ordinateurs, tablettes et smartphones. Cette technique vise à optimiser le confort de lecture et de navigation des utilisateurs et ainsi optimiser l efficacité du site web ou de l .

6 Contexte

7 Le phénomène des smartphones Ventes de smartphones en 2012 : 717 Millions 13,5 Millions 24 Millions de français possèdent un smartphone Soit + 40% par rapport à 2011 En 2013, 20 millions de smartphones seront vendus en France! Source Médiamétrie 2012

8 Le phénomène des smartphones Source : GFK

9 Consultation des s sur smartphones 47% 38,4% Source : Litmus / SNCD / Return Path

10 Consultation des s sur smartphones Source : Litmus

11 Parts de marché OS Mobiles en 2012 Source : Médiamétrie

12 Répartition des messageries dans le monde Source : Litmus

13 Les messageries s adaptent à l usage mobile

14 Exemples

15 Raisons de se mettre au responsive 80% des utilisateurs suppriment un qui s affiche mal dans leur mobile Seulement 3% des utilisateurs ouvrent le même à la fois sur smartphone ET sur ordinateur Dans le monde, 25% des campagnes sont optimisées pour le mobile Source : Litmus / Return Path / econsultancy

16 Avantages de se mettre au responsive Un meilleur impact de vos campagnes donc plus de clics et de ventes! Amélioration de l expérience utilisateur sur smartphone, donc de la satisfaction de vos destinataires Amélioration de votre image de marque

17 Sans optimisation

18 Avec Optimisation

19 Passons à la pratique! 3 techniques

20 Technique n 1 : Mobile Aware Design

21 Technique n 2 : fluide (scalable) Tailles des éléments en % Compatibles avec la plupart des messageries

22 Technique n 3 : adaptatif Une version dédiée qui s affiche à la détection de la lecture sur smartphone Compatible uniquement avec les applications natives ios et Android

23 Technique n 3 : adaptatif Exemples Masquage de la colonne de droite Version mobile complètement différente

24 Technique n 3 : adaptatif La compatibilité de Media Query dépend de l application, pas du device! Non compatible avec :

25 Quelle est la meilleure technique? Créer un hybride, c est possible! Fluide qui s affichera sur desktop, tablettes et smartphones dans les messageries ne supportant pas Media Query Adaptatif en Media Query pour les messageries compatibles

26 Bonne pratiques

27 Bonne pratique n 1 : le preheader Vous avez 80 caractères maxi pour attirer l attention!

28 Bonne pratique n 2 : attribut ALT

29 Bonne pratique n 3 : s adapter au mobile

30 Bonne pratiques en vrac Utilisez les polices Arial ou Verdana, reconnues pour leur lisibilité sur écran Utilisez des contrastes forts mais pas des couleurs flashys (pensez à la lecture au réveil ) Mettez du texte HTML en plus de vos images (au moins 60% de textes) Rendez les éléments cliquables identifiables et respectez une hauteur de minimum 44px pour vos CTA Allégez les contenus, allez à l essentiel pour faciliter la lecture Insérez votre numéro de téléphone, votre adresse ou des dates Pensez aussi à avoir un site web/landing responsive

31 Exemple Love2Recycle

32 Exemple British Airways

33 Exemple SnapNames

34 Exemple Sarbacane

35 Exemple Orange

36 Exemple Twitter Desktop Mobile

37 Votre responsive sur mesure Plus de 900 projets ing déjà réalisés Des experts réalisent vos s responsive!

38 Merci! L ing efficace Aux éditions Eyrolles