Waimia.

Hero Header Sections

hero-essay

stable Sur waimia · 1 Contenu inline (instance)

Énoncer la proposition de valeur

Hero d'article éditorial avec accroche italique et métadonnées auteur, date et temps de lecture.

Instances sur le site

Global 0 instance en page composable

Composé inline inline · non éditable ici

  • src/components/templates/EssayTemplate.astro

Aperçu

Comment l'utiliser

Contrat de slots

Champ Nature Type Requis Bilingue Bornes / valeurs
background Présentation enum Non · paper · paper-2 · paper-3 · ink
kicker Contenu text Oui fr / en ·
h1 Contenu text Oui fr / en ·
lede Contenu text Oui fr / en ·
author Contenu text Oui · ·
date Contenu text Oui · ·
reading_time Contenu text Non fr / en ·
hero_image Contenu image Non · ·
hero_image_alt Contenu image Non fr / en ·
illustration Contenu object Non · ·

Déclinaisons · 16

Combinaisons nommées « variante × palette × densité » appliquées à ce composant, prévisualisées en rendu isolé. 3 curées, 13 générées. Échantillon des 12 premières générées (sur 13) ; toutes accessibles en rendu isolé.

  • Hero essai · papier 2

    curée
    hero-essay--paper-2
  • Hero essai · papier 3

    curée
    hero-essay--paper-3
  • Hero essai · encre

    curée
    hero-essay--ink
  • hero-essay · split

    générée
    hero-essay--split
  • hero-essay · centré

    générée
    hero-essay--centered
  • hero-essay · masthead

    générée
    hero-essay--masthead
  • hero-essay · entonnoir

    générée
    hero-essay--funnel
  • hero-essay · image pleine

    générée
    hero-essay--full-bleed-image
  • hero-essay · empilé

    générée
    hero-essay--stacked
  • hero-essay · minimal

    générée
    hero-essay--minimal
  • hero-essay · avec formulaire

    générée
    hero-essay--with-form
  • hero-essay · split inversé

    générée
    hero-essay--split-reverse
  • hero-essay · fond vidéo

    générée
    hero-essay--video-bg
  • hero-essay · centré étroit

    générée
    hero-essay--centered-narrow
  • hero-essay · avec bande de logos

    générée
    hero-essay--with-logos-strip

Comparer les déclinaisons · 15

Chaque déclinaison, résumée par son écart d'axes face à la démo par défaut du type : seuls les axes qui changent une valeur sont listés. Ouvre-la dans le builder pour l'assembler dans une page.

Sections liées

Même famille

hero-academy-hub stable

Hero hub académie : kicker mono, h1 display, lede et bande de stats mono (cours, parcours, alumni).

hero Hero Header Sections Apparition au scrollSurvolDéfilement +8 16 décl.
hero-asymmetric-grid stable

Héro plein écran en grille multi-lignes asymétrique : titre serif pleine largeur, rangée 2 colonnes (label + lede + 2 CTA à gauche, label + puces fléchées à droite), puis bande de 4 KPI dont la dernière cellule est inversée en ink. Variante paper et ink, responsive.

hero Hero Header Sections BoutonsListeChiffres clés +1 14 décl.
hero-atlas stable

Hero Atlas en deux colonnes avec signature grid, copy éditoriale, CTAs et mini-map des quatre piliers.

hero Hero Header Sections Apparition au scrollDéfilementImage de fond +4 16 décl.
hero-author stable

Hero de page auteur : 2-col copy/portrait, breadcrumb équipe, role eyebrow, h1 split prénom+nom italic accent, lede display.

hero Hero Header Sections Apparition au scrollSurvolDéfilement +8 16 décl.
hero-baseline-stats stable

Héro plein écran à impact typographique : kicker, titre serif géant et lede court en tête, rangée de 4 KPI poussée en baseline (séparée par une hairline forte). CTA optionnel, pas de média. Variante paper et ink, responsive (KPI 2 colonnes sur mobile).

hero Hero Header Sections BoutonsListeChiffres clés +1 14 décl.
hero-capability-band stable

Héro plein écran : titre serif accent et lede alignés à gauche (~70 % de large), puis une bande de capacités asymétrique pleine largeur de 5 cellules dont la 3e (large, accent) porte un KPI serif, les 4 autres des capacités mono. Variante paper et ink, responsive.

hero Hero Header Sections BoutonsListeChiffres clés +1 14 décl.

Même catégorie

hero-academy-hub stable

Hero hub académie : kicker mono, h1 display, lede et bande de stats mono (cours, parcours, alumni).

