Retour à l'organisation du travail

Les dix décisions ouvertes par la revue du 7 octobre

Préparé le 7 octobre 2026 au soir, pour Emmanuel. Dix points, numérotés 22 à 31 dans la section 14 du plan WordPress, ouverts par la revue complète du prototype (rapport : docs/revue-2026-10-07/RAPPORT.md, ses numéros entre parenthèses). Ce sont des choix de rendu, pas de code : tant qu'ils ne sont pas tranchés, le prototype garde la maquette. Les images viennent du prototype ; les simulations sont des règles CSS posées par-dessus le temps d'une capture, rien n'est changé dans le prototype.

Les dix points en un coup d'œil

Tous se tranchent par Emmanuel. Avis utile de Ryan (direction artistique) pour 23, 24 et 31 a, puisqu'ils s'écartent de la maquette ; du client pour 27 (questions 2.6 et 2.12) et 31 e (le fil d'Ariane décidé avec lui le 22/09).

1. Les écrans que la maquette ne prévoit pasPoints 22 et 28

22La frise sur tablette en portrait, sur écran 4:3 et sur téléphone en paysage

Toute la frise est mesurée en pixels de maquette, à l'échelle de la hauteur de l'écran (--px-h, une seule échelle depuis le 06/10). C'est exact en paysage large. Mais plus l'écran est étroit par rapport à sa hauteur, plus les blocs débordent : sur une tablette tenue en portrait (820 x 1180), 27 blocs sur 39 ont un titre ou une carte plus large que l'écran, donc jamais visible en entier. Que fait-on pour ces écrans ?

Pourquoi maintenant : --px-h est l'unité de toute la CSS des 39 blocs, et la règle qui fait passer la frise en vertical (« 768 px et moins ») est écrite dans 97 requêtes média de site.css et dans frise.js. On la fixe avant de les copier dans le thème, pas après.

• Tablette en portrait (820 x 1180)Bloc 19, « The Dock abandonné, le terrain est revendu » : la deuxième ligne du titre est coupée, la troisième est hors de l'écran (I2).
• Écran 4:3 (1024 x 768), fin de la friseLe pied commence 65 px avant le bord gauche : Contact et Informations sont coupés (M12). Il tient à 1280 x 800 et au-delà.
• Téléphone en paysage (844 x 390)La frise reste horizontale sur 390 px de haut : le texte des cartes tombe à 7 px (I2).

28Le pied de page sur tablette

Le pied de page de l'ordinateur (la grille de Daria) se réduit avec la largeur de l'écran, sans plancher : à 820 px de large, son texte fait 9,7 px et ses liens 8 px de haut. Le téléphone a son pied empilé, à partir de 768 px. Que montre-t-on entre les deux ?

Pourquoi maintenant : footer.php est commun à tout le site ; sa règle se fige avant de devenir le gabarit du thème (I11).

2. Lisible et utilisable par tousPoints 23, 24 et 29

Les seuils cités sont ceux des règles d'accessibilité du web (WCAG 2.2, niveau AA), que le projet applique déjà à la vidéo de l'accueil : un rapport de contraste d'au moins 4,5:1 pour un texte courant, 3:1 pour un grand texte (24 px, ou 18,7 px en gras).

23Le contraste de l'ouverture du chapitre 01

Le chapitre 01 s'ouvre sur un fond brun clair (#c6bdac), avec le grand titre « 01 Contexte » et le menu des chapitres en crème : 1,82:1, sous les deux seuils. C'est la maquette. Les chapitres 04 et 05 ont déjà du texte brun sur leur fond clair. Que fait-on du 01 ?

Pourquoi maintenant : dans WordPress, les couleurs d'une ouverture deviennent des champs de la rubrique ; on fixe un couple texte / fond qui passe avant de créer ces champs (I4).

Le chapitre 03 (Contestation) : le grand titre passe, mais le menu (18 px, graisse 600, crème sur #e7315c) est à 4,11:1. Le mettre en gras ne suffit pas : en gras, un texte n'est « grand » qu'à partir de 18,7 px. Un rouge à peine plus foncé, #d92e56, donne 4,58:1 ; ou un menu en 19 px gras (seuil de 3:1).

24Le texte secondaire à 50 % de brun

Les textes secondaires (adresse et lien Itinéraire des cartes d'action, textes des moments clés, intitulés de Crédits, métadonnées de Presse, types de Ressources, coordonnées de Contact, intitulés de la fiche thème) sont en brun à 50 %, le « Brown-opacity » de la maquette : 2,97:1, pour un seuil de 4,5:1. Remonte-t-on ce brun ?

Pourquoi maintenant : la même intention est écrite de six façons dans site.css (--taupe, --brun-50, --color-brown-opacity, --brun-voile, deux color-mix()). Le thème doit naître avec un seul jeton, sinon il recopie les six variantes et l'échec dans tous les gabarits (I5).

29Arrêter ce qui bouge tout seul

Trois choses bougent toutes seules : la vidéo de l'accueil (elle a un bouton Pause), le bandeau d'actualités sous la vidéo (il s'arrête au survol de la souris ou au clavier, jamais au toucher) et la constellation de Vision alternative (elle dérive sans fin, sans aucun arrêt). La règle WCAG 2.2.2 demande un moyen d'arrêter ce qui bouge plus de 5 secondes à côté d'autre contenu. Ajoute-t-on un arrêt aux deux autres ?

Pourquoi maintenant : le bandeau devient une boucle WordPress sur la page d'accueil, et la constellation un gabarit ; le bouton s'écrit avec eux (M43, N7). Le mouvement réduit du système arrête déjà tout, mais peu de visiteurs le connaissent.

3. Ce que l'Alliance gère, et ce que le thème écritPoints 25, 26 et 27

25La page Crédits dans WordPress

La page Crédits : un titre, une phrase, et des colonnes « rôle, puis noms » (dix rôles). Le plan se contredit : sa section 3 met la structure dans page-credits.php, sa section 13 « le texte de la page dans l'éditeur ». Un éditeur de texte ne fait pas ces colonnes. Où vivent les noms ?

Pourquoi maintenant : c'est la page d'Imane ; le gabarit s'écrit dès qu'on sait où sont les noms.

26L'icône du site

Le prototype a son icône (le « M » brun de l'ancien logo, depuis le 07/10) en trois fichiers : SVG, ICO et 180 px pour l'iPhone, écrits dans l'en-tête de chaque page. WordPress a son propre réglage, « Icône du site » (Apparence, Personnaliser, Identité du site). Lequel garde-t-on ?

Pourquoi maintenant : ces balises vont dans header.php, ou n'y vont pas.

27Un champ e-mail dans le formulaire de contact

Le formulaire de la maquette a quatre champs : Nom, Prénom, Sujet, Message. Aucun champ e-mail : quand un message arrive, l'Alliance ne peut pas répondre. Ajoute-t-on un champ e-mail, obligatoire ?

Pourquoi maintenant : page-contact.php reprend ce HTML, et l'extension de formulaire a besoin de la liste définitive des champs (I13). Les étiquettes et l'autocomplétion sont déjà ajoutées dans le prototype.

Dans les deux cas, une page Confidentialité devient nécessaire dès que le formulaire collecte des données (elle est en « # » dans le pied de page aujourd'hui). Le client a deux questions ouvertes : 2.6 (quelle adresse reçoit les messages) et 2.12 (veut-il ce champ).

4. Les détailsPoints 30 et 31

30Les archives par date de WordPress

WordPress crée tout seul des pages d'archives par date (/2025/, /2025/06/) et pose alors la classe date sur le <body>. Or .date est aussi une classe de la frise (la date d'un bloc, position: absolute) : sur ces pages, tout le corps serait placé comme une date. Personne ne les utilise. Les coupe-t-on ?

Pourquoi maintenant : la classe vient de WordPress (get_body_class()), pas de nous ; sans rien faire, on le découvrirait le jour où un article existe pour une date et qu'un moteur de recherche visite /2025/ (N14).

// Pas d'archives par date : personne ne les utilise, et leur classe « date » sur le <body>
// est aussi une classe de la frise (position: absolute)
function marais_sans_archives_date() {
    if ( is_date() ) {
        global $wp_query;
        $wp_query->set_404();
        status_header( 404 );
    }
}
add_action( 'template_redirect', 'marais_sans_archives_date' );

31Sept petits choix de mise en page

Chacun se tranche en une phrase. Le c est le seul à fixer avant de générer les 32 blocs de la frise dans le thème.

Après les décisions

1. Chaque décision est reportée et datée dans le plan WordPress, section 14, et dans la liste des décisions du fichier de reprise.
2. Celles qui changent le rendu (22, 23, 24, 28, 29, 31 b, c et f) se font d'abord dans le prototype, avec des captures avant / après sur les huit formats du banc d'essai, puis le thème recopie le prototype.
3. Celles qui ne concernent que WordPress (25, 26, 27, 30, 31 g) passent dans le plan et le code en réserve (docs/en-reserve/wordpress-gabarits/).
4. Ensuite, l'ordre de construction de la section 19 du plan.