Wireframe de site web en ligne
Ajoutez les blocs dans l’ordre de la page, faites-les glisser à leur place et tirez le coin pour changer la taille. Cliquez sur un bloc pour modifier son texte.
Mode d’emploiLa maquette de la page, bloc par bloc
Disponible en: 
Wireframe de site web en ligne: à quoi ça sert
Composez la maquette de la page avec des blocs prêts à l’emploi (en-tête, bannière, titre, texte, image, bouton, cartes, formulaire, vidéo, pied de page et zone libre), faites-les glisser à leur place et tirez le coin pour changer la taille, avec un alignement tous les 10 pixels.
Choisissez la largeur ordinateur (1 200 px) ou mobile (390 px) et téléchargez le wireframe en PNG ou SVG pour le faire valider par le client.
Mode d’emploi
- Choisissez la largeur de la page.
- Ajoutez et faites glisser les blocs.
- Téléchargez le wireframe en PNG ou SVG.
Quand l’utiliser
- Faire valider la mise en page par le client.
- Planifier une landing page.
- Cours d’UX et de design.
Questions fréquentes
Qu’est-ce qu’un wireframe ?
C’est la maquette de la structure d’une page, en gris, sans couleurs, photos ni textes définitifs. Il montre où se trouve chaque élément (menu, bannière, appels à l’action, formulaire) pour valider la mise en page avec le client ou l’équipe avant de passer du temps sur le design.
Comment changer la taille d’un bloc ?
Cliquez sur le bloc et faites glisser le petit carré bleu du coin inférieur droit. Les blocs s’alignent tous les 10 pixels pour que tout reste bien droit. La touche Suppr efface le bloc sélectionné.
Puis-je faire une version mobile ?
Oui. Choisissez la largeur Mobile avant de commencer : la page fait 390 pixels de large, comme l’écran d’un téléphone courant, et les nouveaux blocs arrivent déjà à la bonne taille.
Vraiment gratuit ?
Oui, 100 % gratuit. Sans inscription, sans abonnement et sans limite d’utilisation. Tous les outils de Tools123 sont gratuits.