Quiz : Textes, titres et sections

Diagnostique un vrai extrait PulsaConf : La page a deux h1 et un bloc générique pour une session autonome.

Objectifs de la leçon

  • Construire les décisions de « Textes, titres et sections » avec un élément HTML adapté.
  • Ajouter les attributs qui rendent la structure testable.
  • Expliquer l'impact utilisateur de la décision prise.

Transformer le contenu en plan lisible

La sémantique ne consiste pas à remplacer tous les div par d'autres balises. Elle consiste à identifier le rôle réel de chaque contenu et les relations qui organisent sa lecture.

« Quiz : Textes, titres et sections » sert ici à rendre les décisions de « Textes, titres et sections » explicite dans le document.

Décision éditoriale et sémantique

Commence par le plan des titres, puis choisis l'élément natif qui correspond à l'autonomie ou à la fonction du bloc : section, article, aside, citation ou information de contact.

Évite de traiter les décisions de « Textes, titres et sections » comme un simple détail visuel : le choix doit rester compréhensible dans le DOM et justifiable en revue de code.

Lecture sans mise en forme

Relis la page comme un plan textuel. L'ordre des titres et les limites des sections doivent expliquer PulsaConf même lorsque CSS et JavaScript sont absents.

Pour html-02-semantics-quiz, commence par le premier test en échec et relie son message à l'élément, l'attribut ou la relation concernée.

Vocabulaire lié

  • main — Landmark du contenu principal.
  • section — Regroupement thématique nommé.
  • article — Contenu autonome réutilisable.
  • heading — Titre qui structure le plan.
  • details — Zone d'information dépliable native.

Validation

  • Je sais expliquer pourquoi les décisions de « Textes, titres et sections » améliore PulsaConf.
  • Je peux relier chaque test à une exigence utilisateur.
  • Je garde une structure compréhensible sans style CSS.

Ouvrir la leçon interactive