Comprendre l’optimisation des e-mails sur mobile
Objectif de cet article
Découvrez les paramètres d’optimisation mobile par défaut proposés par Klaviyo pour les e-mails, ainsi que des outils pour personnaliser l’affichage de votre message sur différents appareils. Vous pouvez également choisir de désactiver toutes les optimisations mobiles en accédant à l’onglet Styles de votre modèle d’e-mail.
Options générales d’optimisation pour mobile
Si vous choisissez d’activer les optimisations pour mobile, certains ajustements seront effectués automatiquement afin d’optimiser l’apparence de votre e-mail lorsqu’il est consulté sur un appareil mobile.
Si vous préférez que votre e-mail ne soit pas optimisé pour les appareils mobiles, ouvrez l’onglet Styles de votre modèle. Sous Optimisation mobile, désactivez Optimiser pour les appareils mobiles.

Lorsque Optimiser pour mobile est activé, vous pouvez effectuer d’autres ajustements spécifiquement pour l’affichage sur mobile, notamment :
- Ajuster les marges du contenu
- Ajuster les tailles du texte et des titres sur mobile
- Ajuster l’espacement du texte et des titres sur mobile
- Ajuster la marge intérieure du bloc sur mobile
Disposition de la barre d’en-tête sur mobile
Sélectionnez un bloc Barre d’en-tête, puis faites défiler jusqu’au menu Mise en page mobile dans l’onglet Styles pour sélectionner une mise en page mobile. La valeur par défaut est Tout empiler, et vous pouvez la modifier en fonction de vos besoins.
Masquer sur mobile ou sur ordinateur
Vous pouvez choisir si un bloc s’affiche sur mobile, sur ordinateur, ou sur les deux. Sélectionnez le bloc, puis ouvrez son onglet Affichage, puis choisissez une option sous Afficher sur.
Si la visibilité de l’appareil est définie sur la section, elle remplace les paramètres de ses blocs. Sélectionnez la section et ouvrez son onglet Affichage pour modifier la visibilité de la section, ou désactivez Définir la même visibilité pour tous les blocs de cette section afin de définir la visibilité de chaque bloc séparément.

Option d’étirement de l’image
Pour un bloc d’image, vous pouvez choisir d’afficher l’image à sa taille maximale disponible sur mobile. Sélectionnez le bloc d’image, puis ouvrez son onglet Styles. Sous Mise en page de l’image, activez Remplir la colonne sur mobile. Si Remplir la colonne est activé, Remplir la colonne sur mobile l’est déjà. Pour désactiver le paramètre mobile, désactivez d’abord Remplir la colonne.
Pour supprimer l’espacement horizontal du bloc sur mobile, activez Pleine largeur sur mobile sous Espacement du bloc dans l’onglet Styles du bloc d’image.
Les colonnes s’empilent sur mobile
L’empilement des colonnes (créées à l’aide de la mise en page Colonnes ou des options du bloc Fractionnement) sur les appareils mobiles permet d’afficher du texte et des images plus grands, plus faciles à lire sur un petit écran. Si vous préférez que vos colonnes apparaissent côte à côte sur mobile, choisissez le paramètre correspondant à votre mise en page :
- Pour une mise en page en colonnes, sélectionnez la section, puis ouvrez son onglet Styles. Sous Empilement mobile, sélectionnez Aucun empilement.
- Pour un bloc Fractionnement, sélectionnez le bloc et ouvrez son onglet Styles. Sous Empilement mobile, sélectionnez Aucun empilement.
Les colonnes resteront côte à côte, mais seront redimensionnées pour s’adapter à un écran mobile.
Marges internes du bloc de texte sur mobile
Lorsque l’optimisation mobile est activée, l’option Remplacer la marge intérieure de la zone de texte est activée par défaut et définit la marge intérieure gauche et droite de la zone de texte sur 18px. Pour utiliser plutôt la marge intérieure de la zone de texte propre à chaque bloc de texte :
- Ouvrez le menu Styles de votre modèle.
- Faites défiler jusqu’à la section Texte et titres sur mobile.
- Désactivez le bouton Remplacer les marges internes de la zone de texte.

Compatibilité des clients e-mail avec l’optimisation mobile
De nombreuses applications d’e-mail offrent des niveaux de prise en charge variables pour les optimisations mobiles.
Pour avoir un aperçu de votre e-mail sur différents clients de messagerie et appareils, vous pouvez utiliser un outil de test d’e-mail tiers.
Nous vous recommandons un outil comme Litmus, qui propose une version d’essai gratuite ainsi que des abonnements mensuels payants. Vous pouvez également utiliser d’autres outils gratuits qui vous permettent de tester et de prévisualiser le rendu de vos e-mails sur différents clients de messagerie et appareils.
Déterminer combien d’abonnés ouvrent sur mobile
Dans l’onglet Délivrabilité d’une campagne d’e-mail envoyée, faites défiler vers le bas jusqu’à Performances par client de messagerie pour voir les ouvertures uniques regroupées par client de messagerie et réparties entre mobile et ordinateur. Cela peut vous donner une indication sur la façon dont votre public interagit avec vos e-mails. Les ouvertures provenant de clients de messagerie inconnus sont exclues. Par conséquent, le graphique n’affiche pas une répartition complète des appareils de votre audience.
Vous pouvez également segmenter sur la base de ces informations en ajoutant un filtre à la condition Ce que la personne a fait (ou n'a pas fait) > Email ouvert. Par exemple, pour trouver les personnes qui ouvrent sur mobile, ajoutez un filtre où Type de client est égal à Navigateur mobile.

Ressources supplémentaires
- How to optimize popup and flyout forms for mobile
Learn how to design your mobile sign-up forms with Klaviyo's best practices in mind so you can ensure your popup and flyout forms are optimized for mobile visitors.
- Getting started with SMS and MMS for the first time