Présenter un site à un client : le guide des agences et freelances web
Un beau site mal présenté perd une partie de sa valeur aux yeux du client. Bien présenté, il rassure, se valide plus vite et devient ta meilleure publicité. Voici comment mettre en scène ton travail à chaque étape d’un projet web.
Pourquoi la présentation compte autant que le site
Ton client n’est pas développeur. Il ne juge pas la qualité du code ni la structure des pages : il juge ce qu’il voit, et la façon dont tu le lui montres. Un lien envoyé par e-mail, ouvert sur un ordinateur de bureau avec une bannière cookies par-dessus, ne rend pas justice à des semaines de travail.
À l’inverse, un site présenté dans des appareils réalistes, sur mobile et sur ordinateur, montre d’emblée que le travail est abouti, qu’il s’adapte à tous les écrans et qu’il est prêt à être montré. La validation se fait plus vite, les allers-retours diminuent, et le client a envie de partager le résultat.
Les cinq moments où un bon visuel fait la différence
1. La proposition commerciale
Avant même de signer, ton futur client veut se projeter. Dans ta proposition, montre deux ou trois réalisations similaires en mockup : un site de restaurant pour un restaurateur, une boutique pour un commerçant. Une image vaut ici bien plus qu’une liste de compétences.
2. La présentation des maquettes
Quand tu présentes une première version, affiche-la dans un smartphone et un ordinateur portable plutôt que dans un logiciel de conception. Le client voit son futur site en situation et réagit sur l’essentiel : l’ambiance, la hiérarchie, les contenus. Une page encore privée peut être capturée de ton côté puis importée dans le studio.
3. La validation finale
Avant la mise en ligne, envoie un récapitulatif visuel : la page d’accueil sur les trois appareils, les pages clés en image, et une courte vidéo où la page défile. C’est un support clair pour obtenir un « c’est validé » écrit.
4. La livraison
Le jour de la mise en ligne, offre à ton client un kit de lancement prêt à publier. C’est un geste apprécié qui prend peu de temps, et qui donne de la visibilité à ton travail.
5. Le portfolio et les réseaux
Une fois le projet terminé, il devient une étude de cas dans ton portfolio et une publication sur tes réseaux. Ce sont ces visuels que verront tes prochains clients.
Le kit de livraison idéal
Voici une base simple, à adapter à chaque projet :
| Livrable | Format | À quoi il sert |
|---|---|---|
| Accueil sur ordinateur portable | PNG 16:9 | Annonce sur le site, lettre d’information, présentation |
| Accueil sur smartphone, fond transparent | PNG | À poser sur une affiche, un flyer, un visuel de marque |
| Vidéo de défilement sur smartphone | MP4 9:16 | Stories, Reels, TikTok |
| Vidéo pour le fil d’actualité | MP4 4:5 ou 1:1 | Annonce de lancement sur Instagram, Facebook, LinkedIn |
| Visuel trois appareils | PNG 16:9 | Montrer que le site s’adapte à tous les écrans |
Pour choisir les bons formats selon les réseaux de ton client, appuie-toi sur notre guide des formats par réseau social. Pour les vidéos verticales, pense à garder le texte au centre, loin des boutons du réseau.
Construire un portfolio qui convainc
Une présentation homogène
Choisis un fond, un angle et une finition d’appareil, et garde-les pour tous tes projets. Ton portfolio ressemble alors à une collection cohérente plutôt qu’à un assemblage de captures disparates. Les visiteurs se concentrent sur les sites, pas sur les différences de présentation.
Raconte chaque projet
Pour chaque réalisation, quelques lignes suffisent : le client et son métier, le besoin de départ, ce que tu as fait, le résultat. Place le visuel principal en haut, puis la version mobile, puis une ou deux pages clés.
Montre le mouvement
Une courte vidéo en boucle dans la page du projet montre la navigation mieux que dix images. Exporte-la légère, sans son, et charge-la seulement quand elle devient visible. Notre article sur la mise en valeur d’un site sur une page d’accueil ou un portfolio explique comment garder une page rapide.
Mets à jour régulièrement
Un site client évolue après la livraison. Comme la capture se fait à partir de l’adresse, il suffit de la relancer pour obtenir un visuel à jour en quelques minutes.
Sur les réseaux : publier sans gêner le client
- Demande l’accord avant de publier un projet, surtout s’il n’est pas encore en ligne. C’est aussi l’occasion de prévoir une publication commune.
- Identifie le client dans ta publication quand il est d’accord : il la partagera plus volontiers.
- Publie au bon moment : le jour de la mise en ligne, l’intérêt est à son maximum.
- Alterne les formats : une vidéo verticale le jour du lancement, un carrousel d’images la semaine suivante, une étude de cas plus tard.
Gagner du temps sur chaque projet
Préparer ces visuels à la main dans un logiciel de retouche prend des heures par projet. Avec un studio en ligne, tu colles l’adresse du site, tu choisis l’appareil et le format, et tu exportes. La capture est faite à la taille exacte de chaque appareil, sans la bannière cookies, et les appareils sont génériques et sans logo : tu peux les utiliser dans un cadre commercial.
Si tu produis des visuels pour le compte de tes clients, l’offre Agence est prévue pour cet usage, avec plusieurs utilisateurs et un support prioritaire. Compare les offres sur la page des tarifs. Et pour convaincre un client hésitant de l’intérêt d’un mockup, notre article mockup 3D ou capture d’écran rassemble les arguments.
Questions fréquentes
Puis-je créer des visuels pour mes clients avec Flokup ?
Oui. L’offre Agence couvre l’usage commercial pour le compte de clients, avec trois utilisateurs et un support prioritaire. Tu dois simplement avoir le droit de montrer le site affiché.
Comment présenter un site qui n’est pas encore en ligne ?
La capture ne fonctionne que sur une adresse publique. Fais une capture d’écran de la version de préproduction et importe-la dans le studio : elle s’affiche dans l’appareil comme une capture normale.
Quels visuels livrer au client à la fin du projet ?
Au minimum, l’accueil sur ordinateur en 16:9, l’accueil sur smartphone avec fond transparent, et une vidéo verticale où la page défile pour ses réseaux sociaux.