Eigentlich ganz einfach – das Befüllen des ALT-Attributs in Bildern. Aber dem ist nur bedingt so.
Auch wenn es sich hier um einen Grundlagenartikel handelt, halte ich ihn trotzdem für sehr lesenswert: Appropriate Use of Alternative Text (WebAIM, via AccessBlog). Vor allem wird systematisch mit unterschiedlichen Beispielen klargemacht, wie das ALT-Attribut in Bildern sinnvoll genutzt werden kann:
Bilder mit Bildunterschrift
Wenn bei Bildern eine Bildunterschrift gegeben ist, dann kann das ALT-Attribut im Bild leer bleiben.
Bilder ohne Bildunterschrift
Wenn Bilder keine Bildunterschrift haben, dann muss das ALT-Attribut mit Inhalt gefüllt werden.
Bilder mit Links
Bilder, die mit einem Link versehen sind, dürfen nie ein leeres ALT-Attribut aufweisen. Es sollte im ALT-Attribut des Bildes klar werden, welche Funktion der Link hat und zu welchem Inhalt er führt. Wenn der Link selbst keine nähere Bezeichnung hat, muss das ALT-Attribut des Bildes geradezu diese Lücke füllen.
Funktionelle Grafiken
Bei Navigationsgrafiken reicht es, den Namen des Navigationspunktes als ALT-Attribut zu verwenden.
Wenn z.B. Icons auf Dateien verweisen und auch auf diese verlinkt sind, soll im ALT-Attribut des Icons klar vermerkt werden, um welche Datei es sich handelt, z.B. um eine PDF-Datei. Falls das Icon ohne erklärenden Text erscheint, muss im ALT-Attribut diese notwendige Information vermerkt werden.
Grafiken, die nur dem Layout dienen
Das ALT-Attribut dieser Grafiken muss leer bleiben. Besser wäre es, wenn diese Grafiken als Hintergrund eingebunden werden, dann gibt es im Quelltext keine Leerstände. 😉 Gleiches gilt für Grafiken, die dem Inhalt keine wesentliche Information hinzufügen, eher nur zur Illustration dienen.
Formulare: Buttons mit Grafik
In Formularen müssen alle Buttons, die eine Grafik verwenden, mit einem ALT-Attribut versehen werden, damit Funktion und Inhalt des Buttons verständlich wird.
Hintergrundbilder
Hintergrundbildern kann man ohnehin kein ALT-Attribut hinzufügen, was auch nicht sinnvoll wäre (s. oben Grafiken, die nur dem Layout dienen). Wenn ein Bild Inhalt vermitteln soll, darf es nicht als Hintergrundgrafik gesetzt werden.
Klasse Artikel!
Danke! 🙂 Aber der Dank gebührt dem englischen Orginal. Ich habe das nur ein wenig gestrafft ins Deutsche gebracht.
Accessibility Checkliste…
Markup Trennen Sie Inhalt vom Layout und nutzen Sie passende Auszeichnungen für die Struktur Ihrer Seite. Nutzen Sie beispielsweise Listen (<ul>, <ol>, <dl>) anstelle von Text mit einem <br> nach jedem Punkt. Semantischer Code …
Nun habe ich schon an anderer Stelle auf dieser Site erzählt, dass es zu Problemen führt, wenn man Bildern mit Link ein ALT-Attribut gibt, das nicht über das Bild sondern den Inhalt des Links informiert. Dadurch verschiebt sich im Google-Index alles. Es ist besser, im ALT-Attribut des Bildes über den Inhalt des Bildes zu informieren oder es leer zu lassen, wenn es nur ein Icon ist, und Informationen über den Link in ein TITLE-Attribut des Links zu schreiben:
Hoffe, der Code wird richtig angezeigt.
Auf diese Weise wird gruene-wiese.html mit dem Foto gruene-wiese.jpg unter dem Suchwort „Grüne Wiese“ angezeigt, und nicht das Icon-GIF.
Ah, Sie haben sich hier die Frage ja schon selbst beantwortet. 🙂
Ja, aber es geht nicht nur um die Auffindung bei Google, sondern das ALT-Attribut von Bildern dient dazu, wenn das Bild nicht angezeigt werden kann, einen alternativen Inhalt bereit zu stellen. Geben Sie in diesem Fall dem Bild den Inhalt des Linkes, würde der Inhalt des Bildes nicht zur Verfügung stehen.