Rezumat al discuțiilor recente privind schița documentului

Nodul sursă: 1586057

Nu este în fiecare zi că titlurile HTML sunt subiectul de zi, dar folderul meu de link-uri salvate acumulează articole despre recent comasat eliminarea algoritmului de schiță a documentului din Standardul de viață WHATWG.

În primul rând, ar trebui să știți că algoritmul nu a existat niciodată cu adevărat. Sigur, era în specificații. Și sigur, a existat un avertisment cu privire la utilizarea acestuia în specificații. Dar niciun browser nu a implementat-o ​​vreodată, așa cum Bruce Lawson ne-a amintit. Trăim într-o structură de documente plată tot timpul.

Asta e foarte stiri vechi. Adrian Roselli a scris despre mitul conturului documentului deoarece 2013. Dar este postarea lui din 2016 intitulată „Nu există un algoritm de schiță a documentului” care explică în mod cuprinzător și a fost actualizat în mod regulat cu pepite suplimentare de context despre conversațiile și luptele care ne-au adus aici. Aceasta este cu adevărat cea mai bună cronologie a sagăi. Amelia Bellamy-Royds are, de asemenea a pătruns în rădăcinile dilemei în trecut aici pe CSS-Tricks.

Mintea mea se îndreaptă instantaneu la toată munca depusă în realizarea unui algoritm de schiță a documentului care acceptă secționarea. Scoaterea acestuia din specificații este cu siguranță chemarea potrivită, dar nu îndepărtează eforturile herculeene care au fost implicate în el, chiar dacă acum este îngropat într-o istorie a versiunilor. Mă gândesc și la toți oamenii bine intenționați care au scris despre algoritm în mod eronat de-a lungul timpului (inclusiv chiar pe acest site!), cu așteptarea că acesta a fost chiar după colț. Sunt aproape șapte ani de datorii mintale și tehnice pe care le-am acumulat din ceea ce pare a fi o lipsă de acțiune.

Privind dincolo de „știrile” că algoritmul nu mai este oficial, Bruce deplânge că nu există un generic. <h> element sau altele asemănătoare care pot fi secţionate pentru a produce nivelul corect al antetului. Sunt de acord. Având o <h1> elementul există în esență ca expus <title> este constrângătoare, mai ales că paginile sunt atât de rar structurate în jurul unui singur articol cu ​​un singur titlu de nivel superior. Adesea mă trezesc de fiecare dată când fac un fel de componentă a cardului unde o folosesc <h3> ar putea fi corect din punct de vedere tehnic, dar se simte neregulat. Și asta chiar înainte de a vorbi despre considerentele de stil în care un nivel de titlu inferior trebuie acum să arate ca un nivel de titlu distinct superior.

Vorbind despre managementul nivelului de titluri, Steve Faulkner (care a fost autorul PR-ului care a scos algoritmul din specificații) are un prezentare generală super practică a utilizării <hgroup> element pentru a gestiona tiparele de titluri care implică subtitluri, subtitrări, titluri alternative, și sloganuri. Sunt sigur că ați văzut markup ca acesta în sălbăticie:

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

Acest lucru nu se potrivește cu un contur plat de document care este determinat de nivelurile de titlu. Fiecare dintre aceste titluri reprezintă o secțiune care formează o ierarhie de informații:

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

Ceea ce ne dorim în schimb este a grup de titluri. Cue the <hgroup> element:

Când este imbricat într-un <hgroup> elementul, cel <p> conținutul elementului reprezintă un subtitlu, un titlu alternativ sau un slogan care nu sunt incluse în schița documentului.

Deci, obținem această structură:

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

<hgroup> is role=generic momentan, dar Steve indică o propunere care l-ar putea mapa role=group. Dacă se întâmplă acest lucru, arborele de accesibilitate va permite tehnologiei de asistență să atribuie mai multă semnificație semantică acelor paragrafe ca subtitrare și slogan care sunt. Sună ușor, dar Steve observă provocările care îi stau în cale. De asemenea, el demonstrează cum acest tip de model ar putea fi implementat astăzi cu atribute ARIA.

Atâta timp cât adunăm lucrurile, Matthias Ott a publicat câteva sfaturi despre crearea unui contur structurat cu titluri. Consultați sfârșitul pentru o listă grozavă de instrumente pentru a vă verifica contururile titlurilor.

Timestamp-ul:

Mai mult de la CSS Trucuri