Les cartes de biens immobiliers : la page qui vend une image, pas un tableur

Tous les sites d'agences immobilières ont une page d'annonces. Presque aucun ne la traite comme la vraie surface de vente qu'elle est.

J'ai audité le Club Immobilier, une agence belge de 40 ans, section par section : hero, annonces, présentation, témoignages, pied de page. C'est sur la page des annonces que j'ai trouvé le pire écran de tout le site. Pas le plus laid. Le pire, à cause de ce qu'il fait à quelqu'un qui essaie activement d'acheter quelque chose à cette agence.

L'écran qui accueille un acheteur trop précis dans ses filtres

Voici ce que voit réellement un visiteur quand il applique des filtres qui ne correspondent à aucune annonce en ligne :

C'est tout. Aucune suggestion pour élargir la recherche. Aucun bien proche. Pas de « prévenez-moi quand un bien correspond ». Juste une impasse sur toute la page, suivie immédiatement d'un pied de page estampillé « Copyright 2018 ». Le seul visiteur qui a affiné sa recherche au point de vouloir vraiment ceque propose cette agence apprend donc, sur le même écran, que personne ici n'est aussi précis et que personne n'a touché à ce site depuis des années.

C'est le mode d'échec qui compte le plus : un état vide n'est pas un bug, c'est une décision de design que personne n'a prise volontairement.Celui qui a construit cette page a prévu le cas où des annonces existent. Personne n'a prévu le cas où il n'y en a pas, et sur un vrai site d'agence en ligne, ce cas arrive tout le temps, parce que la plupart des acheteurs filtrent par budget et nombre de chambres avant tout le reste.

Au-dessus de cet écran vide, la même page a un second problème, plus discret : même quand une recherche renvoie des résultats, les cartes elles-mêmes sont petites, le prix en premier en tout petits caractères, l'image en second. Une vignette demande à l'acheteur d'imaginer le bien. Elle ne le lui montre pas.

Pourquoi une carte n'est pas une ligne, et une ligne n'est pas une vente

Une ligne de tableur est optimisée pour la comparaison : même taille de police pour chaque champ, le prix et les mètres carrés avec le même poids visuel. C'est le bon format pour un CRM interne. C'est le mauvais format pour une page d'accueil, parce qu'un acheteur qui parcourt les annonces ne compare pas des lignes : il essaie de tomber amoureux d'un lieu.

La correction que j'ai appliquée dans la refonte traite chaque annonce comme un photographe immobilier traite sa photo principale : la photo est l'argument, tout le reste est une légende.

La photo pleine largeur d'abord. Le prix en typographie d'affichage, assez grand pour se lire d'un coup d'œil, pas tassé dans les mêmes 12 px que l'adresse. Quatre caractéristiques, pas plus : surface, chambres, salles de bain, jardin.

Les badges ont un seul rôle : donner une raison de regarder maintenant plutôt que plus tard. Utilisés sur chaque carte, ils s'annuleraient ; réservés à deux ou trois annonces par page, ils paraissent vraiment exclusifs.

L'état vide, refait

La mise en page des cartes ne règle pas à elle seule le problème de l'état vide : il faut une décision à part. Dans cette refonte, une recherche sans résultat cesse d'être une impasse et devient une seconde chance : des biens proches qui relâchent un filtre à la fois (même ville, budget plus large) au lieu d'une page blanche, et une proposition en une ligne pour être prévenu quand un nouveau bien correspond. Un visiteur qui a pris le temps de filtrer aussi précisément est proche d'un prospect, pas loin d'en être un : la page doit le traiter comme tel.

Les quatre règles qui font ou défont une carte de bien

1. La photo d'abord, toujours.En pleine largeur, pas en vignette. Un acheteur décide de cliquer en moins d'une seconde, et cette décision se prend sur l'image, pas sur la ligne d'adresse.
2. Le prix a son propre poids visuel.Typographie d'affichage, pas la même taille que le nombre de mètres carrés à côté. Le prix est le chiffre que tout acheteur cherche en premier : dessinez-le comme tel.
3. Limitez les caractéristiques à trois ou quatre.Chambres, surface, localisation, éventuellement salles de bain. Chaque champ en plus sur la carte dispute l'attention à la photo et n'apporte rien qu'un acheteur ne puisse demander plus tard.
4. Concevez l'état vide volontairement.Un écran sans résultat n'est pas un cas limite sur un site immobilier : c'est l'issue courante d'un filtrage normal. Traitez-le comme une page, pas comme un accident : proposez des biens proches ou une alerte au lieu d'une impasse.

Une note honnête sur les résultats :je n'ai pas trouvé de données indépendantes prouvant un gain de conversion précis grâce à la seule refonte des cartes. Le chiffre de « +18 % de conversion » parfois attribué à des études sur les cartes interactives est un chiffre rapporté par un éditeur que je n'ai pas vérifié moi-même, et je ne le reprends pas comme un fait. Ce que je peux dire directement : un message « aucun résultat » sur toute la page, sans aucune étape suivante, posé juste au-dessus d'un copyright de 2018, est un vrai écran vérifié sur un vrai site d'agence, et c'est objectivement une moins bonne expérience qu'un écran qui propose ne serait-ce qu'une action alternative. Le corriger n'est pas un pari ; le laisser tel quel, c'est ça le vrai risque.

Si vous ne corrigez qu'une chose cette semaine

Allez sur votre propre page d'annonces et appliquez des filtres assez précis pour ne rien renvoyer : une fourchette de prix étroite, un nombre de chambres peu courant. Si le résultat est un écran blanc sans étape suivante, c'est une fuite plus grave que le design de vos cartes. Corrigez l'impasse avant de toucher aux photos ou à la mise en page.

Hamza BenjaabaWeb designer et développeur no-code, spécialisé dans les sites d'agences immobilières et de commerces de services locaux. La refonte présentée ici est ma propre reconstruction du vrai site du Club Immobilier, pas un template du commerce. Je vérifie ce qu'affiche vraiment une recherche sans résultat avant de redessiner la moindre carte, parce qu'une page catalogue qui ne fonctionne que lorsqu'elle est pleine n'est pas terminée.