Barrierefreies Webdesign nach BITV 2.0: Alternativtexte bei Bilder

In diesem Blogartikel erkläre ich warum Alternativtexte bei Bilder für barrierefreies Webdesign wichtig sind.

Blinde und einige sehbehinderte Menschen arbeiten mit einem Screenreader

Ein Screenreader ist ein Bildschirmleseprogramm. Wenn ein Mensch blind oder sehbehindert ist, heißt das nicht, dass er nicht am PC/Laptop arbeiten kann. Der Screenreader „spielt“ für den blinden oder sehbehinderten Menschen die Augen und liest den Bildschirminhalt. Die Vermittlung der Informationen auf dem Bildschirm können dabei auf zwei verschiedene Arten geschehen:

Der Screenreader kann nur lesen, deswegen hat er Probleme mit Bildern. Die können nicht gelesen. Deswegen benötigen Bilder Alternativtexte.

Computernutzung bei Blindheit und Sehbehinderung
Blinde Personen können Computer mithilfe einer Braillezeile nutzen. Das Computer-Ausgabegerät stellt Zeichen in Brailleschrift dar und wird üblicherweise durch Screenreader angesteuert. Bildquelle: zlikovec – 428299819 / Shutterstock.com

Alternativtexte bei Bilder – Was ist zu beachten?

Informative Grafiken und Bilder müssen mit Alternativtexten versehen werden. Die Alternativtexte ersetzen das Bild, sie sollen also (wenn möglich) dieselbe Aufgabe erfüllen wie das Bild. Alternativtexte sollten zwischen 80 bis 140 Zeichen lang sein.

Folgende Unterschiede bei Alternativtexte:

Illustrative Bilder und Grafiken

Illustrative Bilder und Grafiken haben einen geringen Informationswert. Sie benötigen einen einfachen Alternativtext. Der Alternativtext sollte nur das wesentliche beschreiben.

Dekorative Bilder und Grafiken

Da diese Art von Bildern zur visuellen Gestaltung dienen bzw. Teil des Seitenlayouts sind, bekommen diese Bilder keinen Alternativtext, sondern ein leeres Alt-Attribut.

Leerer Alternativtext

Wenn ein Bild schon eine Bildunterschrift hat, kann auch ein leeres Alt-Attribut angegeben. So vermeiden Sie eine doppelte Angabe einer Textalternative.

Informative Bilder und Grafiken

Als Informative Grafiken gelten Piktogramme, Schriftbilder, Logos, Icons, Schautafeln, Zeichnungen oder einfache Charts. Informative Bilder sind zum Beispiel Architektur-oder Portraitfotos.

Beispiele für Alternativtexte

Alternativtext für ein Foto:

<img src=“Markus_Lemcke_Barrierefreiheit_Informatik.jpg“ alt=“Markus Lemcke mit Laptop, Ipad und Tablet“ />

Alternativtext für ein Gemälde:

<img src=“monalisa.jpg“ alt=“Weltberühmtes Gemälde der Mona Lisa“ />

Alternativtext für eine Textgrafik:

<img src=“FroheOstern.jpg“ alt=“Frohe Ostern“ />

Alternativtext für ein Piktogramm:

<img src=“laktosefrei.jpg“ alt=“laktose frei.“ />

Suchmaschinen lesen ebenfalls Alternativtexte

Suchmaschinen können, genauso wie Screenreader, keine Bilder anschauen. Deswegen lesen Suchmaschinen auch Alternativtexte. Allerdings sollte der Alternativtext nicht zur Suchmaschinenoptimierung Zweck entfremdet werden.

Schlussbemerkung:

Alternativtexte sind für blinde und sehbehinderte Menschen wichtig. Sogar Suchmaschinen lesen Alternativtexte. Das sind drei gute Gründe warum Sie in Zukunft ihren Bildern immer einen Alternativtext geben sollten. Bei Fragen, rufen Sie mich an 07121/504458 oder schreiben eine Mail info@marlem-software.de .


Barrierefreies Webdesign mit der BITV 2.0 – Artikelreihe

Autor: Markus Lemcke

Ich bin Markus Lemcke, Softwareentwickler, Webentwickler, Appentwickler, Berater und Dozent für barrierefreies Webdesign, barrierefreie Softwareentwicklung mit Java, C# und Python, Barrierefreiheit bei den Betriebssystemen Windows, Android, IOS, Ubuntu und MacOS.

Schreibe einen Kommentar