Comment utiliser : Générateur de trait d'union conditionnel
- Collez votre titre ou votre texte. En mode automatique, les mots dépassant la limite reçoivent des traits d'union conditionnels aux coupures syllabiques probables.
- Pour un contrôle total, saisissez le marqueur (par défaut
|) à l'endroit où un mot peut être coupé, par exempleVersicherungs|leistungen. - Faites glisser la largeur d'aperçu pour voir comment le texte se répartit sur les petits écrans : un tiret n'apparaît que lorsque le mot est effectivement coupé.
- Copiez le résultat en texte (caractères invisibles, idéal pour Webflow et les champs CMS) ou en HTML avec les entités
­.
Qu’est-ce qu’un trait d’union conditionnel ?
Le trait d’union conditionnel (Unicode U+00AD, entité HTML ­) est un caractère invisible qui marque un saut de ligne possible à l’intérieur d’un mot. Si le mot tient sur la ligne, rien n’apparaît. Dans le cas contraire, le navigateur coupe le mot à cet endroit et affiche un tiret. C’est la solution la plus propre pour les mots composés longs, fréquents en allemand (« Kundenzufriedenheitsanalyse »), qui débordent de leur conteneur ou font mauvais effet dans les grands titres mobiles.
Trait d’union conditionnel, espace de largeur nulle et CSS hyphens
| Technique | Affiche un tiret ? | Idéal pour |
|---|---|---|
­ trait d’union conditionnel | Oui, uniquement en cas de coupure | Mots longs dans les titres et le corps de texte |
| Espace de largeur nulle (U+200B) | Non | URL, adresses e-mail, chemins de fichiers, barres obliques |
CSS hyphens: auto | Oui | Corps de texte, mais nécessite un attribut lang correct et un dictionnaire du navigateur, sans contrôle précis |
CSS overflow-wrap: anywhere | Non | Filet de sécurité de dernier recours ; peut couper les mots à des endroits disgracieux |
Utiliser les traits d’union conditionnels dans Webflow
Les champs texte de Webflow ne permettent pas de saisir ­, qui s’afficherait tel quel. Copiez le résultat sous forme de texte avec caractères invisibles et collez-le dans le champ titre, texte enrichi ou CMS : les traits d’union conditionnels suivent invisiblement et fonctionnent immédiatement sur le site publié. Pour les supprimer plus tard, collez le texte ici et cliquez sur « Supprimer les caractères invisibles ».
À propos du mode automatique
Le mode automatique applique des règles syllabiques simples (transitions voyelle–consonne) pour proposer des points de coupure, en conservant au moins trois lettres de chaque côté. Il convient bien aux titres, mais ce n’est pas un dictionnaire de césure complet : vérifiez les mots importants dans l’aperçu, ou placez vous-même les coupures avec le marqueur pour un résultat parfait.
Aussi recherché comme : trait d'union conditionnel, ­, caractère soft hyphen, espace de largeur nulle, zwsp, coupure de mots mobile, césure des mots, mot trop long mobile.
Outils complémentaires : Générateur de trait d'union conditionnel
- Guillemets courbes en droits — Le code copié depuis Slack, Notion, Word ou un blog ne fonctionne pas ?
- Convertisseur de casse — Collez n'importe quel texte et convertissez-le selon l'une des 11 conventions de casse disponibles — de la casse « Title Case » pour les titres à « camelCase » et « snake_case » pour le code.
- Compteur de mots — Collez ou saisissez votre texte pour compter en temps réel le nombre de mots et de caractères, ainsi que la durée de lecture et de prononciation, la densité des mots-clés et la longueur des titres, méta-descriptions et publications sur les réseaux sociaux à des fins de référencement.
- Encodeur d'entités HTML — Échappez < > & " pour afficher du texte en sécurité dans une page HTML, convertissez les accents et symboles en entités nommées ou numériques, ou décodez un HTML rempli d'entités pour retrouver le texte brut.
Questions fréquentes
Comment saisir un trait d’union conditionnel ?
­. Dans les éditeurs qui n’acceptent pas les entités (Webflow, Figma, la plupart des champs CMS), copiez le caractère depuis cet outil : il est invisible mais bien présent. Sous Windows, vous pouvez aussi taper Alt+0173.