Arash Rezvani — site éditorial bilingue pour un écrivain et enseignant

01Contexte

Une carrière qui ne tient pas en un seul titre

Arash Rezvani est écrivain, poète, enseignant, photographe et aventurier. Selon ses propres dires, il a publié près de dix livres et plus d’une centaine de poèmes, entraîné des cyclistes pendant quinze ans, fait de l’escalade pendant plus de vingt-cinq ans et de la photographie pendant plus de trente. La commande : un site personnel et un journal pour tout cela.

Le persan est sa langue et celle de ses lecteurs ; c’est donc la langue par défaut du site, avec l’anglais à ses côtés. Autour de son propre récit, j’ai construit un site de publication : une page pour chaque part de son travail, une étagère de livres avec une page chacun, un journal, ses chansons, la recherche, et un calendrier pour réserver un appel. Il est édité depuis une administration en persan et hébergé en Iran.

Arash Rezvani sur ordinateur — la page expérience en anglais, intitulée « Plus qu’un titre », entre deux murs de filets — Figure 02Une page, deux URL : chaque langue est un document à part entière, pas une traduction basculée par un cookie.

Arash Rezvani sur ordinateur — la même page expérience en persan, composée de droite à gauche, sans interlettrage — Figure 02Une page, deux URL : chaque langue est un document à part entière, pas une traduction basculée par un cookie.

02Problème

Vérité, structure et portée

Le premier problème était la vérité. Une vie aussi variée incite à arrondir à la hausse, et le projet avait déjà connu le pire cas : le premier contenu sur lequel le design avait été construit décrivait quelqu’un d’autre, et son propre récit écrit contredisait presque chacun des faits qu’il contenait.

Le second était la structure. Ses pratiques se sont menées de front pendant des décennies — l’écriture, la formation de cyclistes et de moniteurs, l’entraînement cycliste, la photographie, la calligraphie, la montagne, la route, le guidage, l’aide humanitaire — et aucune n’a remplacé une autre. Une seule page de profil ne peut pas contenir tout cela, et des pages qui tentent chacune de tout résumer finissent par se répéter entre elles.

Le troisième était la portée. Pour un écrivain dont les livres et les lecteurs sont persans, les pages persanes doivent pouvoir être trouvées à leurs propres adresses. Un site qui affiche bien le persan mais ne le sert à aucun robot d’indexation a échoué dans la seule chose pour laquelle il existe.

03Contraintes

Un petit serveur, sur un réseau filtré

Le site tourne sur un seul serveur en Iran, avec deux cœurs et moins de 4 Go de mémoire, qui fait aussi tourner son serveur Git et sa messagerie. Depuis là, Docker Hub, le registre de conteneurs de Google et Quay répondent tous par un 403, et YouTube est filtré, si bien que le serveur ne peut pas atteindre les vidéos que sa propre page musique répertorie.

Les builds tournent sur la même machine et occupent les deux cœurs pendant environ huit minutes ; mesurés le 2 septembre, les temps de réponse sont passés de 5 secondes à 37, puis à un délai dépassé jusqu’à la fin du build. Aucun runner de CI n’a jamais été installé, si bien que rien ne vérifie un push avant sa mise en ligne. Chacun de ces éléments a pesé sur une décision plus loin.

04Mon rôle

Un designer-développeur, un auteur

J’ai conçu et construit le site seul, à partir du récit écrit d’Arash lui-même et des messages qu’il a envoyés à propos de chaque pratique. Le code est parti du template de site de Payload, et je l’ai construit avec l’assistance de l’IA : Claude est crédité sur 93 des 97 commits.

Responsable

L’architecture de l’information : quelle page porte quelle part de son récit
La marque et le langage de design écrit
Le modèle de contenu : 8 collections, 4 globals et 21 blocs de page, dont 16 écrits pour ce site
Le développement Payload et Next.js, en deux langues
Le système de réservation et son calendrier
L’infrastructure dans le pays, le journal de déploiement et le journal des opérations de contenu
Direction artistique des images : 37 images générées, la ressemblance tirée de ses photographies

Coresponsable

Collaboration

Arash : sa biographie, ses dix textes de pratique, les couvertures de ses livres et ses photographies

