Éléments
Textes
Textes
Un texte est en HTML, “image” ou “background-image” en fonction de son style & de son positionnement.
Si un texte a un élément au dessus de lui, il sera alors généré en background-image.
Si un texte a les éléments suivants, il sera généré en image :
→ Une opacité ≠ 0
→ Un background-image
→ Une bordure
→ Une rotation
Sinon il sera généré en HTML (👌 Le meilleur)
Intégré en HTML/CSS
Calcul de la taille de la zone de texte
Splite intègre votre zone de texte & y intègre le texte à l’intérieur.
Pour définir la taille de la zone de texte, Splite regarde :
→ la largeur de la zone de texte sur Sketch ou Figma
→ la hauteur du texte réel (et non de la zone de texte) sur Sketch ou Figma
Prévoir les retours à la ligne
Si vos textes sont amenés à évoluer (ex : pour du multi-langue ), nous vous conseillons de bien prévoir la largeur de la zone de texte pour avoir des retours à la ligne satisfaisants.
En l’exemple ci-dessous, si on ajoute le mot “dolor”. Il s’affiche bien sur la même ligne dans le 1er cas alors qu’il retourne à la ligne sur le second à cause de la taille de la zone de texte.
🚨 Splite vous demande de ne pas avoir de texte en “Auto Width”
Intégré en image
Pour l’intégration des emails, Splite est obligé de transformer votre texte en image s’il contient certaines balises.
Une part importante des clients mails ne connaissent pas les balises “Opacité”, “Rotation”, “background-gradient”. Si votre texte contient l’une d’elle, il sera alors transformé en image.
Cas des typographies non natives
Une part importante des clients mails ne connaissent pas également la balise permettant d’afficher une police non standard (voir la liste des typos natives).
Si vous voulez utiliser des typographies non natives, Splite vous laisse le choix de l’intégration :
→ en image
→ en HTML
Referez-vous à la section “Option d’intégration” pour plus de détails
Intégré en “background-image”
Si un élément chevauche le texte ce dernier sera transformé en image de fond (background-image)
🚨 Attention, ce chevauchement peut toucher la zone de texte et non le texte directement. Il sera donc invisible à l’oeil nu sur Sketch
Want to print your doc?
This is not the way.
This is not the way.
Try clicking the ⋯ next to your doc name or using a keyboard shortcut (
CtrlP
) instead.