hero Hero Header Sections Apparition au scrollSurvolDéfilement +8 16 décl.
hero-asymmetric-grid stable

Héro plein écran en grille multi-lignes asymétrique : titre serif pleine largeur, rangée 2 colonnes (label + lede + 2 CTA à gauche, label + puces fléchées à droite), puis bande de 4 KPI dont la dernière cellule est inversée en ink. Variante paper et ink, responsive.

hero Hero Header Sections BoutonsListeChiffres clés +1 14 décl.
hero-atlas stable

Hero Atlas en deux colonnes avec signature grid, copy éditoriale, CTAs et mini-map des quatre piliers.

hero Hero Header Sections Apparition au scrollDéfilementImage de fond +4 16 décl.
hero-author stable

Hero de page auteur : 2-col copy/portrait, breadcrumb équipe, role eyebrow, h1 split prénom+nom italic accent, lede display.

hero Hero Header Sections Apparition au scrollSurvolDéfilement +8 16 décl.
hero-baseline-stats stable

Héro plein écran à impact typographique : kicker, titre serif géant et lede court en tête, rangée de 4 KPI poussée en baseline (séparée par une hairline forte). CTA optionnel, pas de média. Variante paper et ink, responsive (KPI 2 colonnes sur mobile).

hero Hero Header Sections BoutonsListeChiffres clés +1 14 décl.
hero-capability-band stable

Héro plein écran : titre serif accent et lede alignés à gauche (~70 % de large), puis une bande de capacités asymétrique pleine largeur de 5 cellules dont la 3e (large, accent) porte un KPI serif, les 4 autres des capacités mono. Variante paper et ink, responsive.

hero Hero Header Sections BoutonsListeChiffres clés +1 14 décl.

Similaires

hero-hub-listing deprecated

(déprécié → hero-hub-masthead variant=listing) Hero éditorial de hub avec titre monumental et lede courte, sans appel à l'action, pour pages de listing.

hero Hero Header Sections Apparition au scrollSurvolDéfilement +8 16 décl.
hero-course stable

Hero de page cours/formation : kicker accent + title + lede + meta-pills (niveau/durée/format/prix) + cta-group primary/ghost.

hero Hero Header Sections Apparition au scrollSurvolDéfilement +8 16 décl.
hero-centered stable

Hero centré pour poser une proposition de valeur claire et guider vers une action principale.

hero Hero Header Sections Apparition au scrollSurvolDéfilement +8 17 décl.
hero-case-study stable

Hero d'étude de cas avec décor géométrique, titre et barre de spécifications (client, secteur, durée).

hero Hero Header Sections Apparition au scrollSurvolDéfilement +8 19 décl.
hero-landing stable

Hero magnétique landing : eyebrow mono, h1 italique avec emphasis, lede, double CTA et bandeau de disponibilité.

hero Hero Header Sections Apparition au scrollSurvolDéfilement +8 16 décl.
hero-service-detail stable

Hero de page service avec numéro éditorial, titre, accroche et barre de preuves chiffrées optionnelle.

hero Hero Header Sections Apparition au scrollSurvolDéfilement +8 16 décl.

Code

Données de la section (à placer dans sections[])

{
  "type": "hero-essay",
  "kicker_fr": "§ Essay · CRM",
  "kicker_en": "§ Essay · CRM",
  "h1_fr": "Câbler son CRM en <i>10 jours</i> : audit, score, action, mesure.",
  "h1_en": "Wiring your CRM in <i>10 days</i>: audit, score, act, measure.",
  "lede_fr": "Protocole en 4 phases : audit pipeline, scoring comportemental, séquences automatisées, tableau de bord mesure. Opérationnel en 10 jours.",
  "lede_en": "A 4-phase protocol: pipeline audit, behavioural scoring, automated sequences, measurement dashboard. Operational in 10 days.",
  "author": "Simon Beros",
  "date": "28 avril 2026",
  "reading_time_fr": "6 min de lecture",
  "reading_time_en": "6 min read",
  "illustration": {
    "src": "/images/illustrations/ds/man-and-woman-hi-paper.webp",
    "alt_fr": "Illustration : deux personnes se saluent, relation client, duotone éditorial.",
    "alt_en": "Illustration: two people greeting, client relationship, editorial duotone.",
    "side": "right"
  }
}

Pour un agent / MCP

Détail machine de cette section (intention, rôle, contrat de slots, sections liées).

/library/section/hero-essay.json

Chemin du détail machine

/library/section/hero-essay.json