Faits et chiffres
Les faits avec leur carré, les repères chiffrés, les paires clé et valeur.
Les faits
Une rangée de cellules, un carré vert devant chaque fait, et, en dernière cellule, un bouton s’il y a une suite. Les faits ne sont plus sur l’accueil depuis le 12 octobre, ni le bouton « Rencontrer l’équipe » qui les suivait : ils restent sur la page de l’équipe (/a-propos/), sous la grille de la maison, sans bouton.
- Emploi
- Dire trois ou quatre faits arrêtés, en une ligne chacun : l’ancienneté, l’effectif, le suivi inclus.
- Moment
- Sous une grille, collés à elle : sur la page de l’équipe, sous le texte et la photo des bureaux.
- Jamais
- Un chiffre absent de marque.ts et des fiches. Un fait de plus de quelques mots : c’est une ligne, pas un paragraphe.
- 5 ans, à Nantes et à Paris
- Autour de quinze personnes
- Un mois de suivi offert après la mise en ligne
<Faits faits={ V3.ouverture.faits } />
<!-- bouton={{ href, libelle }} : une dernière cellule avec un bouton au trait, petit. Aucune page ne le pose depuis le 12 octobre. -->| Classe | Zone | Valeur |
|---|---|---|
| .tr-faits | la grille | 1 ; 2 dès 600 px ; var(--n, 4) dès 1000 px, --n posé par le composant : le nombre de faits, plus un s’il y a un bouton, soit 3 colonnes sur la page de l’équipe ; margin-top -1 px, pour coller à la grille du dessus ; data-stagger 80 |
| .tr-faits li | un fait | flex, centré verticalement, gap 14 px ; Inter 500 16,5 px/1.4, var(--ink) |
| .tr-carre | le carré | 10 × 10 px, var(--grinn), aria-hidden ; dans .tr-faits, le premier en vert moyen (#60B8AF), le deuxième en vert profond ; .tr-carre--grand, 14 px, pour une ouverture de bloc |
| .tr-faits__cta | le bouton | cellule centrée ; bouton au trait, petit ; posé seulement avec la prop bouton, qu’aucune page ne donne aujourd’hui |
| faits | les données | V3.ouverture.faits : 5 ans, à Nantes et à Paris ; Autour de quinze personnes ; Un mois de suivi offert après la mise en ligne |
| où | les pages | la page de l’équipe (a-propos.astro) seulement ; l’accueil ne les pose plus depuis le 12 octobre |
Les repères chiffrés
La valeur en Outfit, la légende en capitales, une cellule chacun. Seulement des faits arrêtés : l’ancienneté, le suivi inclus, le prix de la reprise en main. Aucun autre chiffre n’est arrêté à ce jour pour Grinn. Les faits d’un cas, tirés de sa fiche, ont leur propre forme, sur la carte d’un cas en largeur (voir Page Réalisations).
- Emploi
- Poser deux à quatre repères qu’on peut tenir, dans une page d’offre ou la page de l’équipe.
- Moment
- Quand la page a besoin d’un chiffre, et seulement si ce chiffre est dans marque.ts ou dans une fiche.
- Jamais
- Un pourcentage, un nombre de projets ou de clients, une durée type : rien de cela n’est arrêté. Un chiffre arrondi pour faire bien.
- 5 ans à Nantes et à Paris
- 1 mois offert après la mise en ligne
- 0 € pour reprendre la main
import { MARQUE } from '../data/marque'
<Chiffres chiffres={[
{ valeur: MARQUE.anciennete, legende: 'à Nantes et à Paris' },
{ valeur: '1 mois', legende: 'offert après la mise en ligne' },
{ valeur: '0 €', legende: 'pour reprendre la main' },
]} />| Classe | Zone | Valeur |
|---|---|---|
| .tr-chiffres | la grille | 1 ; 2 dès 600 px ; var(--n) dès 1000 px, --n le nombre de repères, 4 au plus ; data-stagger 80 |
| .tr-chiffres li | un repère | flex en colonne, gap 8 px |
| .tr-chiffres__v | la valeur | Outfit 800 clamp(34px, 3.6vw, 52px)/1, -.03em, chiffres de tableau, var(--ink) |
| .tr-chiffres__l | la légende | Inter 600 11 px/1.5, .14em, capitales, chiffres de tableau, var(--ink-3) |
| chiffres | les données | valeur et légende ; la valeur vient de marque.ts (anciennete, SUIVI) ou d’une fiche, jamais de la page |
Les paires clé et valeur
Des paires séparées d’un trait pointillé : la clé en capitales, la valeur à l’encre. Une valeur absente se marque en clair, avec la pastille d’attente. On la trouve dans la fiche d’une page d’offre, les pages de l’équipe, des carrières, du contact et des offres, et dans les pages légales. La page de cas n’emploie plus ce composant : sa fiche est une liste à elle, FicheCas (voir Page de cas).
- Durée réelle
- à arrêter
- En service depuis
- à écrire
- Offre
- IA et automatisation
<Cles paires={[
{ cle: 'Durée réelle', valeur: null, attente: 'à arrêter' },
{ cle: 'En service depuis', valeur: null },
{ cle: 'Offre', valeur: 'IA et automatisation' },
]} />| Classe | Zone | Valeur |
|---|---|---|
| .tr-cles | la liste | dl en grid ; ligne pointillée du haut |
| .tr-cles > div | une paire | une colonne ; 220 px et le reste dès 600 px ; gap 4/24 px ; padding 14 px clamp(20px, 3vw, 48px) ; ligne du bas |
| .tr-cles dt | la clé | Inter 600 11 px/1.6, .14em, capitales, chiffres de tableau, var(--ink-3) |
| .tr-cles dd | la valeur | var(--ink), interligne 1.55 |
| valeur null | ce qui manque | EnAttente, avec le libellé attente ; « à écrire » par défaut |
| où | l’emploi | la fiche d’une page d’offre (pour qui, durée, outils), la page des offres, l’équipe, les carrières, le contact, les pages légales ; la page de cas ne l’emploie plus depuis le 12 octobre |
Ce qu’on ne chiffre pas
Un chiffre qui n’est pas arrêté n’apparaît pas, nulle part, même approximatif. La page dit qu’il manque, et ce qu’il reste à faire pour l’obtenir.
| Ce qu’on ne fait pas | Pourquoi | À la place |
|---|---|---|
| Compter dans un titre | le titre dit le gain, pas le nombre | « Partez de ce que vous voulez gagner. » |
| Un pourcentage, un résultat | aucun résultat chiffré n’a été fourni par un client ; resultat vaut null dans chaque fiche de réalisation | aucune page ne l’affiche : la fiche d’une page de cas n’a pas de ligne pour lui, et les faits d’un cas en largeur (page Réalisations) disent une durée, une année, un outil ou un fait propre au cas, jamais un résultat |
| Une durée type d’offre | elle n’est pas arrêtée : duree vaut null dans chaque fiche d’offre | « à arrêter » sur la page d’offre, jusqu’à ce que la fiche la donne |
| La durée réelle d’un cas | c’est un fait du projet, pas une promesse : la fiche de réalisation la donne en toutes lettres ; sans durée : Bosco Services | la ligne Durée de la fiche d’une page de cas ; sans durée, la ligne ne s’affiche pas |
| Un nombre de projets ou de clients | jamais arrêté ; le vérificateur bloque la volumétrie | les logos, et les cas nommés |
| Une ancienneté autre que celle de marque.ts | le vérificateur bloque toute autre date ou durée | MARQUE.anciennete |
| Un prix dans un titre ou sur un bouton | le prix s’affiche, il n’argumente jamais ; le vérificateur bloque | .tr-prix dans la carte, .tr-suivi__prix dans le suivi |
RègleUn chiffre s’affiche quand il est arrêté dans marque.ts ou dans une fiche ; sinon la page dit qu’il manque.