Qu'est-ce qu'une maquette de site internet ?
Une maquette est une image fidèle de ce que sera une page de votre site, réalisée avant toute programmation. Elle montre la disposition des blocs, les couleurs, les polices, les images et, idéalement, les vrais textes.
On distingue souvent trois niveaux, que les prestataires n'utilisent pas tous :
- Le zoning ou wireframe : un schéma en noir et blanc, fait de rectangles, qui indique seulement où se placent les éléments. Il sert à valider la structure d'une page.
- La maquette graphique : la page telle qu'elle apparaîtra, avec l'identité visuelle complète. C'est ce que l'on appelle le plus souvent « la maquette ».
- Le prototype : une maquette cliquable, qui simule la navigation entre les pages sans être un vrai site.
Sur un site vitrine, le zoning et la maquette graphique sont souvent fusionnés en une seule étape. Sur un projet plus complexe, comme une boutique ou un parcours de réservation, les trois niveaux ont chacun leur utilité.
À quoi sert une maquette dans un projet ?
Elle sert d'abord à décider vite. Il est bien plus simple de comparer deux dispositions de page à l'écran que de reconstruire une page déjà développée pour voir si l'autre version fonctionne mieux.
Elle sert ensuite de référence commune. Une fois validée, la maquette devient le document qui dit à quoi le site doit ressembler. Si le résultat développé s'en écarte, vous avez un point de comparaison concret pour le signaler.
Elle sert enfin à révéler les problèmes de contenu. En voyant une page mise en forme, on remarque qu'un titre est trop long, qu'un service manque de photos, ou que le bouton de contact arrive trop bas. Ces constats sont difficiles à faire sur un document texte.
Dans l'enchaînement global, la maquette arrive après le cadrage et la rédaction, et avant le développement. Nous détaillons cet ordre dans l'article sur les étapes de création d'un site.
Faut-il une maquette pour chaque page ?
Non, et c'est rarement le cas. On maquette en général la page d'accueil et un ou deux modèles de pages intérieures, puis les autres pages reprennent ces modèles.
Prenons un site vitrine de six pages pour un cabinet de kinésithérapie. La page d'accueil a sa propre maquette, car elle présente tout le cabinet. Les pages consacrées à chaque spécialité (rééducation du sport, du dos, suivi post-opératoire) suivent le même gabarit : une seule maquette suffit pour les trois. La page contact, plus simple, peut ne pas être maquettée du tout.
Il faut aussi penser au mobile. Une maquette sur ordinateur ne dit pas tout de l'affichage sur téléphone, où les blocs s'empilent verticalement. Demandez à voir au moins la page d'accueil en version mobile, puisque c'est souvent sur ce format que vos clients vous découvrent.
Les éléments répétés sur toutes les pages, comme l'en-tête avec le menu et le pied de page avec les coordonnées, sont validés une seule fois. Prenez le temps de bien les regarder : ils apparaîtront partout, et une erreur à cet endroit se multiplie sur l'ensemble du site.
Comment donner un retour utile sur une maquette ?
Un bon retour décrit un problème et son effet, plutôt qu'une solution. « Le numéro de téléphone ne se voit pas assez, alors que mes clients appellent surtout » est plus utile que « mettez le téléphone en rouge ».
Pour structurer votre relecture, posez-vous ces questions dans l'ordre :
- En cinq secondes, comprend-on ce que fait l'entreprise et pour qui ?
- L'action principale (appeler, demander un devis, réserver) est-elle visible sans chercher ?
- L'impression générale correspond-elle à la manière dont vous voulez être perçu ?
- Les informations sont-elles justes : services, zone, horaires ?
- Y a-t-il un détail qui vous gêne, et pouvez-vous dire pourquoi ?
Regroupez vos remarques en une seule fois. Des retours envoyés au fil de l'eau, sur plusieurs jours, allongent le projet et rendent les arbitrages difficiles. Si plusieurs personnes doivent donner leur avis (un associé, un conjoint), réunissez-les avant de répondre.
Enfin, distinguez ce qui relève du goût et ce qui relève de l'efficacité. Une couleur qui ne vous plaît pas mérite d'être signalée. Mais un choix que vous trouvez simplement inhabituel peut avoir une raison : demandez-la avant de le refuser.
Quelles erreurs éviter au moment de valider ?
La plus fréquente consiste à valider une maquette remplie de faux texte. Sans les vrais contenus, vous validez une forme vide, et les surprises arrivent au moment du développement.
Voici les autres pièges courants :
- Juger sur un petit écran seulement : regardez la maquette sur un ordinateur à taille réelle, puis sur mobile si une version existe.
- Demander d'ajouter tout ce qu'on voit ailleurs : un carrousel, une vidéo, une animation. Chaque ajout doit servir l'objectif du site.
- Valider par politesse : si quelque chose vous dérange, dites-le maintenant. Après, c'est plus long et parfois facturé.
- Oublier votre identité existante : si vous avez un logo et des couleurs, vérifiez qu'ils sont respectés. Nous abordons ce sujet dans l'article sur le logo et la charte graphique.
Une validation claire, écrite, par exemple un message qui dit « maquette validée, on passe au développement », protège aussi bien le client que le prestataire.
Une maquette est-elle toujours nécessaire ?
Une étape de validation visuelle est toujours nécessaire, mais elle ne prend pas forcément la forme d'une maquette séparée. Certains prestataires construisent directement une première version du site, que vous consultez sur une adresse de prévisualisation.
Cette approche a un avantage : vous voyez le vrai site, sur votre vrai téléphone, avec les vraies interactions. Elle suppose en revanche des outils qui permettent de modifier rapidement la mise en page, et un design suffisamment cadré en amont.
Le choix dépend aussi du type de design. Un site construit à partir d'un thème existant laisse moins de place à la maquette, puisque la structure est déjà fixée. Un design entièrement sur mesure en a davantage besoin. Nous comparons ces deux approches dans l'article site sur mesure ou template.
Ce qui compte, quel que soit le format : vous devez voir et approuver l'apparence du site avant qu'il soit finalisé, avec un nombre de retours clairement annoncé.
Comment OSEOO gère-t-il la validation du design ?
Chez OSEOO, la validation du design se fait dans un espace client en ligne, comme les autres validations du projet. Cela évite les échanges de mails dispersés et accélère les allers-retours.
Comme les textes sont rédigés par OSEOO avant la mise en forme, vous relisez des pages avec leurs vrais contenus, jamais des blocs de faux texte. Le design est adapté à votre marque dans la formule Express et entièrement sur mesure dans la formule Standard.
C'est l'une des raisons pour lesquelles le délai moyen reste d'une semaine pour ces deux formules. Vous pouvez voir le détail sur la page création de site.
Questions fréquentes
Quel logiciel sert à faire une maquette de site ?
Les prestataires utilisent des outils de conception d'interface, dont plusieurs fonctionnent directement dans le navigateur. Vous n'avez pas besoin de les maîtriser : un lien de consultation suffit en général pour voir la maquette et commenter. Certains prestataires montrent directement une version de prévisualisation du site.
Combien de modifications peut-on demander sur une maquette ?
Cela dépend du contrat. Beaucoup de prestataires incluent un ou deux tours de retours, puis facturent les suivants. Vérifiez ce point dans le devis avant de commencer, et regroupez vos remarques pour tirer le meilleur de chaque tour.
La maquette m'appartient-elle ?
Cela dépend des conditions de cession prévues au contrat. En général, elle est liée au projet et sert à construire votre site. Si vous envisagez de la réutiliser ailleurs, posez la question avant de signer et faites préciser ce point par écrit.
Peut-on changer de couleurs après la validation de la maquette ?
Techniquement, c'est souvent simple sur un site bien construit, car les couleurs sont définies à un seul endroit. Mais c'est une demande hors validation, que le prestataire peut traiter comme une modification supplémentaire. Mieux vaut trancher la palette au moment de la maquette.