Chaque chiffre du site remonte à ses propres mots ; quand le site et un brouillon divergent, c’est la biographie qui l’emporte. Les brouillons, l’aperçu en direct, la programmation, l’indexation de recherche et le constructeur de formulaires sont venus avec le template ; la structure, les règles et les décisions sont miennes.

05Sources

Rien de déduit, rien de comblé

Le site ne s’appuie que sur deux sources pour dire qui il est : un document qu’il a écrit sur lui-même, et dix messages qu’il a envoyés le 11 septembre, un par pratique. Le fichier de biographie conserve les deux, avec le persan comme texte de référence, et un tableau des chiffres sourcés, chacun tel qu’il l’a énoncé, son ≈ ou son + intact. Quand un ancien fichier de contenu contredisait son récit, le désaccord a été consigné dans la biographie et son récit l’a emporté.

Le même fichier liste ce qui n’existe pas encore — le reste de ses titres de livres, le texte d’un poème quelconque, ses certificats — et la règle pour tout cela est de ne rien afficher. Les lacunes apparaissent donc comme des énoncés simples, non comme des espaces réservés : la page des livres présente six titres sur près de dix et le précise, la page poésie explique quatre formes et précise qu’aucun poème n’est encore présent, et la page travail précise que la calligraphie et les photographies ne sont pas en ligne.

Un tableau de placement dans le même fichier note la page et le bloc où vit désormais chacun de ses passages, afin qu’une modification ultérieure ne puisse pas discrètement placer un passage à deux endroits.

Le site est devenu public le 30 août ; son contenu est devenu véridique le 3 septembre, quand son récit a remplacé l’ancien fichier sur chaque page.

« Rien ici n’est déduit, et aucun chiffre absent de ce tableau ne peut apparaître sur le site. »
— Le tableau des chiffres sourcés de la biographie · Établi à partir du récit d’Arash lui-même et de dix messages qu’il a envoyés, un par pratique

Arash Rezvani sur ordinateur — la page des livres en persan, dont l’ouverture indique que six titres sur près de dix sont présentés et que les autres ne le sont pas encore — Figure 03La page des livres énonce ses propres limites : près de dix titres écrits, traduits et publiés, six d’entre eux présentés, les autres pas encore.

Arash Rezvani sur ordinateur — la section des poèmes de la page poésie en persan, qui indique qu’aucun texte de poème n’est encore présent

Arash Rezvani sur ordinateur — la bande de clôture de la page travail en anglais : le travail n’est pas encore en ligne

06Structure

Une page par fonction, un seul foyer par fait

J’ai donné à chaque page une seule fonction. Expérience est la vue d’ensemble : neuf fils, chacun renvoyant à la page qui le porte en entier, et la seule bande de chiffres du site. Enseigner, Route, Regard et Poésie portent chacune une part de son récit, dans ses propres mots. Livres, le journal et musique sont des collections avec un index. Recherche et Contact servent toutes les pages.

Ce qui tient l’ensemble, c’est l’axiome du langage de design appliqué au contenu : une page dit une chose une seule fois, et un fait a un seul foyer. Sur la première page auditée, Travail, les six mêmes éléments apparaissaient trois fois — les chiffres dans le hero puis dans la bande de statistiques, une ligne en citation puis à nouveau dans une liste. Chaque fait a reçu un seul propriétaire et les copies ont été supprimées ; rien n’a été réécrit. Sur l’ensemble du déploiement, l’audit a relevé quatorze répétitions sur cinq pages, et chaque correction a été une soustraction.

Les liens croisés remplacent la répétition. Enseigner et Route montrent chacune le livre lié à leur propre sujet, avec un lien vers sa page, et Enseigner, Livres, Musique et Expérience se referment sur une bande qui mène à Contact. Une fois que les pages internes possédaient leurs faits, la page d’accueil n’avait plus rien de propre à dire, si bien qu’elle est devenue l’index : les livres, six voies d’entrée, la carte du pays, les chansons les plus récentes et les dernières notes.

Deux anciennes pages n’ont pas rattrapé le reste. Travail et Expérience précèdent Route et Regard, et six des neuf liens d’Expérience pointent encore vers Travail, qui ne porte plus qu’une courte liste et une bande « pas encore en ligne ».

Schéma des routes du site, numérotées de un à huit : la page d’accueil, à propos et expérience, les quatre pages de pratique, leurs liens vers les livres, les livres et le journal, la musique, la recherche et le contact, et l’ancienne page travail

