Standfirst (Chapeau)
Le chapeau est un texte d’introduction relativement court dont les objectifs sont essentiellement de compléter le titre, afin d’apporter un supplément d’information et de susciter le désir d’en lire plus. Il s’agit le plus souvent d’une synthèse du sujet qui va être développé. Il est positionné juste après le titre dans une liste d’article ou un détail article et c’est l’élément le plus important après ce titre et la photo.
Usage
- Le chapeau se positionne toujours après le titre principal de l’article.
- Il est facultatif.
Bonnes pratiques
- Le chapeau ne doit pas être un résumé de l’intégralité de l’article (ce qui pourrait dissuader de la lecture de cet article).
- Il ne doit pas être composé du début de l’article.
Style & code
Dépendances :
- Classe
sipauisur un parent (par exemple le<body>).
Le chapeau est réservé au contenu éditorial. Il est donc lié aux classes su-article et su-articles-list qui englobent ces zones. Il est identifié par la classe su-standfirst. L’essentiel de son style est porté par cette classe unique su-standfirst. Toutefois, la taille du texte dépend de la situation du chapeau, (liste d’articles ou détail article).
Chapeau dans une liste d’articles
La classe su-standfirst doit être enfant de su-articles-list.
<div class="su-articles-list">
<article>
<p class="su-standfirst">Logoden biniou degemer mat an penn ar bed pegeit, kluchañ fiñval komz bern Arzhon-Rewiz gouzañv ennon spontus dale. Planvour nemet deuet kazetenn war soubañ dirak. Unnek all gomz roc’h vazh sec’h drezoc’h brumenn da, a bragoù skeud tach foenn ni kleñved skrivañ solier, dezho kemener peoc’h mall e atav bed. C’hastell kaozeadenn chaseour hadañ roud ostaleri enni kouevr plouz, izel hag liv Oskaleg met wech doñv bro Gwened, gwir matezh gwez me panevet ribl outo.</p>
</article>
</div>
Chapeau dans un article complet
La classe su-standfirst doit être enfant de su-articles ou porter cette classe en plus.
<article class="su-article">
<p class="su-standfirst">Logoden biniou degemer mat an penn ar bed pegeit, kluchañ fiñval komz bern Arzhon-Rewiz gouzañv ennon spontus dale. Planvour nemet deuet kazetenn war soubañ dirak. Unnek all gomz roc’h vazh sec’h drezoc’h brumenn da, a bragoù skeud tach foenn ni kleñved skrivañ solier, dezho kemener peoc’h mall e atav bed. C’hastell kaozeadenn chaseour hadañ roud ostaleri enni kouevr plouz, izel hag liv Oskaleg met wech doñv bro Gwened, gwir matezh gwez me panevet ribl outo.</p>
</article>
<p class="su-standfirst su-article su-margin-top-m">Logoden biniou degemer mat an penn ar bed pegeit, kluchañ fiñval komz bern Arzhon-Rewiz gouzañv ennon spontus dale. Planvour nemet deuet kazetenn war soubañ dirak. Unnek all gomz roc’h vazh sec’h drezoc’h brumenn da, a bragoù skeud tach foenn ni kleñved skrivañ solier, dezho kemener peoc’h mall e atav bed. C’hastell kaozeadenn chaseour hadañ roud ostaleri enni kouevr plouz, izel hag liv Oskaleg met wech doñv bro Gwened, gwir matezh gwez me panevet ribl outo.</p>
Chapeau sur fond sombre
En ajoutant la classe su-negative sur le chapeau ou sur un parent, il est possible de l’adapter à un fond sombre.
<div class="su-articles-list">
<article class="su-negative">
<p class="su-standfirst">Logoden biniou degemer mat an penn ar bed pegeit, kluchañ fiñval komz bern Arzhon-Rewiz gouzañv ennon spontus dale. Planvour nemet deuet kazetenn war soubañ dirak. Unnek all gomz roc’h vazh sec’h drezoc’h brumenn da, a bragoù skeud tach foenn ni kleñved skrivañ solier, dezho kemener peoc’h mall e atav bed. C’hastell kaozeadenn chaseour hadañ roud ostaleri enni kouevr plouz, izel hag liv Oskaleg met wech doñv bro Gwened, gwir matezh gwez me panevet ribl outo.</p>
</article>
</div>
<div class="su-article su-margin-top-m">
<article class="su-negative">
<p class="su-standfirst">Logoden biniou degemer mat an penn ar bed pegeit, kluchañ fiñval komz bern Arzhon-Rewiz gouzañv ennon spontus dale. Planvour nemet deuet kazetenn war soubañ dirak. Unnek all gomz roc’h vazh sec’h drezoc’h brumenn da, a bragoù skeud tach foenn ni kleñved skrivañ solier, dezho kemener peoc’h mall e atav bed. C’hastell kaozeadenn chaseour hadañ roud ostaleri enni kouevr plouz, izel hag liv Oskaleg met wech doñv bro Gwened, gwir matezh gwez me panevet ribl outo.</p>
</article>
</div>
Liste des classes disponibles
su-standfirstsu-articles-list(zone éditoriale d’une liste d’article)su-article(zone éditoriale d’un article complet)su-negative