Der richtige Einsatz von ALT und TITLE | Markup Webdesign Journal

10.12.04Der richtige Einsatz von ALT und TITLE

Standards Es geht um den Einsatz dieser beiden Attribute auf Websites. Leider werden diese in zu vielen Fällen noch nicht richtig eingesetzt. Roger Johansson von “456 Berea Street” bringts auf den Punkt und bietet eine echte Referenz zu diesem Thema. So sollte es möglich sein, das alt- und title-Attribut für Bilder und Grafiken richtig einzusetzen.

Mein Beitrag fasst das Wesentliche seines englischsprachigen Artikels zusammen. Es ist zu empfehlen, sich an Rogers “Anweisungen” zu halten. Erstens, um standardgerechtes Webdesign zu fördern, das allen das Web erleichtert. Zweitens geht es auch darum - und das muss immer wieder betont werden - an Behinderte Menschen im Internet zu denken. Um so zumindest ein gewisses Maß an Barrierefreiheit zu gewährleisten. Ja, auch Blinde surfen…

Das Alt-Attribut

Das Alt-Attribut eines Bildes sollte nicht “missbraucht” werden. Also nicht dazu benutzt werden, einen Tooltipp anzuzeigen. U.a. auch deshalb, weil nur der Internet Explorer diesen (fälschlicherweise) darstellt. Für etwa 40% der Besucher meiner Seiten wäre das somit sinnlos. Alternativ kann hier das title-Attribut verwendet werden. Darüber hinaus ist der Einsatz des alt-Attributs anderen Funktionen vorbehalten. Es dient dazu, alternativ Text anzubieten, gewissermaßen als Platzhalter für eine Grafik oder Bild, aber auch andere Objekte wie Applets z.B. Das kann aus mehreren Gründen erforderlich sein. Für reine Textbrowser, die keine Bilder und ähnliche Objekte anzeigen können. Für Menschen, die aus Ladeperformancegründen oder weil sie sich schnell informieren wollen, die Darstellung von Bildern im Browser ausschalten. Oder auch für Sehbehinderte und Blinde Menschen, die sich Websites vorlesen lassen oder beispielsweise mit Hilfe von Braillegeräten “lesen”.

Der alternative Text sollte Sinn machen und nützliche Information bereitstellen. Dekorative Grafiken (das muss ich auch verbessern) sollten mit einem leeren Attributwert versehen werden. So: alt=”". Denn es macht wenig Sinn hier z.B. “Listensymbol” reinzuschreiben. Auf gar keinen Fall sollte das alt-Attribut ausgelassen werden. Lässt sich ein Besucher die Seite mit einem Screenreader vorlesen, bekommt er dann den Dateinamen der Grafik vorgelesen, was meist wenig sinnvoll und vor allem nervig und frustrierend ist.

Das Title-Attribut

Es kann, wie oben schon erwähnt, zum Darstellen eines Tooltipps verwendet werden. Wobei es auch hier zu bedenken gilt, dass nicht alle Browser diesen darstellen werden. Aber in diesem Fall die allermeisten. Die eigentliche Verwendung findet es allerdings im Zusammenhang mit einer benutzerfreundlichen Navigation. Es wird meist bei Links, ob reine Textlinks oder Grafiklinks, eingesetzt. Das macht auch in vielen Fällen extrem viel Sinn. Denn oft weiß der Besucher nicht, wohin ihn der Link führen wird, bzw. was ihn hinter dem Link inhaltlich erwartet. Es ist oft hilfreich hier einen guten Text einzusetzen, um Frustrationen zu vermeiden und dem Besucher, vor allem bei größeren Webangeboten, eine Orientierungshilfe zu bieten.

Auch hier gilt es wieder an behinderte Menschen zu denken. Nichts ist schlimmer als ein title-Attribut mit dem Text “Hier klicken”. 20 mal oder öfter “Hier klicken” vorgelesen zu bekommen schließt jegliche Orientierung auf der Website aus.

Auch das title-Attribut kann “leer” gelassen werden. Das ist dann der Fall, wenn die Links selbsterklärend sind. So z.B. “Kontakt”, “Impressum” etc. Bei anderen Links, die eben nicht in einem Wort zusammenfassen können, um was es sich handelt, sollte ein sinnvoller, erklärender Text gewählt werden.

Hier noch drei Links zu meinen Erfahrungen als “blinder” Surfer und eine gute Alternative Bildlegenden zu Bildern zu bieten.

Roger Johansson gibt uns noch eine Liste nützlicher Links zum Thema zur Hand. Außerdem wird auf seiner Seite noch das longdesc-Attribut erwähnt, das für längere Beschreibungen von Grafiken dienen kann.