La section « Quatre décennies, un pays » de l’accueil : un court texte et un lien à côté d’une carte au trait de l’Iran.

La section des notes de l’accueil : six cartes numérotées, en typographie seule, chacune avec une date, une étiquette de thème et un titre.

07Approche

Un axiome, et chaque page mesurée à son aune

Le site a d’abord été mis en ligne sur un système de marque éditorial, avec une palette tirée des photographies d’Arash : une encre chaude, l’ambre, le papier, une brume froide et le cobalt. Chaque paire a été mesurée. L’ambre sur papier ressortait à 2,1:1 ; l’ambre n’est donc jamais du texte sur blanc, et un seul ambre par vue est devenu une règle.

Trois jours plus tard, le langage de design a été écrit en une seule phrase, « Aucune ligne sans fin », avec trois façons légitimes pour une ligne de s’arrêter : sur un mur, sur une autre ligne ou sur un changement de fond. Tout le reste est un défaut, pas un style, et chaque page a été reconstruite et mesurée à cette aune.

La règle a tranché des détails qui font d’ordinaire débat. Les murs se posent sur le bord de la colonne de contenu, si bien que chaque filet tracé par un bloc vient s’y poser sans que le bloc ne sache qu’ils existent. Une bande avec sa propre couleur ne trace aucun filet, parce que le changement de couleur est déjà le bord. Chaque ligne a une seule épaisseur, 1,5 px, et aucune zone n’a de coin arrondi. Un champ de formulaire est un soulignement qui montre le focus par un changement de couleur, mesuré à 6,18:1 dans le thème clair et 7,44:1 dans le thème sombre, là où 3:1 est exigé. Et le persan n’est jamais interlettré : chaque valeur de tracking, y compris celle de Tailwind, est mise à zéro pour le persan, qui fermait auparavant les jointures de chaque titre persan.

Le test d’un bord n’est pas de savoir si une limite existe, mais si un lecteur verrait la ligne s’arrêter là. Le portrait de l’accueil a échoué à ce test de 64 px, si bien que sa colonne trace désormais son propre filet.

Du template à un site bilingue en ligne

01
Mise en placeLe template de site de Payload dans Next.js, une administration en persan et un pipeline de déploiement, depuis le 25 août
02
Système de marqueUne palette mesurée à partir de ses photographies ; en ligne le 30 août

Arash Rezvani sur ordinateur — la liste des pratiques avec ses filets de rangée et de colonne, fermée par une bande couleur encre portant les chiffres sourcés

08Images

Une ressemblance tirée de ses propres photos

Le site a été lancé avec une médiathèque vide. Ses archives comptaient 59 images, et aucune ne faisait une référence propre : sur les 42 premières que j’ai vérifiées, chaque plan rapproché montrait sa tête sous une casquette, un chapeau ou un casque, souvent avec des lunettes de soleil, et chaque plan tête nue montrait un visage trop petit pour être lu. J’ai donc dirigé les images avec un modèle de génération, à partir de ces photographies.

Les premières images du site venaient de deux premières planches de référence. Une semaine plus tard, j’ai construit neuf planches de rotation de garde-robe, une par façon dont il s’habille réellement sur ses photos, chacune rattachée à des photos sources nommées et vue sous neuf angles fixes, et elles sont devenues la référence de continuité pour dix-sept études éditoriales. Chaque image a été briefée sur les règles de la marque — sa palette, des angles droits, un ambre au plus, et ni texte, ni logo, ni titre de livre inventé. Les onze images du site les respectent ; quelques études dépassent la limite d’un seul ambre.

Là où une vraie photo fonctionne, elle l’emporte : son portrait et son avatar sur la page À propos sont des recadrages d’une photographie de lui. Ici, les images générées sont montrées comme telles ; sur son propre site, elles ne portent encore aucune mention, et c’est un point resté ouvert.

Premier écran de l’accueil en anglais : le titre « La vie sous ses différentes formes » à côté du portrait de tête en trois fenêtres.

Premier écran de l’accueil en persan, en miroir de droite à gauche : le titre à côté du portrait de tête en trois fenêtres.

