Home > Aan de slag > Het longdesc attribuut en d-links

Het longdesc (long description) attribuut kan worden toegepast op het img (image) element en bevat een URL naar een apart document. In dit document wordt een uitgebreide beschrijving van de afbeelding geplaatst. Er kan in dit document HTML worden gebruikt voor kopregels, paragrafen, enzovoorts; iets wat niet mogelijk is in een alt attribuut.

Inhoudsopgave

[list-items moeten links naar onderstaande koppen (ankers) worden!]

Voorbeeld van het longdesc attribuut

Een afbeelding met het longdesc attribuut (HTML)

  1. <img alt="Het Franse consulaat in Den Haag" longdesc="/images/denhaag-ld.html" ...>

Naar boven

Browserondersteuning

Ondersteuning voor het longdesc attribuut door browsers is verre van optimaal. Voor zover bekend, ondersteunen in elk geval Mozilla browsers (Mozilla, Netscape 6 en later, FireFox) en de JAWS (4.01) screenreader het attribuut. Deze beperkte lijst is echter geen excuus om het attribuut achterwege te laten: bezoekers die baat hebben bij een lange beschrijving van een afbeelding zullen software gebruiken die in hun behoefte voorziet.

Naar boven

Het longdesc attribuut versus het alt attribuut

Verschillen tussen het longdesc en het alt attribuut

  • Een longdesc attribuut mag alleen een URL bevatten en dus geen beschrijving, zoals bij het alt attribuut.
  • Een alt attribuut bevat een alternatieve tekst die de functie van de afbeelding uitdrukt. Het longdesc attribuut linkt naar een meer uitgebreide beschrijving van de afbeelding.

Niet elke afbeelding heeft een uitgebreide beschrijving nodig; zie Het schrijven van effectieve alternatieve teksten: Informatie en illustratie. Om die reden heeft ook niet elke afbeelding een longdesc attribuut nodig. Een effectieve alternatieve tekst – door middel van het alt attribuut – is het belangrijkste: deze maakt de missende afbeelding bruikbaar in de context van de pagina.

Het zou vervelend zijn om het aparte longdesc document te moeten raadplegen om de informatie op de verwijzende pagina te kunnen begrijpen. Daarom zal een longdesc attribuut ook weinig andere toepassingen hebben dan bijvoorbeeld een fotogalerie.

Waarom beschrijvingen in het alt attribuut nuttig zijn

Waarom kunnen webontwikkelaars en contentbeheerders soms een beschrijving van een afbeelding geven in het alt attribuut, terwijl het longdesc attribuut voor beschrijvingen is bedoeld? De informatie die het alt attribuut bevat is voor een belanghebbende bezoeker direct beschikbaar op de pagina waarop de afbeelding staat. Een (korte) beschrijving die noodzakelijk is om de niet getoonde afbeelding in de context van de pagina te kunnen plaatsen, moet in het alt attribuut staan.

Het longdesc attribuut is een aanvulling hierop, wanneer de beschrijving in het alt attribuut niet volledig genoeg is, er ruimtegebrek is (bedenk dat al die beschrijvingen de bestandsgrootte van de pagina opvoeren) of wanneer de webontwikkelaar of contentbeheerder HTML wenst te gebruiken in de beschrijvende tekst (bijvoorbeeld voor een tabel of lijst).

Naar boven

Het maken van uitgebreide beschrijvingen

Een methode voor het maken van uitgebreide beschrijvingen voor het document gelinkt aan het longdesc attribuut, is als u zich probeert voor te stellen dat u de afbeelding over de telefoon aan iemand beschrijft. Hier volgen enkele tips.

  • Beschrijf wat u ziet.
  • Wees helder. Iemand moet zich de afbeelding kunnen voorstellen.
  • De uitgebreide beschrijving is er voor de details, maar ga niet te diep in op onbelangrijke details; noem de details die er toe doen en die kenmerkend zijn voor de afbeelding.
  • Noem kleuren. Een blinde bezoeker die de beschrijving leest, ziet dan wel geen kleuren, maar kent wel de emotionele en symbolische betekenis ervan.
  • Noem het camerastandpunt en posities van objecten. Bijvoorbeeld dat men in de foto van boven af op een tafereel toekijkt en dat iets in de voorgrond, de achtergrond of aan de horizon staat.
  • Probeer in de schrijfstijl de toon van de afbeelding te vangen. Bijvoorbeeld, een grappige afbeelding heeft geen droge, analytische beschrijving nodig, maar een luchtige.
  • Noem tijd. Is de afbeelding een foto die genomen is bij nacht of in de ochtend of namiddag? In de zomer of de winter? Deze gegevens hebben grote invloed op het vermogen van de bezoeker om zich de afbeelding voor te stellen.
  • Indien van toepassing, gebruik vergelijkingen. Zo kan voor bijvoorbeeld een gebouw genoemd worden op welke algemeen bekende gebouwen het lijkt om een indruk te geven van het uiterlijk.
  • Voorzie in een link die terugleidt naar het oorspronkelijke document.

