ÉTUDE DE CAS — SITE VITRINE
UNOL
Refonte complète du site vitrine de l'Unité de Neurochirurgie de l'Ouest Lyonnais — du WordPress vieillissant à une identité médicale sobre et un parcours patient fluide.
LE CONTEXTE
Un cabinet d'expertise, un site qui ne suivait plus.
L'UNOL regroupe trois neurochirurgiens spécialisés en chirurgie du rachis, du crâne et en neuromodulation, exerçant à la Clinique du Val d'Ouest et dans plusieurs centres partenaires autour de Lyon. Un cabinet médical reconnu, près de 25 ans d'expérience cumulée, un standard secrétarial actif.
Leur ancien site, bâti sur un thème WordPress générique, ne reflétait plus ce niveau d'exigence : violet agressif, typographie système, hiérarchie inexistante, aucun lien direct avec un outil de prise de rendez-vous, expérience mobile médiocre. Les patients arrivaient perdus sur des pages-listings de textes bruts.
L'objectif : repartir d'une page blanche, remettre le patient au centre, et livrer un site qui inspire la confiance attendue d'un cabinet médical spécialisé.
AXES D'AMÉLIORATION
Quatre chantiers, un objectif : la clarté.
Identité & design system
Le thème WordPress violet générique ne correspondait ni au sérieux de la discipline, ni au positionnement du cabinet. Refonte complète de l'identité visuelle : création du logo UNOL, palette bleu marine profond pensée pour le secteur médical, typographie éditoriale (serif pour les titres, sans-serif pour le corps), grille cohérente et respirante sur toutes les pages.
- → Création du logo et des déclinaisons (favicon, variantes)
- → Palette médicale sobre — bleu marine, crème, navy
- → Hiérarchie typographique claire en 3 niveaux
- → Design system documenté et réutilisable
Architecture & parcours patient
L'ancien site empilait du texte brut sans hiérarchie ni guidage. La nouvelle arborescence est pensée autour des questions réelles des patients : qui, quoi, où, comment prendre rendez-vous. Chaque page débute par un hero explicite, les chiffres clés sont mis en avant dès le "À propos", les praticiens ont de vraies cartes avec photos, spécialités et lieux de consultation.
- → Hero dédié sur chaque page avec accroche claire
- → Chiffres clés : +25 ans d'expertise, 3 praticiens, 0 € de fonds publicitaires
- → Cartes praticiens avec photos, spécialités et lieux
- → Navigation resserrée : 6 entrées au lieu de 12
Prise de rendez-vous simplifiée
Avant : trois boutons "Cliquez ici" énigmatiques au-dessus d'un mur de texte sur les horaires, tarifs et conventions secteur 2. Aucune continuité avec un outil de réservation. Après : cartes praticien avec jours et lieux de consultation, CTA direct vers Doctolib, bloc téléphone distinct mis en valeur, encart tarifs lisible. Le patient passe à l'action sans friction.
- → Intégration Doctolib par praticien
- → Bouton "Prendre rendez-vous" persistent dans la navbar
- → Bloc téléphone et horaires secrétariat mis en avant
- → Tarifs et convention secteur 2 dans un encart dédié
Fondations techniques
Remplacement du WordPress et de son thème par une stack statique moderne : React + TypeScript + Tailwind. Site mobile-first, images optimisées en WebP, lazy loading, structure sémantique pour le SEO et l'accessibilité. Zéro plugin à maintenir, zéro base de données à sécuriser, zéro mise à jour critique à faire tous les mois.
- → Stack statique — React, TypeScript, Tailwind
- → Hébergement performant + HTTPS automatique
- → Lighthouse Performance > 95, Accessibilité > 95
- → Aucune maintenance WordPress — site figé et sécurisé
AVANT / APRÈS
Cinq pages refondues, page par page.
Chaque capture montre l'intégralité de la page telle qu'elle apparaît au visiteur. Cliquez sur une image pour l'ouvrir en taille réelle.
Accueil
D'un empilement de texte brut sur fond violet à un hero éditorial qui pose immédiatement le positionnement.
À propos
Trois photos posées sans contexte deviennent de vraies cartes praticien, accompagnées de chiffres clés tangibles.
Contact & plan d'accès
Photos mal recadrées et plan illisible remplacés par une hiérarchie claire : coordonnées, plan, autres lieux de consultation.
Prendre rendez-vous
Les trois boutons "Cliquez ici" cèdent la place à des cartes praticien avec jours, lieux et lien Doctolib direct.
Conseils aux patients
Un mur de texte dense restructuré en sections À l'hôpital / À domicile, avec visuels, vidéos d'exercices et checklists par intervention.
STACK TECHNIQUE
Des briques sobres, éprouvées, maintenables.
Pas de dépendance à un CMS lourd, pas de plugin à surveiller. Un site qui tient dans le temps sans intervention.
VISITER LE SITE
Un projet similaire en tête ?
Refonte d'un site vieillissant, création d'une identité, mise en place d'un vrai parcours patient : discutons-en.