La section « Six voies » de l’accueil : six pratiques numérotées, chacune sous l’une des images générées. — Figure 09« Six voies », l’index de ses pratiques sur l’accueil : chaque pratique se place sous l’une des cartes de section générées.

L’accueil en persan sur un téléphone : le titre et la phrase d’ouverture.

L’accueil en persan sur un téléphone, défilé jusqu’au portrait de tête en trois fenêtres.

Planche de rotation en studio en neuf vues d’Arash avec des lunettes rondes foncées, un chapeau tressé bicolore et une chemise blanche au col ouvert, de face, de profil, de dos, de trois quarts et en contre-plongée.

Planche de rotation en studio en neuf vues d’Arash avec un chapeau tressé sombre et une chemise vert sauge pâle, de face, de profil, de dos, de trois quarts et en contre-plongée.

Portrait graphique en trois fenêtres d’Arash, de profil gauche, de trois quarts face et de profil droit, avec des lunettes rondes et un chapeau tressé bicolore.

Collage portrait rectiligne d’Arash Rezvani en casquette sombre, superposé à des photographies abstraites de montagne et de route sur un fond de papier texturé.

Mosaïque éditoriale de neuf portraits d’Arash Rezvani, lunettes rondes transparentes, veste gris lavande et chemise noire, sous une lumière dure de fenêtre.

Étude éditoriale en quatre parties d’Arash Rezvani en veste bleu marine et chemise blanche : en plongée, de près, assis et de dos.

09Publication

Des fiches, et tous les endroits que chacune atteint

Les livres, les articles du journal et les chansons sont des fiches, pas des sections de page, parce qu’une fiche peut avoir sa propre adresse, ses propres métadonnées et une place dans la recherche. Publier une fiche ne la rend pas atteignable pour autant, si bien que chaque type est relié aux surfaces par lesquelles un lecteur ou un robot d’indexation arrive.

Un livre reçoit une page dans chaque langue, une ligne dans le plan du site des livres et dans la recherche, des données structurées Book qui nomment son rôle tel que la couverture l’imprime, et une image de partage découpée dans sa jaquette. Un article de journal reçoit une page par langue, le plan du site des articles, un flux RSS par langue, des données structurées Article et un filtre par catégorie ; les six catégories portent les noms de ses pratiques. Une chanson n’a pas de page propre : la page musique et la bande de l’accueil lisent la collection des vidéos, et la décrivent comme une liste de VideoObjects.

Autour d’eux : des URL canoniques, des paires hreflang avec x-default sur le persan, trois plans de site, un graphe WebSite et Person sur chaque page, et des cartes de partage : un livre utilise sa propre jaquette, toute autre page la carte du site.

Le journal ne satisfait pas encore la propre règle du site. Vingt de ses 21 entrées ont été créées en un seul lot le 10 septembre, écrites à sa voix, créditées à moi et datées jusqu’à janvier ; l’autre reste de l’ancien contenu. Tant que sa propre écriture ne les remplace pas, le système fonctionne mais son contenu, non.

Schéma d’une fiche de livre et des six endroits qu’elle atteint : ses pages persane et anglaise, l’étagère et la page enseignement, le plan du site des livres et la recherche, les données structurées Book, et une image de partage découpée dans sa couverture

Arash Rezvani sur ordinateur — le journal en persan, ses entrées datées en Shamsi et filtrées par pratique

Arash Rezvani sur ordinateur — le journal en anglais, les mêmes entrées datées selon le calendrier grégorien et filtrées par pratique

10Décisions clés

Six décisions qui ont tenu

Chacune a été imposée par le public, la matière source ou le réseau, pas par le goût.

01
Donner à chaque langue sa propre URL
La première version persane choisissait la langue par cookie : une URL, deux rendus. Un robot d’indexation ne porte pas de cookie ; aucune page traduite n’était donc accessible à une quelconque URL, et aucun hreflang ne pouvait être émis. Désormais, l’anglais vit sous /en et le persan sous /fa, et une URL nue va vers la dernière langue du lecteur, ou vers le persan.
Alternatives
Une seule URL, la langue étant choisie par cookie
Compromis
Chaque lien interne doit porter son préfixe, et le changement de langue impose un rechargement complet de la page.
02
Protéger les réservations par un index de base de données, pas par un hook
Deux appels confirmés ne peuvent jamais partager la même heure de début. Les options d’index de Payload ne savent pas exprimer « unique parmi les seules lignes confirmées » ; l’application construit donc un index unique partiel au démarrage, et les réservations publiques passent par un seul endpoint. Testé en situation de concurrence : un 201, un 409, une ligne.
Alternatives
Une vérification des doublons dans un hook d’enregistrement
Compromis
Si l’index ne se construit pas, le site continue de tourner sans la garantie ; il faut donc lire le journal de démarrage.

