Identifier quel titre devient difficile à lire
Ouvrez la page publique sur un téléphone et repérez le titre exact. Il peut s’agir du titre de la page, d’un titre dans le contenu ou du nom du site dans l’en-tête. Notez si les mots sont coupés, si les lignes se chevauchent, si le texte déborde de l’écran ou si le titre prend trop de place. Le traitement dépend de ce symptôme. Un titre tronqué sur la droite appelle d’abord un examen de son conteneur. Des lignes qui se touchent invitent à examiner l’interligne.
Prenez deux captures de la même adresse, sur téléphone et sur ordinateur. Gardez le début de la section suivante dans le cadre. Un titre qui s’affiche entièrement peut tout de même repousser loin l’information que le visiteur cherche. À l’inverse, deux ou trois lignes bien espacées peuvent être une présentation normale pour un titre long. Comparez à une page du site où la hiérarchie est déjà claire.
Ouvrez ensuite le document dans Pages ou Articles > Modifier. Le champ du titre du document fournit le texte que le modèle peut afficher avec le bloc Titre de la publication. Un bloc Titre inséré dans le corps s’édite directement à cet endroit. Pour les distinguer, utilisez la Vue en liste et sélectionnez le titre qui correspond à votre capture. Si le titre est dans l’en-tête partagé, vérifiez son emplacement dans l’Éditeur de site ou dans les réglages du thème.
Avant l’essai, notez le niveau du titre, sa taille, son interligne et le nom de son conteneur. Gardez le réglage de départ sur une capture si plusieurs valeurs sont héritées. Vous pourrez ainsi revenir au même périmètre sans perdre une correction de texte faite entretemps.
Donner au texte la place nécessaire
Sélectionnez le groupe ou la colonne qui contient le titre. Dans Réglages > Bloc, examinez Disposition et Dimensions, selon les commandes proposées. Un remplissage latéral important peut laisser peu de largeur au texte. Un titre dans une rangée avec un bouton ou une image peut n’occuper qu’une partie de la fenêtre. Observez d’abord ces contraintes avant de réduire la police.
Dans une copie, réduisez un remplissage latéral excessif ou essayez une disposition empilée lorsque le titre et le bouton se disputent la largeur. Comparez la position des deux éléments sur ordinateur. Si la composition exige une rangée sur grand écran, utilisez l’option de retour à la ligne ou d’empilement du bloc lorsque votre interface la propose. Avec un constructeur, vérifiez ses contrôles d’alignement et de largeur par appareil dans la section du composant concerné.
Vérifiez aussi les sauts de ligne ajoutés à la main. Un saut placé pour équilibrer deux lignes sur ordinateur peut donner trois ou quatre lignes inégales sur téléphone. Retirez le saut dans le brouillon et laissez la phrase se répartir selon la largeur. Les espaces insécables utiles à la ponctuation peuvent être conservées. Si plusieurs mots ont été attachés ensemble pour imposer une présentation, rétablissez les espaces ordinaires à l’endroit où une coupure naturelle est possible.
Un terme long ou une référence produit peut dépasser même avec une largeur correcte. Examinez si ce terme peut être placé dans un sous-titre ou si une formulation courte garde le sens. Lorsque le titre public et le titre du document correspondent au même champ, vérifiez l’effet de la réécriture dans les listes et les liens qui reprennent automatiquement ce texte. Conservez une formulation claire en dehors de la page elle-même.
Essayer d’abord les tailles proposées par le thème
Sélectionnez le bloc Titre puis ouvrez Réglages > Bloc > Styles > Typographie, ou cherchez directement Typographie dans le panneau selon la version. Le menu de la section affiche les contrôles supplémentaires disponibles. Relevez la taille actuelle. Si elle a été saisie manuellement, essayez de retirer cette valeur pour voir la taille fournie par le thème. Vérifiez la différence sur le même titre et sur la même largeur.
Les tailles proposées sous des noms ou lettres, comme M, L ou XL, correspondent aux choix du site. Un thème peut faire évoluer certaines tailles selon la largeur de la fenêtre. Le nom de la taille seul ne garantit pas ce comportement. Essayez un préréglage puis comparez le même titre à deux largeurs. Si la taille s’adapte et convient à la hiérarchie, cette solution évite d’ajouter une règle particulière à la page.
Si les préréglages donnent un texte encore trop grand, essayez une taille personnalisée compatible avec la composition. Vérifiez son unité et son effet en agrandissant le texte dans le navigateur. Une taille qui donne une ligne parfaite sur un seul téléphone peut devenir inadéquate dans une fenêtre plus petite ou avec une police de remplacement. Cherchez une lecture stable, même si le nombre de lignes varie.
Gardez le niveau sémantique du titre. Le niveau H2 peut rester H2 lorsque sa taille visuelle diminue. Vérifiez l’onglet Structure dans la vue du document lorsque vous avez un doute sur l’enchaînement des titres. Si vous corrigez le titre principal d’un document, vérifiez aussi qu’un titre semblable n’est pas affiché une deuxième fois dans le corps. La bonne taille dépend de la fonction de chaque titre, pas de la présence de plusieurs versions du même texte.
Régler l’interligne, l’espacement des lettres et le contraste
Un titre sur deux lignes peut rester difficile à lire même quand sa taille est raisonnable. Dans Typographie, cherchez Hauteur de ligne ou Interligne parmi les commandes disponibles. Augmentez légèrement la valeur si des accents et des lettres se touchent. Comparez un titre court et un titre de plusieurs lignes. L’objectif est de séparer les lignes sans donner l’impression que chaque ligne est un titre indépendant.
Examinez ensuite l’espacement des lettres. Les majuscules très espacées peuvent multiplier les retours à la ligne sur téléphone. Un espacement trop serré peut aussi rendre les mots difficiles à distinguer. Si l’éditeur permet de revenir à la valeur du thème, essayez ce retour avant de choisir une valeur personnalisée. Gardez un exemple contenant des lettres accentuées, un nombre et une ponctuation pour juger la lecture réelle.
Sur une couverture, vérifiez la zone exacte de l’image derrière le texte à chaque largeur. Quand l’image se recadre, le titre peut passer d’un fond sombre à un fond clair. Ajustez le fond ou le voile du bloc Couverture si le contraste est en cause. Une augmentation de taille seule ne résout pas un texte qui se confond avec son image. Essayez aussi un affichage sans image quand la fonction du bandeau le permet.
Si seule la page publique affiche une forme de caractères différente, comparez la police réellement chargée avec celle de l’éditeur. Une police de remplacement peut être plus large et produire plus de lignes. Identifiez cette différence avant d’enregistrer une taille compensatoire. Gardez dans vos notes le titre, la largeur de fenêtre et la police observée pour que la personne qui maintient le site puisse reproduire le cas.
Choisir une correction locale ou une règle de modèle
Si le problème concerne un seul titre dans le corps d’une page, corrigez le bloc dans ce document. Si le titre de chaque article est trop grand, examinez le modèle d’article. Avec un thème de blocs et les droits requis, ouvrez Apparence > Éditeur > Modèles, puis le modèle effectivement utilisé. Sélectionnez le bloc Titre de la publication dans la Vue en liste. Modifiez sa typographie ou le conteneur commun et contrôlez des articles avec des titres de longueurs différentes.
Vous pouvez aussi examiner Apparence > Éditeur > Styles > Blocs. Vérifiez le type exact du bloc avant de changer une valeur commune. Un réglage global des blocs Titre peut toucher les titres de section et les composants répétés dans tout le site. Vérifiez un article, une page et une zone partagée dans l’aperçu. Si seul un modèle présente le défaut, une modification dans ce modèle permet de limiter l’effet aux documents qui l’utilisent.
Avec un thème classique, Apparence > Personnaliser peut proposer des réglages typographiques. Les options varient selon le thème. Avec un constructeur, cherchez la typographie du titre puis les commandes par appareil réellement disponibles. Commencez par noter les valeurs de chaque affichage. Une modification mobile peut hériter d’une valeur d’ordinateur ou remplacer seulement un paramètre. Vérifiez cet héritage avant de modifier les autres tailles.
Si vous ne disposez que des droits d’édition du contenu et que le titre appartient au modèle, fournissez à l’administrateur l’adresse, la capture et le nom du modèle. Indiquez si le titre déborde ou si ses lignes se chevauchent. Ces deux observations l’orientent vers des commandes différentes et lui permettent de préparer un essai ciblé.
Ajouter une règle locale si les commandes du bloc ne suffisent pas
Sur un site maintenu par une personne à l’aise avec le CSS, une classe réservée à un titre particulier peut convenir lorsque le bloc ne propose aucune taille adaptée sur l’ensemble des largeurs. Dans le bloc concerné, ouvrez Avancé > Classe(s) CSS additionnelle(s), si ce champ existe, et saisissez titre-adaptatif sans point. Vérifiez qu’aucun autre élément du site n’emploie déjà cette classe. Retirez une taille locale explicite si elle bloque l’essai, après l’avoir relevée.
La personne chargée du site peut placer la règle dans la zone CSS additionnel offerte par les Styles de l’Éditeur de site, dans Personnaliser si le thème classique expose ce panneau, ou dans la feuille de styles maintenue du site. Essayez-la d’abord dans une copie. L’exemple fixe une taille relative à la taille de texte de référence du site et laisse le titre se répartir sur plusieurs lignes. Ajustez cette taille au texte et à sa place dans la page.
Vérifiez que la classe s’applique au titre prévu et que le navigateur indique la règle comme active. Si le titre reste inchangé, inspectez le sélecteur et les styles prioritaires au lieu de forcer la règle avec une priorité générale. Pour revenir à l’état initial, retirez la règle et la classe, puis restaurez la taille locale éventuellement retirée. Si plusieurs modèles doivent suivre la même échelle, examinez avec le responsable les tailles fluides définies par le thème afin de les utiliser depuis l’éditeur.
.titre-adaptatif {
font-size: 1.75rem;
line-height: 1.2;
}Vérifier une série de titres sur des écrans différents
Ouvrez l’aperçu puis testez une fenêtre étroite, une largeur intermédiaire et un affichage large. Faites varier la largeur lentement autour du point où le titre change de ligne. Vérifiez qu’aucun mot ne disparaît, qu’aucune barre de défilement horizontale n’est nécessaire et que le titre reste assez visible par rapport au texte qui suit. Vérifiez au zoom jusqu’à 200 % que le texte s’agrandit, que le titre reste entier et que les commandes voisines restent utilisables. Si vous retenez un préréglage fluide du thème, refaites le même contrôle avec ce préréglage.
Si le site propose plusieurs langues, vérifiez la version qui emploie les mots les plus longs. Un titre d’une seule ligne dans une langue peut en prendre trois dans une autre. Si la correction concerne un modèle, comparez aussi une page sans image de couverture et une page avec image. Observez la position de l’action principale quand le titre passe sur plusieurs lignes. Le bouton doit rester accessible dans le déroulement normal de la page.
Après l’enregistrement validé, ouvrez la page publique avec une session visiteur. Une ancienne version peut rester visible dans un cache de page. Comparez d’abord l’adresse et le document enregistré. Si une purge ciblée est nécessaire, utilisez les commandes prévues par la configuration du site et rechargez la même page. Gardez les réglages fixes pendant cette comparaison afin d’attribuer le résultat au bon changement.
Pour annuler, restaurez la taille, l’interligne ou la disposition du bloc modifié. Pour un modèle partagé, rétablissez le réglage dans le modèle, puis vérifiez une autre page qui l’utilise. Conservez une capture du résultat et le nom du contrôle modifié. Le prochain titre très long pourra être testé avec les mêmes largeurs et les mêmes critères.
Tester le cas d’un titre long à côté d’un bouton
Une page de réservation présente le titre « Réserver une visite de l’atelier de restauration » et un bouton dans la même rangée. Sur téléphone, le titre est coupé après le mot atelier. Sélectionnez la rangée dans la Vue en liste. Dans son panneau, vérifiez si le retour à la ligne est autorisé. S’il l’est, comparez la largeur réelle des deux enfants et le remplissage de la rangée. Sur un brouillon, essayez d’empiler le titre et le bouton pour établir si la place disponible est la cause.
Si le texte s’affiche entièrement dès qu’il dispose de toute la largeur, conservez une organisation qui donne la priorité au titre sur les fenêtres étroites. Sur un thème ou constructeur qui propose ce réglage, gardez la rangée sur ordinateur et l’empilement sur téléphone. Sinon, testez une pile aux deux largeurs ou une rangée qui autorise le passage à la ligne. Vérifiez qu’en naviguant au clavier le bouton suit toujours le titre dans un ordre compréhensible.
Si le texte reste coupé même dans une pile, cherchez une hauteur fixe ou un débordement masqué sur le conteneur. Relevez la règle précise si elle vient du thème. Lorsque la cause est corrigée, gardez le texte entier et une action visible. Vous pouvez rétablir la composition initiale en replaçant la variation de groupe et les valeurs notées avant l’essai.
