Gunnar Bittersmann: figure-Element anklickbar machen

Beitrag lesen

@@Jutta-1

<figure>

    <img src="/fotos/aaaa.jpg" alt=""></img>
    <figcaption>
    Das ist mein Hund Waldi
    </figcaption>
  </figure>

img ist ein void element und darf kein End-Tag </img> haben. [HTML §8.1.2]

Ein leerer Wert fürs alt-Attribut geht hier in Ordnung, wenn alles Relevante schon in der Bildunterschrift steht.

Wenn man gut ist, sagt man Screenreadern mittels aria-labelledby, wo denn die Bildbeschreibung zu finden ist:

<figure id="fig42">
	<img src="/fotos/aaaa.jpg" alt="" aria-labelledby="fig42-caption"/>
	<figcaption id="fig42-caption">
		Das ist mein Hund Waldi
	</figcaption>
</figure>

LLAP 🖖

--
“When UX doesn’t consider all users, shouldn’t it be known as ‘Some User Experience’ or... SUX? #a11y” —Billy Gregory