“Link. Deze prachtige winterjas is gemaakt van gerecycled materiaal en houdt je warm tot min 20 graden. Verkrijgbaar in drie kleuren. Nu met 20 procent korting.”
Dat is wat een schermlezer voorleest. De hele alinea. Als één link.
Waarom? Omdat iemand het hele tekstblok in een <a>-tag heeft gewikkeld.
<!-- Niet doen: hele alinea is een link -->
<a href="/product/jas">
<p>Deze prachtige winterjas is gemaakt van gerecycled
materiaal en houdt je warm tot -20 graden. Verkrijgbaar
in drie kleuren. Nu met 20% korting.</p>
</a>
<!-- Wel doen: alleen de relevante tekst -->
<p>Deze prachtige
<a href="/product/jas">winterjas van gerecycled materiaal</a>
houdt je warm tot -20 graden. Verkrijgbaar in drie kleuren.
Nu met 20% korting.</p>
Een link moet beschrijven waar je naartoe gaat. Niet het hele verhaal vertellen.
Waar ik dit tegenkom: productkaarten, nieuwsoverzichten, bloglijsten. De hele kaart is klikbaar gemaakt door alles in een link te wikkelen. Visueel handig. Voor schermlezers een monoloog.
Alternatief voor klikbare kaarten: maak alleen de titel een link en gebruik CSS of JavaScript om de hele kaart klikbaar te maken zonder de HTML te veranderen.
