Bienvenue sur le blog de pragma once
·1 min de lecture·pragma once
On ouvre le blog de pragma once. Avant d’écrire quoi que ce soit, on a construit la bibliothèque de composants qui donne à chaque article la même structure, la même DA et les mêmes garanties d’indexation.
À retenir
- Chaque article se compose de briques réutilisables — pas de markup improvisé.
- Les images passent toutes par <Figure> : alt, dimensions et lazy-loading obligatoires.
- Tout est rendu côté serveur : indexable, rapide, sans JavaScript requis.
Pourquoi une bibliothèque
Un blog qui grandit sans cadre finit en patchwork : dix façons de poser une image, trois styles de citation, des titres qui sautent des niveaux. On a pris le problème à l’envers. Une seule bibliothèque de composants, et chaque article se compose à partir d’elle.
Ce que ça garantit, article après article :
- Une direction artistique cohérente, sans effort de rédaction.
- Une hiérarchie de titres stricte — un seul H1, puis H2 et H3.
- Des images qui ne font jamais sauter la mise en page au chargement.
Composer, jamais réinventer
Écrire un article revient à assembler des briques dans l’ordre : un chapô, un sommaire, des paragraphes, une image, un encadré. Le rédacteur ne touche pas au HTML — il choisit la bonne brique et lui passe son contenu.
Les briques disponibles
La marche à suivre pour un nouvel article tient en trois temps :
- Poser le plan avec un sommaire et un bloc « à retenir ».
- Dérouler le corps en alternant prose, listes et visuels.
- Terminer par l’appel à l’action vers le formulaire de contact.
Rien n’est fait deux fois. Une brique, un rôle, et on la réutilise partout.
AvantAprèsSous le capot
Chaque brique est un petit composant autonome, rendu côté serveur. Pas de dépendance à JavaScript pour afficher le contenu : le sommaire fonctionne avec de simples ancres, le code est du <pre> stylé, les graphiques sont des SVG générés au build.
Les formules aussi : la notation mathématique est composée au build avec KaTeX, elle arrive donc en HTML dans la page. L’accessibilité, par exemple, se mesure — le contraste entre un texte de luminance et un fond de luminance suit le ratio WCAG , et on vise pour le corps de texte.
Rien de tout cela n’exige de JavaScript côté client : la formule est déjà dans le HTML servi, indexable et lisible sans exécution.
// One brick, one job — the writer composes, never invents markup.
// Assets live under public/blog/<slug>/ in a web-optimized format.
<Figure
src="/blog/mon-article/tableau-de-bord.webp"
alt="Tableau de bord de suivi des commandes"
width={1280}
height={720}
caption="Le même écran, chargé en moins d'une seconde."
/>