11Solution

De la lecture à la question

La recherche lit un seul index construit à partir des pages, des articles et des livres. Depuis le 13 septembre, elle lit cet index dans la langue de la page, si bien que les articles persans reviennent sous leurs titres persans. Les résultats s’arrêtent à douze, et les pages de résultats sont tenues à l’écart des moteurs de recherche, car chaque requête deviendrait sinon une page pauvre.

Le formulaire de contact est une bande de champs soulignés avec un honeypot caché. Le serveur de messagerie est câblé, et le conteneur refuse de démarrer sans ses réglages, parce que l’échec contre lequel il protège est le silencieux : un formulaire qui remercie le visiteur et ne le dit à personne. Le formulaire lui-même, pourtant, n’a aucune notification réglée en production, si bien qu’aujourd’hui les messages attendent dans l’administration : le même échec silencieux, un cran plus haut.

Un appel se réserve selon les étapes ci-dessous. Chaque règle sur le quand — les horaires, les pauses, la durée des créneaux, la marge entre les appels, le délai de prévenance, les jours bloqués, et un interrupteur qui ferme tout — vit dans un réglage que l’administration édite, si bien que changer les horaires n’est jamais un déploiement. Les réservations n’envoient encore aucun e-mail ; l’administration s’ouvre sur les prochains appels confirmés.

La recherche n’est corrigée qu’à moitié. Les livres et les pages reviennent encore sous leurs titres anglais dans la recherche persane, et l’extrait ainsi que la catégorie sous chaque résultat ne sont stockés que dans une seule langue, si bien que la recherche anglaise affiche des extraits en persan et manque les correspondances dans les descriptions anglaises.

Arash Rezvani sur mobile — résultats de recherche en persan pour le mot signifiant « coach » : un livre sous son titre anglais, puis deux articles sous leurs titres persans

Arash Rezvani sur mobile — résultats de recherche en anglais pour « coach », chacun avec un extrait en persan sous son titre anglais

Réserver un appel, en cinq étapes

01
Choisir un jourUn mois Shamsi, la semaine commençant le samedi ; les jours passés, les vendredis et les jours complets sont désactivés
02
Choisir une heureLes quarts d’heure libres à l’heure de Téhéran, avec l’heure propre du visiteur à côté

Arash Rezvani sur mobile — les quarts d’heure libres d’un jour choisi à l’heure de Téhéran, en chiffres persans

Arash Rezvani sur mobile — le formulaire de réservation en persan : le jour et l’heure choisis au-dessus des champs nom, téléphone et e-mail

12Exploitation

Le faire tourner sans mise en production

L’administration parle persan par défaut et passe d’elle-même de droite à gauche ; la marque sur son écran de connexion est sa signature, dessinée à la place de celle de Payload. Les brouillons, la sauvegarde automatique, l’aperçu en direct et la publication programmée sont venus avec le template, mais jusqu’au 8 septembre la programmation ne faisait rien : l’administration mettait une tâche en file d’attente que rien n’exécutait, si bien qu’un article programmé ne serait jamais apparu. Un exécuteur de tâches à l’intérieur du conteneur vide désormais la file chaque minute.

Depuis le 3 septembre, les changements de contenu se font à l’exécution, pas dans le code. Entre le 11 et le 18 septembre, le journal des opérations de contenu enregistre quinze écritures — ses textes de pratique, les réglages de réservation, les cartes de la page d’accueil, la page musique et ses chansons — et un retour en arrière : les neuf cartes de la page À propos, qui cassaient la page persane dans les navigateurs sans WebGL, ont été annulées via l’API dans l’heure et restaurées le jour même une fois le code corrigé.

Chaque écriture suit les mêmes étapes, et chaque ligne du journal porte sa vérification.

