WebInnovant

Pourquoi j'ai construit mon propre site avec 0 CMS et 0 dépendance payante

Retour technique sur web-innovant.ch : Zola, Swup, GSAP, binaire Rust maison, 160 Ko par page, WCAG AA. Le métaprojet qui démontre ce que je fais pour mes clients.

Le principe🔗

Je vends du développement web, de l'automatisation et de l'IA à des PME suisses. Le meilleur argument commercial que je peux avoir, c'est mon propre site. Si le site est rapide, accessible, agréable, il n'a pas besoin d'autre argument.

Web Innovant, c'est ce site. Un métaprojet : je fais pour moi-même exactement ce que je propose à mes clients. Zéro CMS, zéro dépendance payante, zéro service tiers sur les fonctions critiques.

Cet article explique comment il est construit, et pourquoi.

La stack🔗

Volontairement minimaliste :

  • Zola — Générateur de site statique en Rust
  • Swup — Navigation SPA sans rechargement, transitions fluides
  • GSAP — Animations avancées (transitions, particules, curseur contextuel, Flip)
  • Lenis — Scroll fluide
  • wi — Binaire Rust maison qui gère tout le build

Aucun framework JavaScript lourd. Aucun CMS. Aucune base de données. Aucun abonnement.

Le binaire wi — le cœur du projet🔗

Au fur et à mesure que le site grandissait, j'avais une collection de scripts Python pour le build : minification CSS/JS, génération des images OG, compression des images, vérification SEO, audit accessibilité.

C'était bancal. Dépendances Python à installer, versions à gérer, compatibilités à vérifier.

J'ai tout réécrit en un binaire Rust unique : wi. Aujourd'hui, tout passe par lui :

wi build     # Build complet : Zola + minify + optimize
wi og        # Génération des images Open Graph (resvg + tiny-skia)
wi minify    # Minification CSS/JS
wi optimize  # Compression des images
wi verify    # Audit SEO (JSON-LD, OG, liens)
wi a11y      # Audit accessibilité WCAG
wi convert   # Conversion d'images PNG → JPEG
wi index     # Génération d'un index JSON pour la recherche

Le binaire fait ~3 Mo, compile en 1 minute, et fait ce que 6 scripts Python faisaient en étant plus lent et plus fragile.

Ce que le site démontre🔗

Performance🔗

Chaque page pèse environ 160 Ko (HTML + CSS + JS minifiés), se charge en moins d'une seconde, et obtient un score Lighthouse quasi parfait.

Comment ? Trois principes :

  1. Pas d'images inutiles. Les visuels sont soit du SVG (logo, illustrations), soit des images optimisées (JPEG qualité 82, pas de PNG lourds). Les OG images ne sont jamais téléchargées par les visiteurs — elles ne servent qu'aux partages sociaux.
  2. Pas de dépendances tierces. Aucun Google Analytics, aucun chat live, aucun widget social. Chaque script qui n'existe pas, c'est 30 à 100 Ko économisés.
  3. Minification systématique. CSS de 160 Ko → 119 Ko. JS de 57 Ko → 46 Ko. HTML aussi (Zola le fait nativement).

SEO & GEO🔗

Le site intègre toutes les bonnes pratiques modernes :

  • JSON-LD complet sur chaque page (Organization, Service, FAQPage, BlogPosting, BreadcrumbList, LocalBusiness)
  • Open Graph et Twitter Cards dynamiques, avec images OG générées automatiquement par le binaire wi og
  • Fichiers llms.txt et llms-full.txt pour être cité par les IA génératives (GEO)
  • Sitemap XML automatique, avec exclusion intelligente des pages techniques (merci, page de redirection)
  • Flux RSS limité aux articles, en mode résumé
  • Cache-busting avec hash de contenu sur CSS et JS

Accessibilité🔗

WCAG AA validé sur les 113 pages du site. Le binaire wi a11y vérifie automatiquement :

  • Landmarks HTML5 (<header>, <main>, <nav>, <footer>)
  • Hiérarchie de headings (h1 unique, pas de saut de niveau)
  • Noms accessibles sur tous les liens et boutons
  • Labels de formulaire associés (avec gestion des honeypots)
  • Attributs ARIA complets (aria-label, aria-expanded, aria-controls, aria-pressed, aria-live)
  • Skip link pour la navigation clavier
  • Focus trap dans le menu mobile
  • Fieldset/legend sur les groupes de champs

Zéro erreur sur les 113 pages. C'est rare, même parmi les sites professionnels.

Automatisation🔗

Le binaire wi fait aussi office d'orchestrateur. Un wi build :

  1. Nettoie public/
  2. Lance Zola (génération statique)
  3. Minifie CSS et JS
  4. Compresse les images PNG

Et un wi og --missing génère uniquement les images OG manquantes — pratique quand on ajoute un article sans vouloir tout régénérer.

Souveraineté🔗

Tout est maîtrisé :

  • Hébergement : Cloudflare Pages (gratuit)
  • Analytics : Cloudflare Web Analytics (cookieless, nLPD-compliant)
  • Code source : propriétaire, réplicable, documenté
  • Données : aucune ne quitte le site

Les 5 leçons que j'applique chez mes clients🔗

1. Le statique gagne pour 80% des besoins🔗

Un site vitrine, un blog, un portfolio, une documentation — tout ça peut être statique. Plus rapide, plus sécurisé, plus pérenne, moins cher.

2. Zéro dépendance est un choix🔗

Chaque dépendance ajoute : une surface d'attaque, un coût potentiel, une maintenance, et un risque d'abandon. Zéro est un objectif atteignable — et c'est un choix stratégique, pas une contrainte.

3. L'automatisation doit être rustique🔗

Un binaire Rust autonome de 3 Mo est plus fiable que 6 scripts Python qui dépendent de paquets externes. C'est contre-intuitif (Rust semble plus complexe), mais c'est la réalité en production.

4. L'accessibilité n'est pas un bonus🔗

WCAG AA n'est pas un luxe. C'est un standard, et c'est légal dans beaucoup de contextes. Un site qui exclut 15% de la population, ce n'est pas un bon site.

5. Le site est le meilleur argument commercial🔗

Un développeur qui dit « je fais des sites performants » et dont le propre site pèse 5 Mo en 3 secondes, n'est pas crédible. Un développeur dont le site charge en 500 ms, c'est un développeur qui sait de quoi il parle.

Conclusion🔗

Ce site est ma démonstration publique. Il n'y a pas de meilleure carte de visite pour un développeur que son propre travail.

Zola, Swup, GSAP, un binaire Rust maison, 160 Ko par page, WCAG AA, 0 dépendance payante — c'est ce que je propose à mes clients, appliqué à moi-même d'abord.

Vous voulez un site qui travaille vraiment pour votre PME ? Parlons-en. Je vous dis honnêtement ce qui est possible, dans quel délai, pour quel budget.

→
← Tous les articles