---
title: "Outil de maquette de site web : Lequel utiliser gratuitement ?"
url: https://www.matosordi.com/outil-maquette-site-web.html
author: "Matos Ordi"
date_published: 2022-09-02T12:26:20+00:00
date_modified: 2026-09-26T11:34:11+00:00
categories: ["Web"]
image: https://www.matosordi.com/wp-content/uploads/2022/09/ga0821599bb9ace2d42e10d6dadc972729892a6f593128e533ce61c7e52d7d9c1193fd9a06c130ef078a8390c396e422aaf33f668713bcb74be860717b0495ea4_640.jpg
description: "Fil de fer, maquette graphique et prototype cliquable ne servent pas au même moment ; Figma, Penpot ou même le papier suffisent pour démarrer."
site: "Matos Ordi"
license: "Reproduction autorisée avec lien vers la source."
---

# Outil de maquette de site web : Lequel utiliser gratuitement ?

> Fil de fer, maquette graphique et prototype cliquable ne servent pas au même moment ; Figma, Penpot ou même le papier suffisent pour démarrer.

Avant de coder un site, il faut le montrer au client. C'est là que trois types d'outils entrent en jeu, et ils ne servent pas au même moment du projet : la maquette fil de fer, la maquette graphique, et le prototype cliquable.

## Maquette fil de fer, maquette graphique, prototype : la différence

La maquette fil de fer (ou wireframe) pose la structure d'une page sans couleur ni typographie définitive : où va le menu, où va le bloc de contenu principal, où se place le bouton d'action. Elle sert à valider l'organisation avant de perdre du temps sur l'esthétique.

La maquette graphique reprend cette structure et lui donne un rendu visuel complet : couleurs, polices, images, icônes. C'est ce que le client voit habituellement comme « le design du site », mais elle reste une image fixe, pas un site fonctionnel.

Le prototype cliquable relie plusieurs maquettes graphiques entre elles pour simuler la navigation : cliquer sur un bouton fait passer d'un écran à l'autre, comme sur le futur site. C'est l'étape la plus proche du produit final avant le développement réel, et souvent celle qui permet de repérer les problèmes d'ergonomie.

  **Pourquoi ne pas sauter directement à la maquette graphique**

Commencer par le fil de fer évite de refaire tout le design si la structure de la page ne convient pas. Un client qui découvre en premier les couleurs a du mal à juger l'organisation du contenu, il commente le visuel plutôt que la structure.

## Des outils gratuits ou avec une offre gratuite

Plusieurs outils permettent de créer ces maquettes sans payer, au moins pour démarrer. Figma propose une offre gratuite suffisante pour un projet individuel ou une petite équipe, avec fil de fer, maquette graphique et prototype cliquable dans un même outil. Penpot est un outil libre et gratuit, une alternative intéressante quand on veut éviter de dépendre d'un service propriétaire. D'autres outils comme Adobe XD, InVision, Marvel ou Framer offrent aussi des versions gratuites ou des essais, chacun avec ses habitudes d'interface.

  **Le papier reste un outil de maquette valable**

Pour un premier jet de structure, dessiner les écrans à la main sur papier permet d'itérer très vite avec un client, sans même ouvrir un logiciel. C'est souvent l'étape zéro avant de passer au fil de fer numérique.

## Comment choisir son outil

Le meilleur outil est souvent celui que l'équipe de conception maîtrise déjà, ou celui que le client peut consulter facilement sans installer de logiciel. Comme la plupart de ces outils proposent une offre gratuite, tester deux ou trois solutions sur un petit projet avant de choisir reste la meilleure méthode : chacun a ses raccourcis, sa bibliothèque de composants et sa façon de gérer la collaboration en temps réel.

  **Impliquer le client tôt dans le choix de l'outil**

Un client qui peut ouvrir le lien du prototype sans créer de compte donne des retours plus vite qu'un client qui doit d'abord s'inscrire sur un outil qu'il ne connaît pas.

Un point à vérifier avant de s'engager sur un outil pour un projet long : la facilité à exporter ou migrer les maquettes si l'équipe change d'outil en cours de route, et la possibilité pour le client de commenter directement sur les écrans sans créer de compte payant.

---

## À propos de l'auteur

**Matos Ordi** — La rédaction de Matos Ordi. Chaque article est vérifié avant publication, et corrigé quand une information change.