HTML-Markup für Fußnoten

[Gunnar Bittersmann]

@@Matthias Scharwies

Ich bin grad am Hirnen wie man Fußnoten in HTML umsetzt:

Hast du den ersten Schritt übersprungen: zu hirnen, ob man Fußnoten in HTML umsetzt?

Bei einer Seite Totholz ist das Auge ja schnell von der ⁴² zum Seitenende gesprungen. Und wer sich in weiser Voraussicht die Stelle im Text gemerkt hat, findet den Weg auch wieder zurück.

(Blöd sind da Bücher, wo die Fußnoten nicht am jeweiligen Seitenende, sondern gesammelt am Ende des Buches sind. Noch blöder sine da Bücher, wo die Fußnoten am Ende des jeweiligen Kapitels stehen. Viel Spaß beim Blättern!)

Auf einer Webseite befindet sich der Bereich mit den Fußnoten womöglich außerhalb des Sichtbereichs. Klar kann man das mit seiteninternen Links machen – und auch für den Sprung zurück.

Am Anfang sollte aber die Überlegung stehen, ob man das tun sollte oder ob es nicht besser wäre, die Information gleich im Text unterzubringen.

b. Kitty Giraudel verwendete 2015 Links mit aria-labels, die aber nur auf die Fußnotenübersicht und nicht die jeweilige Fußnote verweisen.

Ohne das jetzt ausprobiert zu haben würde ich denken, ein Screenreader liest dann bei allen Referenzen auf Fußnoten jeweils sämtliche Fußnoten vor. Nicht das, was man will.

Aber auch bei

<p>
  <a href="#css" aria-describedby="css-label" id="css-ref">CSS</a> 
  ermöglicht es aber ...
</p>
<footer>
  <h2 class="visually-hidden" id="footnote-label">Fußnoten</h2>
  <ol>
    <li id="css">
      <span id="css-label">Cascading Style Sheets</span>
      <a href="#css-ref" aria-label="Back to content">↩</a>
    </li>
  </ol>
</footer>

würde ein Screenreader sowas wie „Link: CSS, Cascading Style Sheets“ vorlesen, d.h. die Fußnote gleich mit? Wozu (für diese Nutzerinnen^[1]) dann noch ein Link, wo nichts weiter als nochmals „Cascading Style Sheets“ dahintersteckt?

Was ist jetzt besser - aria oder role? oder beides?

Mir scheint das mit <aside id="fn01" role="doc-footnote"> sinnvoller zu sein. Die Nutzerin^[1:1] kann selbst entscheiden, ob sie zur Fußnote springen will oder nicht.

😷 LLAP

---

1. Generisches Femininum; männliche Nutzer sind mitgemeint. ↩︎ ↩︎