Die Bilder für deine Website richtig in der Mediathek zu beschriften, war schon immer ein wichtiges SEO-Thema. Mehr dazu findest du auch meinen Blogbeitrag „Bilder optimieren für die Website„. Besonderes Augenmerk liegt dabei auf dem sog. „alt-Text“ (alternativer Text), da dieser sowohl von Suchmaschinen ausgelesen als auch von Screenreadern vorgelesen wird – und spielt somit eine zentrale Rolle für dein SEO und für die Barrierefreiheit deiner Website.
Dieses Feld wird sehr oft verwendet, Keywords geschickt unterzubringen und das ist auch richtig. Doch es gibt Bilder, bei denen das keinen Sinn macht. Und hier kommt ein Perspektivwechsel ins Spiel.
Die Barrierefreiheit wirft ein neues Licht auf alt-Texte
Mit dem Barrierefreiheitsstärkungsgesetz rückt ein weiterer Aspekt in den Vordergrund: die Zugänglichkeit deiner Website für Menschen mit Einschränkungen.
Barrierefrei bedeutet unter anderem:
Menschen mit Sehbehinderungen lassen sich Websites vorlesen – einschließlich der Bildbeschreibungen.
Das BFSG unterscheidet dabei zwischen
- Dekorativen Bildern
- Kontextbezogenen Bildern (also inhaltlich relevante Bilder)
Was sind kontextbezogene Bilder?
Alle Bilder, die inhaltlich zum Thema deiner Website passen oder es sinnvoll ergänzen.
Typische Beispiele für kontextbezogene Bilder:
- Portraits von dir als Coach
- Produktbilder für einen Onlineshop
- Screenshots, z.B. für Tutorials
- Bilder von Veranstaltungsräumen
- Grafiken oder Infografiken mit einer Aussage
Bilder, die nur zur Dekoration dienen
Es ist ganz normal, auf einer Website auch Bilder zu verwenden, die mit deinem Thema direkt nichts zu tun haben. Sie dienen nur der Gestaltung oder Atmosphäre.
Beispiele für dekorative Bilder:
- Blütenbilder
- Landschaftsaufnahmen
- Texturen oder Muster für Hintergründe
- Symbole ohne Funktion
Solche Bilder werden nicht im alt-Text beschrieben.
Neues Denken bei der Bildbeschriftung
Auch wenn die Keywords an dieser Stelle wichtig sind, so dürfen wir heute auch an alle Menschen denken, die sich die Websites vorlesen lassen. Welche Informationen sind für jemanden wichtig, der das Bild nicht sehen kann?
Also: wenn es relevant ist, beschreiben. Wenn nicht, bleibt das Feld leer (siehe weiter unten).
Alt-Text für kontextbezogene Bilder richtig nutzen
Wichtig ist für die Barrierefreiheit zu beschreiben, was auf dem Bild zu sehen ist – damit sehbehinderte Menschen eine Vorstellung davon haben. Zum Beispiel so:
- [Dein Name], Coach für [dein Thema] im Gespräch mit einer Klientin
- Portraitfoto von [Dein Name], Coach für [dein Thema], in die Kamera lächelnd
- Freundlicher Seminarraum mit einem Stuhlkreis und einem großen Blumenstrauß in der Mitte
- Screenshot von der WordPress-Mediathek
- Frau liegt erschöpft auf der Couch – Symbolbild für Burnout
Schau hier einfach, wie du deine Keywords unterbringen kannst, ohne den Sinn des Bildes zu stören. Diese Beispiele sollen dir nur ein Gefühl dafür geben, wie du die alt-Texte in Zukunft für dich nutzen kannst.
Welchen alt-Text für dekorative Bilder?
Für dekorative Bilder gibst du keinen eigenen Text ein. Damit Google jedoch nicht vergebens versucht, eine Bildbeschreibung zu finden, helfen wir uns mit diesem kleinen Text:
alt=““
Das trägst du so in das alt-Text-Feld in der Mediathek ein. Dies signalisiert Suchmaschinen und auch Screenreadern: Dieses Bild ist rein dekorativ und kann ignoriert werden. So vermeidest du unnötige Verwirrung und hilfst dabei, deine Website klarer zu strukturieren.
Fazit:
Alt-Texte sind mehr als nur ein SEO-Feld. Sie sind ein kleiner, aber entscheidender Schritt zu einer inklusiven Webwelt.
Mit ein bisschen Achtsamkeit kannst du gleichzeitig für mehr Sichtbarkeit und echte Zugänglichkeit sorgen.
Dieser Blogbeitrag ist Teil einer Mini-Serie zum Thema Barrierefreiheit. Hier geht es zum ersten Beitrag: „Barrierefreies Webdesign – ja oder nein„.
