Mise en page à deux colonnes
Utiliser la mise en page à deux colonnes pour une vue desktop scindée qui se replie en une seule colonne sur petit écran.
Dans cet article, vous allez comprendre quand utiliser la page d'accueil à deux colonnes, comment la vue scindée se comporte selon les appareils, et quels réglages continuent de piloter le contenu.
Prérequis
- La page d'accueil de la campagne est activée.
- La vue desktop compte réellement pour cette campagne.
- Vous voulez une séparation plus nette entre le contenu d'entrée et les sections orientées participant.
Configuration
Sélectionner Two columns
Ouvrez Landing Page, utilisez le sélecteur Page Layout, puis choisissez Two columns.
Garder le contenu de gauche très lisible
Renseignez Section d'en-tête, Section des instructions et Section CTA pour que le participant comprenne l'expérience avant de parcourir le reste de la page.
Organiser les sections de droite
Réordonnez ou masquez les sections récompenses, activités, jeux et totems interactifs selon ce qui doit apparaître en premier dans la zone de navigation.
Tester en desktop puis en mobile
Vérifiez la page sur grand écran puis sur un écran plus petit. La vue scindée n'a du sens que lorsque le breakpoint desktop est actif.
Comportement desktop versus mobile
Sur grand écran, Two columns sépare le contenu d'entrée de campagne et les sections orientées participant. Sur petit écran, la mise en page se replie en une seule pile verticale.
Ce que la vue scindée met en avant
- l'en-tête et la zone d'entrée restent groupés
- les sections à parcourir disposent de leur propre espace, ce qui aide quand la campagne contient plusieurs récompenses ou points de contact
- le contenu partagé reste le même :
Two columnschange la présentation, pas le modèle de contenu
Comportement responsive
- La vue desktop scindée s'active au breakpoint desktop actuel (
min-width: 1224px). - En dessous de ce breakpoint, la page revient à une seule colonne.
- Toute page d'accueil
Two columnsdoit donc aussi être relue comme une expérience mobile.
Le bon usage
Choisissez Two columns quand la page d'accueil doit remplir deux rôles à la fois : bien introduire la campagne et laisser le participant parcourir plusieurs sections sans les enfouir sous un long bloc d'introduction.
Pour aller plus loin
Choisir une mise en page
Comparer les trois layouts avant de retenir la vue scindée.
Configurer l'en-tête
Affiner l'en-tête qui structure le côté gauche.
Configurer les instructions
Ajouter le bloc d'instructions qui complète l'entrée de campagne.
Configurer le CTA
Ajouter le CTA facultatif qui reste dans le parcours d'entrée.
Mise en page à une colonne
Revenir à la pile simple si la vue scindée n'apporte pas assez de valeur.