Aperçu ordinateur, tablette et mobile

Plus de la moitié de vos visiteurs arriveront sur votre site depuis un téléphone. L'aperçu de l'éditeur vous montre votre page exactement comme ils la verront, avec un simple bouton pour changer d'appareil.

Basculer l'aperçu de l'ordinateur au téléphone.

Changer d'appareil#

Dans la barre d'outils de l'éditeur, au-dessus de l'aperçu, trois boutons Ordinateur, Tablette et Mobile permettent de choisir la largeur d'affichage :

Appareil	Largeur simulée
Ordinateur	1280 pixels
Tablette	820 pixels
Mobile	390 pixels (la taille d'un téléphone courant)

L'aperçu affiche la page en cours de modification, y compris les changements pas encore publiés. Il se rafraîchit automatiquement après chaque modification ; la mention « Mise à jour » s'affiche pendant le rafraîchissement. Le bouton Actualiser l'aperçu (flèche circulaire) force un rafraîchissement, et Voir le site (flèche sortante) ouvre la page publiée dans un nouvel onglet.

Le même choix d'appareil existe dans l'écran Design, pour juger vos couleurs et polices sur téléphone. Sur un téléphone, l'éditeur affiche directement la liste des sections : touchez le bouton Aperçu (icône en forme d'œil) pour voir la page entière.

Ce qu'il faut vérifier sur mobile#

Les titres ne sont pas trop longs (un titre de bannière sur quatre lignes fatigue).
Les boutons sont bien visibles et le premier mène à l'action la plus utile.
Les images sont bien cadrées : une photo très large peut paraître petite.
Les tableaux de tarifs et les galeries restent lisibles. Sinon, utilisez une variante plus compacte ou l'option Masquer sur mobile.
Le téléphone et l'adresse sont faciles à trouver.

Astuce Rien ne remplace un vrai test : une fois publié, ouvrez votre site sur votre propre téléphone. Vous pouvez même modifier votre site directement depuis le téléphone avec l'application mobile.

Le design s'adapte tout seul#

Vous n'avez pas à créer une version mobile de votre site : toutes les sections Monsiteo s'adaptent automatiquement à la taille de l'écran. Les colonnes passent les unes sous les autres, le menu devient un bouton, les textes et marges se resserrent.