Voorbeeld van een afbeelding met een longdesc attribuut (HTML)

  1. <img src="/images/grachtengordel.jpg" alt="Een blik op de Amsterdamse grachtengordel" longdesc="/images./amsterdam-ld.html" id="grachtengordel">

Voorbeeld van een uitgebreide beschrijving voor deze afbeelding (HTML)

In het bestand amsterdam-ld.html:

  1. <h1>Amsterdamse grachtengordel</h1>
  2. <p>Vanaf een stadsbrug kijkt men neer op de Amsterdamse grachtengordel. Het is een stralende zomerdag, halverwege de ochtend. Het water is bruin en troebel en er passeert een witte rondvaartboot vol toeristen. Aan weerzijden van de gracht staan hoge, 18<sup>e</sup>-eeuwse herenhuizen, waar auto&rsquo;s voor geparkeerd staan, tussen de lindebomen langs het trottoir. Het is niet erg druk op straat: hier en daar loopt een voetganger.</p>
  3. <p><a href="/gallerij/amsterdam.html#grachtengordel" href="#intro">Naar boven</a></p>
  4. <h2 id="d-links">
  5. 	d-links, een alternatief voor het longdesc attribuut</h2>
  6. <p>
  7. 	Uit onvrede over de gebrekkige ondersteuning voor het <code>longdesc</code> attribuut door browsers, is de methode van zogenaamde &lsquo;d-links&rsquo; ontstaan. Een d-link is niet veel meer dan een normale link op de pagina, weergegeven met de letter <em>d</em> (voor description), die refereert naar een document met een uitgebreide beschrijving. De overeenkomst met de werking van het <code>longdesc</code> attribuut moge duidelijk zijn. De webrichtlijnen staan het gebruik van d-links niet toe. Zie <a href="/richtlijnen/webrichtlijnen-1/r-pd-7-3" title="Gebruik geen d-links op websites">R-pd.7.3</a>: Gebruik geen d-links op websites. Het gebruik van het longdesc (<span lang="en" xml:lang="en">long description</span>) attribuut verdient de voorkeur wanneer de alternatieve tekst op het alt attribuut ontoereikend is voor het begrip van de informatie in de afbeelding.</p>
  8. <h3 id="nadelen">
  9. 	Nadelen</h3>
  10. <p>
  11. 	Hoe eenvoudig het idee achter een d-link ook is, er kleven enkele grote nadelen aan:</p>
  12. <ul>
  13. 	<li>
  14. 		Een d-link is voor de meeste bezoekers &lsquo;vervuiling&rsquo; op de pagina. De functie van een gelinkte letter <em>d</em> naast iedere afbeelding is voor de meeste bezoekers niet duidelijk. Ook zullen zij niets aan deze link hebben als zij geen tekstuele beschrijving van afbeeldingen nodig hebben. Al met al vormt een d-link een storend element op de pagina.</li>
  15. 	<li>
  16. 		Een d-link is niet onlosmakelijk verbonden met een afbeelding. Waar een <code>longdesc</code> attribuut associatie heeft met een afbeelding omdat het in het <code>img</code> element voorkomt, heeft een d-link dat niet; met name op pagina&rsquo;s met meerdere, dicht bij elkaar geplaatste afbeeldingen wordt al snel onduidelijk welke d-link bij welke afbeelding hoort.</li>
  17. 	<li>
  18. 		Gebrek aan ondersteuning voor het <code>longdesc</code> attribuut is niet een zorg voor webontwikkelaars of contentbeheerders. Er is software die het attribuut ondersteunt en deze ondersteuning zal toenemen. Bezoekers die de behoefte hebben aan uitgebreide beschrijvingen voor afbeeldingen, zullen software moeten gebruiken die aan hun behoefte voldoet.</li>
  19. 	<li>
  20. 		Een d-link is een voorbeeld van een <a href="/aan-de-slag/het-schrijven-van-goede-linktekst" title="Het schrijven van een goede linktekst">slechte linktekst</a>.</li>
  21. </ul>
  22. <p>
  23. 	<a href="#intro">Naar boven</a></p>