Vue d'ensemble
Refonte et structuration du site web de Desjardins Comptabilité afin d’obtenir une présence numérique crédible, performante et orientée acquisition organique. Le site combine une vitrine institutionnelle (services, approche, contact) avec une stratégie de croissance basée sur le contenu (blog), un glossaire SEO, et des outils gratuits (calculateurs) conçus pour générer du trafic qualifié et convertir en demandes de service.
En complément, le site intègre des mécanismes backend (routes API, formulaires, intégrations) pour connecter l’acquisition au CRM et structurer le suivi des prospects. L’expérience est pensée pour être “app-like”, incluant une distribution PWA afin d’offrir une navigation rapide et une utilisation naturelle sur mobile.
Contexte et objectifs
Le projet part d’un besoin concret : un cabinet moderne et virtuel doit inspirer confiance rapidement, expliquer ses services sans ambiguïté, et surtout créer un flux constant de demandes qualifiées sans dépendre exclusivement de la publicité. L’objectif n’était donc pas seulement de “faire un site”, mais de bâtir une plateforme web capable de soutenir la croissance.
Objectifs visés :
- Renforcer la crédibilité (structure, clarté, conformité, transparence).
- Créer des actifs SEO durables (pages services, contenu, outils, glossaire).
- Convertir via une UX sobre, des CTA propres et des formulaires efficaces.
- Connecter l’acquisition à l’opérationnel (CRM, notifications, suivi).
- Maintenir un niveau de performance et de qualité comparable à un site institutionnel.
Fonctionnalités principales
L’approche retenue a été de construire une base solide et réutilisable (pages services, composants UI, navigation), puis d’ajouter des leviers d’acquisition organique (blog, glossaire, outils) et enfin de connecter l’acquisition aux processus internes (formulaires, CRM, médias, conformité). L’objectif n’était pas seulement “un beau site”, mais une plateforme exploitable au quotidien.
Expérience site (vitrine)
Le site présente les services avec une structure uniforme et cohérente afin d’améliorer la compréhension, la confiance et la conversion. L’interface est pensée mobile-first, avec une navigation claire et des appels à l’action sobres mais visibles.
Livrables clés :
- Pages services modulaires et uniformisées (approche composant/layout).
- Navigation complète (desktop + mobile) et hiérarchie claire des pages.
- CTA et formulaires avec validation, feedback et réduction de friction.
Système de contenu (blog + glossaire)
Le contenu a été structuré pour générer des gains SEO cumulés. Le blog en MDX permet un contrôle fin (frontmatter riche, dates de mise à jour, notes éditoriales), tandis que le glossaire cible la longue traîne et renforce la pédagogie.
Livrables clés :
- Blog MDX (catégories, tags, articles en vedette, pages d’archives).
- Recherche interne et structure de navigation éditoriale.
- Glossaire comptable et pages piliers favorisant le maillage interne.
Outils et expérience “app” (PWA)
Les outils gratuits (ex. calculateurs) servent à la fois la valeur utilisateur et l’acquisition. Ils ont été conçus comme une expérience applicative, incluant une logique de persistance et une distribution de type PWA.
Livrables clés :
- Page Outils et calculateurs (ex. TPS/TVQ, prêts, autres outils internes).
- Persistance des calculs (localStorage et/ou serveur selon le cas).
- PWA (manifest, installabilité, expérience app-like, navigation rapide).
Backend et intégrations (opérationnalisation)
Pour éviter que les demandes entrantes soient “juste des emails”, le site intègre des mécanismes backend afin de structurer l’acquisition, alimenter le CRM et standardiser le suivi interne. Les médias sont gérés via Cloudinary pour garantir qualité, performance et cohérence.
Livrables clés :
- Routes API (Next.js) pour formulaires et actions serveur.
- Création et qualification de leads dans Zoho (champs normalisés, source, service, priorité).
- Notifications internes et confirmations prospect (selon scénario).
- Gestion médias Cloudinary (transformations, cache, optimisation).
Conformité et confiance (Loi 25)
La conformité a été traitée comme un volet produit : consentement granulaire, chargement conditionnel des scripts tiers et documents juridiques distincts, incluant un avis explicite de non-affiliation.
Livrables clés :
- Mentions légales et avis de non-affiliation.
- Politique de confidentialité et politique cookies séparées.
- Consent manager (Loi 25) avec blocage des scripts tiers.
Stack technique
Le projet s’appuie sur une stack moderne orientée performance et maintenabilité. Le choix de Next.js avec TypeScript permet une architecture solide, une génération de pages optimisée, et une gestion SEO fine via metadata dynamiques et données structurées. Le contenu est géré en MDX pour conserver un contrôle total sur la structure éditoriale et la qualité SEO, tout en restant simple à maintenir.
Côté intégrations, le backend utilise des routes API pour traiter les formulaires et orchestrer les actions serveur (création de leads dans Zoho, notifications, validations). Les images sont centralisées et transformées via Cloudinary afin de garantir une qualité stable, des formats performants (WebP) et une diffusion efficace. Le déploiement est réalisé sur Vercel pour bénéficier d’un pipeline rapide, d’une diffusion CDN et d’une expérience de développement fluide.
Défis et solutions
SEO durable (au-delà des meta tags)
Défi : éviter un site vitrine statique qui n’accumule pas de valeur organique.
Solution : structure sémantique des pages services, blog maintenu à jour, glossaire longue traîne, outils à forte intention, maillage interne, et schema.org pour améliorer la compréhension par les moteurs.
Connexion acquisition → CRM (Zoho)
Défi : ne pas perdre les demandes entrantes dans une boîte email, et rendre le suivi opérationnel.
Solution : intégration CRM pour créer les leads, normaliser les champs (source, service, priorité), et permettre une relance structurée et mesurable.
Conformité cookies (Loi 25)
Défi : assurer la conformité sans dégrader l’expérience utilisateur.
Solution : consent manager avec préférences granulaires et chargement conditionnel des scripts (analytics/marketing), avec documentation claire (politiques séparées).
Crédibilité “cabinet”
Défi : inspirer confiance immédiatement dans un secteur où la perception compte autant que la technique.
Solution : design sobre et éditorial, structure claire des services, transparence (non-affiliation), et expérience sans friction axée sur la clarté.
Résultats attendus
Le projet est conçu pour produire des effets cumulatifs, notamment via le contenu, le glossaire et les outils.
- Performance : pages rapides, images optimisées, lazy loading, expérience app-like.
- Indexation : sitemap, canonical, schema.org, robots.txt.
- Acquisition : croissance progressive du trafic via services + contenu + glossaire + outils.
- Conversion : hausse des demandes via CTA et formulaires connectés au CRM.
Apprentissages
- Industrialisation d’un site de services avec une architecture modulaire réutilisable.
- Mise en place d’un système SEO complet : pages services, blog, glossaire, outils et maillage interne.
- Intégrations backend (formulaires → CRM) pour rendre l’acquisition exploitable au quotidien.
- Traitement de la conformité (Loi 25) comme un enjeu produit et non un simple ajout légal.
- Conception d’une expérience PWA cohérente pour renforcer l’usage mobile et la rétention.
Galerie du projet
Fonctionnalités livrées
UI & Frontend
- Design responsive mobile-first
- Composants UI réutilisables (cards, CTA, sections)
- Navigation (header, mega menu, mobile menu)
- Formulaires côté client (UX, validation, feedback)
- Accessibilité (contraste, focus, clavier)
Backend & API
- Routes API / server actions
- Validation serveur (schema, sanitization)
- Emails (notifications + confirmations)
- Sécurité de base (rate limit, headers)
- Webhooks / intégrations serveur (si applicable)
Données & Base de données
- Modélisation des données (schéma, relations)
- CRUD & persistence (DB ou storage)
- Migrations / versionning des données
- Caching (si applicable)
- Observabilité minimale (logs, erreurs)
Intégrations & Automatisation
- CRM (ex. Zoho) création de leads
- Médias (Cloudinary) upload + transformations
- Analytics / pixels (chargement conditionnel)
- Outils tiers (chat, calendriers, etc.)
- Automatisations (workflows, notifications)
Contenu & Système éditorial
- Système de contenu (MDX/CMS)
- Catégories, tags, archives
- Recherche interne (si applicable)
- Pages piliers & maillage interne
- Glossaire / FAQ (si applicable)
Fonctionnalités produit
- PWA (manifest, install, app-like UX)
- Offline fallback (pages clés / expérience minimale)
- Outils spécifiques (calculateurs, dashboards, etc.)
- Persistance côté client (localStorage) ou serveur
- Partage/export des résultats (si applicable)
Conformité, sécurité & confiance
- Mentions légales / politiques
- Gestion cookies (consentement granulaire)
- Blocage scripts tiers selon consentement
- Bonnes pratiques sécurité (auth si applicable)
- Messages de confiance (disclaimers, non-affiliation)
Performance & SEO
- Optimisation performance (images, lazy loading)
- Service Worker caching (PWA) + stratégie cache
- Metadata dynamiques + canonical
- Sitemap + robots.txt
- Schema.org (Article/Service/FAQ/Breadcrumb/etc.)
Questions fréquentes
Quelles technologies ont été utilisées pour ce projet ?
Comment le SEO est-il géré sur le site ?
Le site est-il conforme à la Loi 25 (cookies) ?
Pourquoi avoir ajouté une section Outils (calculateurs) ?
Comment le contenu du blog est-il maintenu à jour ?
Ressources & Documentation
Documentation Next.js
Référence principale pour l’architecture App Router, metadata et déploiement.
Schema.org
Référence pour les données structurées (LocalBusiness, Service, Article, FAQ).
Google Search Central
Bonnes pratiques SEO : indexation, sitemap, rich results, données structurées.
Commission d’accès à l’information (Loi 25)
Cadre légal québécois : confidentialité, consentement et gouvernance des données.

