Wanneer een afbeelding en tekst allebei naar dezelfde pagina verwijzen, kun je deze combineren tot één enkele hyperlink.
Soms wil je dat een afbeelding en tekst naar dezelfde pagina verwijzen. Bijvoorbeeld in het geval van een artikel met een titel en een bijbehorende afbeelding of in het geval van een tekst met een link in combinatie met een icoon. Je hebt geen twee aparte links nodig: combineer ze.
Aangezien er geen dubbele links zijn, is de site minder complex voor bezoekers met tekst-naar-spraak software. Ze hoeven ook niet elke link twee keer te laten lezen. Bezoekers die het toetsenbord gebruiken hoeven niet twee keer op de tab-toets te drukken om naar de volgende link te gaan.
Hoe pas je dit toe?
Wees voorzichtig als twee links naar dezelfde pagina naast elkaar staan. Dit kan het geval zijn in navigatiemenu's met een pictogram voor gekoppelde tekst, maar ook in artikeloverzichten die bestaan uit één afbeelding en één tekst per artikel. Pas de structuur van de HTML-code aan zodat er slechts één link is (het HTML-element <a>) die zowel afbeelding als tekst bevat.
Geen alt-tekst voor afbeelding
Als je dit systeem gebruikt, zorg er dan voor dat de afbeelding geen beschrijvende tekst (alt-tekst) bevat, zodat de tekst-naar-spraaksoftware niet twee keer dezelfde tekst leest.
Voorbeeld: link in navigatiemenu
Het navigatiemenu bevat één pictogram per item dat aan een tekst is gekoppeld. De twee verschijnen in hetzelfde element <a> en vormen dus een enkele link. De afbeelding heeft geen alt-tekst (het alt-attribuut is leeg).
<a href=”diensten”><img src=”diensten.jpg” alt=”” />Diensten</a>
Voor redacteurs
Als de redacteur een afbeelding en een tekst plaatst die naar dezelfde pagina moeten verwijzen, moet hij erop letten dat hij slechts één link toevoegt die beide elementen bevat.
Voor ontwikkelaars
In de meeste gevallen is de ontwikkelaar verantwoordelijk voor de HTML-structuur, inclusief navigatiemenu's en previews.