Texte 3-colonnes¶
Trois champs texte côte à côte, chacun sur un tiers de la largeur du conteneur. Sur les petits écrans, ils s'empilent.
Comment cela apparaît sur le site¶
Trois champs texte côte à côte, chacun un tiers de la largeur du conteneur. Sur mobile, ils s'empilent (Colonne 1 en haut).
Champs¶
| Champ | Type | Obligatoire | Contenu |
|---|---|---|---|
| Colonne 1 | Éditeur de texte avec mise en forme | Oui* | Contenu de la colonne de gauche. |
| Colonne 2 | Éditeur de texte avec mise en forme | Oui* | Contenu de la colonne du milieu. |
| Colonne 3 | Éditeur de texte avec mise en forme | Oui* | Contenu de la colonne de droite. |
*Techniquement optionnel mais des colonnes vides laissent un blanc — remplissez toujours les trois colonnes.
Comment cela s'affiche¶
- Desktop : colonnes côte à côte, chacune sur un tiers de la largeur du conteneur.
- Tablette/mobile : colonnes l'une sous l'autre, chacune sur toute la largeur. Colonne 1 en haut.
- Chaque colonne est un champ texte complet avec mise en forme — gras, listes, liens, sous-titres.
Quand l'utiliser¶
- Trois services / trois produits / trois départements présentés brièvement.
- Trois étapes où l'ordre est moins important (sinon utilisez Pas-à-pas).
- Trois chiffres-clés ou valeurs en énumération horizontale.
Quand ne pas l'utiliser¶
- Pour un texte long — les colonnes deviennent trop étroites et difficiles à lire.
- Pour deux éléments — utilisez Texte 2-colonnes (plus symétrique).
- Pour du texte avec des images — utilisez Photo + texte ou les cartes Produits.
Conseils¶
- Gardez les trois colonnes de même longueur et même poids. L'œil le lit comme un ensemble.
- Puces plutôt que prose marche souvent mieux — trois courtes énumérations côte à côte.
- Pas de listes imbriquées complexes — la largeur de colonne sur desktop est déjà limitée.