La maquette repose sur plusieurs agencements qui doivent être examinés à mesure que la largeur disponible de l'écran change. La section hero superpose une grande typographie blanche, un logo, un panneau coloré et un élément décoratif circulaire sur une photo d'intérieur ; l'échelle de l'image et l'équilibre entre le texte et l'image sont donc particulièrement importants sur les largeurs réduites. Si le panneau ou le cercle décoratif change de position, le message commercial initial pourrait perdre sa priorité visuelle.
Les sections « À propos », « Ce que nous faisons », « Notre objectif » et « Nos projets » adoptent des compositions scindées alternées. Leur présentation nécessite suffisamment d'espace pour que le texte explicatif et les images au format portrait ou d'intérieur restent bien distincts, tandis que le corps de texte compact et les espacements asymétriques créent le rythme recherché. Une revue responsive doit comparer la manière dont ces blocs scindés s'empilent, l'espace vide restant autour des titres et le maintien d'un lien clair entre les actions répétées « En savoir plus » et leurs sections respectives.
La section « Gestion de salon » introduit une image pleine largeur avec du texte centré, créant une densité différente de celle des blocs scindés. La section de contact constitue une autre zone délicate, car le formulaire, l'arrière-plan de mobilier et l'incrustation colorée doivent rester parfaitement lisibles ensemble. Enfin, le pied de page sombre dédié aux réseaux sociaux rassemble téléphone, fax, e-mail et cinq liens sociaux dans une seule barre de clôture. Ces variations d'images, de typographie, de formulaire et de densité de contact sont les principaux aspects à inspecter lors de l'évaluation de cette conception en tant que maquette de site responsive.
Lorsque vous utilisez Générateur de maquette de site Web, vous pourrez ajuster les couleurs, les polices, l'en-tête et le texte, la mise en page, les colonnes et autres éléments de conception, ainsi que le contenu et les images.
Utilisez les modes responsifs pour visualiser l'affichage du site web sur les grands écrans, les ordinateurs de bureau, les ordinateurs portables, les tablettes et les téléphones. Basculez entre les différents modes d'affichage pour comparer la mise en page sur différentes largeurs d'écran et observer comment la typographie, les images, l'espacement, la navigation et les autres contenus s'adaptent à chaque appareil.
Nicepage propose des outils de conception web responsive pour ajuster l'affichage sur chaque appareil lorsque la mise en page initiale nécessite des améliorations. Vous pouvez personnaliser les vues mobiles séparément, modifier la taille et la position des éléments, adapter les grilles, les listes et les galeries, et masquer certains éléments ou blocs sur certaines tailles d'écran. Cela permet de développer une maquette de site web responsive au lieu d'évaluer le design sur une seule taille d'écran fixe.
Utilisez Aperçu en direct pour examiner la conception sans l'interface d'édition. L'aperçu instantané masque le navigateur de pages, le panneau des propriétés, les sélections et les cadres, facilitant ainsi l'évaluation de la présentation générale, de la hiérarchie du contenu et de la mise en page adaptative, telles qu'elles apparaîtraient à un visiteur.
Ce processus rend le modèle utilisable comme maquette de site web adaptatif pour visualiser, comparer et optimiser l'affichage d'un même site web sur différentes tailles d'écran.