Les agents d’IA peuvent lire le contenu via MCP mais ne peuvent pas l’écrire ; élargir cela serait en soi un changement de code, fait à dessein.

Un changement de contenu, du début à la fin

01
ClasserContenu, réglage, quelque chose à rendre éditable une bonne fois, ou code
02
SauvegarderLe document dans les deux langues, avant l’écriture

13Résultats

En ligne, lacunes comprises

En ligne sur arashrezvani.me depuis le 30 août 2026, et ouvert aux réservations depuis le 12 septembre. Toujours ouvert, et consigné : aucune mesure d’audience d’aucune sorte, donc aucun chiffre de visiteurs ; aucun runner de CI, donc un push atteint le site sans vérification de lint ni de types ; aucun e-mail depuis le formulaire de contact ou les réservations, les deux attendent donc dans l’administration ; une recherche seulement à moitié localisée ; des entrées de journal qui ne sont pas de lui ; et des images générées que son site ne signale pas comme telles.

Répétitions relevées et supprimées: 14; L’audit « le dire une fois » sur cinq pages ; chaque correction a été une soustraction.; Résultat mesuré · L’audit de déploiement du langage de design
Tests réussis au dernier contrôle avant mise en production: 307; En plus des vérifications de types, du lint, d’un build de production et d’un smoke test avant le push.; Résultat mesuré · Journal de déploiement, 18 septembre 2026
Le persan et l’anglais à leurs propres URL: Le persan par défaut, les deux moitiés dans hreflang et dans les sitemaps.; Livrable
Un journal de déploiement qui garde ses échecs: 18 exécutions en production consignées, dont cinq en échec, à côté d’un journal distinct de chaque écriture de contenu et de chaque retour en arrière.; Livrable

Ce qui a été livré

Réservation Shamsi

14Ce que j’ai appris

Ce que je garderais, et ce qui m’a piégé

01
Énoncer le langage en une seule phrase
« Aucune ligne sans fin » a tranché les débats sans réunion de plus, car chaque désaccord se ramenait à une seule question : cette ligne aboutit-elle quelque part ?
02
Un site bilingue ne l’est pas tant que chaque langue n’a pas son URL
Le système par cookie passait tous les tests qu’une personne pouvait mener, et échouait complètement pour le visiteur qui compte le plus pour le site d’un écrivain : le robot d’indexation.
03
Une amélioration qui ne sait pas échouer proprement n’en est pas une
Une apparition au défilement en WebGL levait une erreur dans les navigateurs sans WebGL et remplaçait toute une page persane par un message d’erreur. Elle est revenue derrière une détection de capacité et une error boundary qui se replie sur l’image simple.
04
Une règle doit s’appliquer à tout ce qui est ajouté en masse
Chaque page a été mesurée à l’aune de son récit, une par une, sauf le journal : ses entrées sont entrées en un seul lot. C’est la seule partie du site qui échoue au propre test du site, et la première chose à remplacer.

Langue

Arash Rezvani — site éditorial bilingue pour un écrivain et enseignant

Une carrière qui ne tient pas en un seul titre

Vérité, structure et portée

Un petit serveur, sur un réseau filtré

Un designer-développeur, un auteur

Responsable

Coresponsable

Collaboration

Rien de déduit, rien de comblé

Une page par fonction, un seul foyer par fait

Un axiome, et chaque page mesurée à son aune

Du template à un site bilingue en ligne

Une ressemblance tirée de ses propres photos

Des fiches, et tous les endroits que chacune atteint

Six décisions qui ont tenu

Donner à chaque langue sa propre URL

Protéger les réservations par un index de base de données, pas par un hook

De la lecture à la question

Réserver un appel, en cinq étapes

Le faire tourner sans mise en production

Un changement de contenu, du début à la fin

En ligne, lacunes comprises

Ce qui a été livré

Ce que je garderais, et ce qui m’a piégé

Énoncer le langage en une seule phrase

Un site bilingue ne l’est pas tant que chaque langue n’a pas son URL

Une amélioration qui ne sait pas échouer proprement n’en est pas une

Une règle doit s’appliquer à tout ce qui est ajouté en masse

Ne charger une vidéo que lorsqu’on la demande

Garder toute l’infrastructure en Iran

Faire de chaque livre une fiche avec sa propre page

Traiter le contenu comme des données, pas comme une mise en production