Au sein des Klubs, nous utilisons un éditeur de texte pour insérer du texte, des images et surtout pour la mise en forme.
Vous trouverez l'option de format HTML spécifique au bas de cet article de la base de connaissances.
Format du texte
Caractéristiques
L'éditeur comprend les fonctions suivantes, dont certaines spécifiques seront examinées plus en détail :
Main Bold - Italic - Underline - Striketrough - Font size - Text colour - Ordered list - Unordered list (bullets) - Block Quote - Table - Link - Image - Horizontal line - Indent - Outdent - Alignment - -HTML
Copie du texte
Dans le meilleur des cas, le texte est simplement saisi et mis en forme.
La copie de texte, par exemple à partir d'un document Word ou d'un site web, est également possible, mais peut poser des problèmes. Ce texte copié contient généralement des caractères de contrôle qui peuvent parfois être mal interprétés dans l'éditeur et créer des effets spéciaux.
Il est préférable que le texte copié soit d'abord formaté comme un texte propre, sans les éventuels caractères de contrôle.
- via une copie propre dans l'éditeur : Ctrl+Shift+V (PC) ou Command+Option+Shift+V (Mac)
- via le bloc-notes (PC), puis coller et faire correspondre le style.
- via TextEdit (Mac), puis Coller et Faire correspondre le style
- via un outil en ligne - http://www.textcleanr.com
Tableau ⊞
La mise en forme d'un tableau utilisable dans un éditeur nécessite quelques connaissances en html.
Pour cela, nous nous référons à un bon tutoriel - https://www.w3schools.com/html/html_tables.asp
Lien 🔗
Un lien vous permet de relier des liens externes dans votre texte.
Liens de votre texte vers des sites web ou vers une adresse mail (qui s'ouvre alors dans l'application mail par défaut de l'utilisateur. Vous pouvez rendre ce formatage simple ou complexe, comme dans le cas du mail, en indiquant automatiquement un objet, un corps de texte, une adresse cc, ... Mais là encore, une certaine connaissance du langage html est nécessaire. Nous nous référons ici à :
- Lien internet : https://www.w3schools.com/html/html_links.asp
Mail address: https://mailtolink.me (for example: mailto:support@klubs.be?cc=admin@klubs.be&subject=Release%20note&body=This%20is%20a%20mail%20link%20with%20a%20formatted%20CC%2C%20subject%20and%20body.%0D%0A-%20with%20a%20bullet%0D%0A-%20and%20an%20other%20bullet%0D%0A
Image 🏔
L'ajout d'une image se fait via l'éditeur - Insérer une image. Via Charger une image, vous pouvez récupérer une image sur votre bureau et l'insérer.
Image avec Image avec pour les mailings à éditer à 600 pixels Cliquez sur l'image pour afficher l'édition de l'image.
- Toutes les images sont chargées en taille réelle
- Vous pouvez modifier les dimensions via Image edit
Optimal pour les mailings - Avec 600 (la hauteur change en conséquence)
Résolution de l'image Résolution de l'image pour les envois éditables à 72 dpi Unoutil d'image simple est probablement nécessaire pour cela.
Ligne horizontale -
Il s'agit d'une mise en forme simple mais utile pour diviser un texte en douceur
Editeur HTML 🛡
Dans l'éditeur de texte, ce bouton permet d'effectuer une vérification HTML simple directement dans l'éditeur.
Pour acquérir des connaissances de base en HTML – w3school.
Format HTML
Il est également possible de mettre en forme un e-mail entièrement en HTML.
Avec des possibilités de conception étendues, telles que l'identité visuelle et l'image de marque, une meilleure structure et mise en page, un taux de conversion plus élevé,
Des outils qui peuvent vous aider dans cette démarche :
- Litmus
- IA : Claude, Gemini, ChatGPT
Il convient toutefois de faire preuve de prudence. Si un e-mail au format HTML n'est pas correctement structuré, il risque d'atterrir dans le dossier spam ou d'apparaître illisible pour le destinataire :
- Spam
Les fournisseurs de messagerie (tels que Gmail, Outlook et Yahoo) analysent rigoureusement les codes HTML. - Le rapport image/texte
Pas une seule grande image avec du texte caché derrière celle-ci - Un code de mauvaise qualité = spam
Un code HTML mal écrit et des balises erronées déclenchent immédiatement les filtres anti-spam -
Copier du code directement depuis Microsoft Word = spam - Gmail – Outlook
Ce qui s'affiche parfaitement dans Gmail peut s'afficher de manière complètement déformée dans le client Outlook du destinataire - 1999 Code
Codez comme en 1999 : tableaux, CSS en ligne, … - Version en texte brut
Joignez toujours une version en texte brut à votre campagne HTML - Tests
Envoyez des e-mails de test vers différents appareils (iPhone, Android) et clients de messagerie (Outlook, Gmail).