Tour d'horizon des aperçus de documents récents Chatter PlatoBlockchain Data Intelligence. Recherche verticale. Ai.

Récapitulatif des discussions récentes sur les contours de documents

Ce n'est pas tous les jours que les titres HTML sont le sujet du jour, mais mon dossier de liens enregistrés accumule des articles sur le récemment fusionné suppression de l'algorithme de contour de document dans le WHATWG Living Standard.

Tout d'abord, il faut savoir que l'algorithme n'a jamais vraiment existé. Bien sûr, c'était dans la spécification. Et bien sûr, il y avait un avertissement concernant son utilisation dans la spécification. Mais aucun navigateur ne l'a jamais implémenté, car Bruce Lawson nous a rappelé. Nous avons vécu dans une structure de document plate tout le temps.

Ceci très vieilles nouvelles. Adrian Roselli a écrit sur le mythe du plan de document depuis 2013. Mais c'est son post de 2016 intitulé "Il n'y a pas d'algorithme de contour de document" qui l'énonce de manière exhaustive et a été mis à jour régulièrement avec des pépites supplémentaires de contexte sur les conversations et les luttes qui nous ont amenés ici. C'est vraiment la meilleure chronologie de la saga. Amelia Bellamy-Royds a également plongé dans les racines du dilemme dans le passé ici sur CSS-Tricks.

Mon esprit va instantanément à tout le travail qui a été fait dans la création d'un algorithme de contour de document qui prend en charge le sectionnement. Le supprimer de la spécification est certainement la bonne décision, mais cela n'enlève rien aux efforts herculéens qui y ont été consacrés, même s'il est maintenant enfoui dans l'historique des versions. Je pense aussi à toutes les personnes bien intentionnées qui ont écrit à tort sur l'algorithme au fil du temps (y compris sur ce site même !) Avec l'espoir qu'il était juste au coin de la rue. Il y a près de sept ans de dette mentale et technique que nous avons accumulés à cause de ce qui semble être un manque d'action.

Au-delà des "nouvelles" selon lesquelles l'algorithme n'est officiellement plus, Bruce déplore qu'il n'y ait pas de générique <h> élément ou similaire qui peut être sectionné pour produire le niveau de titre correct. Je suis d'accord. Avoir un <h1> l'élément existe essentiellement en tant qu'élément exposé <title> est contraignant, d'autant plus que les pages sont si rarement structurées autour d'un seul article avec un seul titre de premier niveau. Je me retrouve souvent à grimacer chaque fois que je fabrique une sorte de composant de carte où j'utilise <h3> peut être techniquement correct, mais se sent hors d'usage. Et c'est avant même que nous parlions des considérations de style où un niveau de titre inférieur doit maintenant ressembler à un niveau de titre supérieur distinct.

En parlant de gestion du niveau de titre, Steve Faulkner (auteur du PR qui a extrait l'algorithme de la spécification) a un aperçu super pratique de l'utilisation du <hgroup> élément pour gérer les modèles de titres qui impliquent des sous-titres, des sous-titres, des titres alternatifs et des slogans. Je suis sûr que vous avez déjà vu un balisage comme celui-ci dans la nature :

<h1>Disappointingly Average</h1>
<h2>The Autobiography of Geoff Graham</h2>
<h3>by Geoff Graham</h3>

Cela ne correspond pas à un plan de document plat piloté par des niveaux de titre. Chacune de ces rubriques représente une section qui forme une hiérarchie d'informations :

Disappointingly Average
└── The Autobiography of Geoff Graham
    └── by Geoff Graham

Ce que nous voulons à la place, c'est un groupe de rubriques. Cue le <hgroup> élément:

Lorsqu'il est imbriqué dans un <hgroup> élément, le <p> le contenu de l'élément représente un sous-titre, un titre alternatif ou un slogan qui ne sont pas inclus dans le plan du document.

Ainsi, nous obtenons cette structure :

<hgroup>
  <h1>Disappointingly Average</h1>
  <p>The Autobiography of Geoff Graham</p>
  <p>by Geoff Graham</p>
</hgroup>

<hgroup> is role=generic pour le moment, mais Steve pointe vers une proposition qui pourrait le mapper à role=group. Si cela se produit, l'arborescence d'accessibilité permettra à la technologie d'assistance d'attribuer une signification plus sémantique à ces paragraphes en tant que sous-titres et slogans qu'ils sont. Cela semble facile, mais Steve note les défis qui se présentent. Il montre également comment ce type de modèle pourrait être implémenté aujourd'hui avec les attributs ARIA.

Tant que nous arrondissons les choses, Matthias Ott a publié quelques conseils sur créer un plan structuré avec des titres. Consultez la fin pour une excellente liste d'outils pour vérifier vos contours de titre.

Horodatage:

Plus de Astuces CSS