Réorganiser les colonnes/le contenu sur mobile

Pourquoi la réorganisation des colonnes sur les appareils mobiles est importante

Par défaut, les colonnes de une ligne disposée horizontalement sur le bureau s'empilera normalement verticalement sur un mobile. Cependant, il arrive parfois que l'ordre automatique des colonnes ne corresponde pas à la mise en page souhaitée. 

Par exemple :

Vous êtes propriétaire d'une boutique Shopify. Vous avez conçu une mise en page de bureau avec une ligne à 2 colonnes :

• Colonne 1 – L’image
• Colonne 2 – Réflexion d’expert et bouton CTA

Sur un ordinateur de bureau, cette mise en page est fluide. Mais sur un appareil mobile, le contenu s'empile verticalement par défaut. Voici le problème :

• L'image apparaît en premier, mais les témoignages apparaissent avant le bouton CTA, pousser le CTA plus bas sur la page.
• Les utilisateurs peuvent perdre tout intérêt avant d’atteindre le CTA, affectant les taux de conversion.

Lorsque votre page passe du bureau au mobile, le fait de garantir l'ordre correct des colonnes permet de maintenir le flux et la lisibilité. 

Une mise en page mobile bien organisée améliore l'expérience utilisateur, facilitant la navigation et l'interaction des visiteurs avec votre contenu. 

Voici comment vous pouvez réorganiser les colonnes sur mobile en quelques étapes simples :

Comment réorganiser les colonnes sur mobile (étape par étape)

Étape 1 : Commencez par ouvrir votre page dans le Éditeur GemPagesAccédez à la ligne où se trouve le contenu que vous souhaitez réorganiser.

Étape 2 : Sélectionnez la vue mobile.

Étape 3 : Cliquez sur la ligne contenant les colonnes que vous souhaitez ajuster. Le panneau de configuration de la ligne s'affiche alors sur le côté gauche de l'éditeur.

Étape 4 : Réorganiser les colonnes qui convient le mieux à la disposition de votre mobile. 

Cela vous donne un contrôle total sur la façon dont le contenu apparaît dans une pile verticale.

Étape 5 : Après avoir confirmé le nouvel ordre de vos colonnes, cliquez sur 'Sauvegarder' et alors 'Publier' vos modifications pour les appliquer en direct sur votre site.

Derniers conseils

• Testez votre mise en page sur plusieurs tailles d'écran mobile pour les meilleurs résultats.
  
• Rester CTA et messages clés au-dessus du pli pour une meilleure visibilité.
  
• Considérer duplication de lignes pour ordinateur de bureau ou mobile si la logique de mise en page devient trop complexe.