Overzicht van recent documentoverzicht Chatter

Bronknooppunt: 1586057

Het is niet elke dag dat HTML-koppen het onderwerp zijn de dag, maar mijn map met opgeslagen links verzamelt artikelen over de onlangs gefuseerd verwijdering van het documentoverzichtsalgoritme in de WHATWG Living Standard.

Ten eerste moet je weten dat het algoritme nooit echt heeft bestaan. Natuurlijk, het stond in de specificatie. En zeker, er was een waarschuwing over het gebruik ervan in de specificatie. Maar geen enkele browser heeft het ooit geïmplementeerd, zoals Bruce Lawson herinnerde ons eraan. We hebben de hele tijd in een platte documentstructuur geleefd.

Dit is zeer oud nieuws. Adrian Roselli heeft geschreven over de mythe van het documentoverzicht sinds 2013. Maar het is zijn post uit 2016 met de titel "Er is geen algoritme voor documentoverzicht" die het uitgebreid beschrijft en regelmatig is bijgewerkt met extra stukjes context over de gesprekken en worstelingen die ons hier hebben gebracht. Dit is echt de beste tijdlijn van de saga. Amelia Bellamy-Royds heeft ook gedoken in de wortels van het dilemma in het verleden hier op CSS-Tricks.

Mijn gedachten gaan meteen naar al het werk dat is gestoken in het maken van een documentoverzichtsalgoritme dat secties ondersteunt. Het uit de specificatie verwijderen is zeker de juiste beslissing, maar het doet niets af aan de enorme inspanningen die erin zijn gestoken, ook al is het nu begraven in een versiegeschiedenis. Ik denk ook aan alle goedbedoelende mensen die in de loop van de tijd ten onrechte over het algoritme hebben geschreven (ook op deze site!) met de verwachting dat het net om de hoek was. Er is bijna zeven jaar mentale en technische schuld die we hebben opgebouwd door wat lijkt op een gebrek aan actie.

Als we voorbij het "nieuws" kijken dat het algoritme officieel niet meer bestaat, betreurt Bruce dat er geen generiek is <h> element of iets dergelijks dat kan worden opgedeeld om het juiste kopniveau te produceren. Daar ben ik het mee eens. het hebben van een <h1> element bestaat in wezen als een blootgesteld <title> is beperkend, vooral omdat pagina's zo zelden zijn gestructureerd rond een enkel artikel met een enkele kop op het hoogste niveau. Ik merk dat ik vaak huiver elke keer dat ik een soort kaartcomponent maak waar ik gebruik <h3> is misschien technisch correct, maar voelt niet in orde. En dan hebben we het nog niet eens over de stijloverwegingen waarbij een lager kopniveau er nu uit moet zien als een duidelijk hoger kopniveau.

Over kopniveaubeheer gesproken, Steve Faulkner (die de PR schreef die het algoritme uit de specificatie heeft geplukt) heeft een super praktisch overzicht van het gebruik van de <hgroup> element om koppatronen te verwerken die betrekking hebben op ondertitels, ondertitels, alternatieve titels, en slogans. Ik weet zeker dat je dit soort markeringen in het wild hebt gezien:

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

Dat gaat niet samen met een plat documentoverzicht dat wordt aangedreven door kopniveaus. Elk van die koppen vertegenwoordigt een sectie die een hiërarchie van informatie vormt:

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

Wat we in plaats daarvan willen is een groep van rubrieken. Cue de <hgroup> element:

Wanneer genest binnen a <hgroup> element, de <p> de inhoud van het element vertegenwoordigt een subkop, alternatieve titel of slogan die niet in het documentoverzicht is opgenomen.

We krijgen dus deze structuur:

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

<hgroup> is role=generic op dit moment, maar Steve wijst op een voorstel dat zou het kunnen toewijzen aan role=group. Als dat gebeurt, zal de toegankelijkheidsstructuur helpende technologie toelaten om meer semantische betekenis aan die alinea's toe te kennen als de ondertitel- en slogan-stukken die ze zijn. Klinkt eenvoudig, maar Steve merkt uitdagingen op die in de weg staan. Hij demonstreert ook hoe dit soort patronen vandaag de dag kunnen worden geïmplementeerd met ARIA-attributen.

Zolang we de zaken afronden, heeft Matthias Ott een paar tips gepubliceerd over: een gestructureerd overzicht maken met koppen. Bekijk het einde voor een geweldige lijst met hulpmiddelen om uw kopcontouren te controleren.

Tijdstempel:

Meer van CSS-trucs