Alt-Text

Bilder sind ein zentraler Bestandteil moderner Webseiten. Damit sie jedoch ihr volles SEO-Potenzial entfalten können, benötigen sie einen Alt-Text.

Der Alt-Text ist ein Attribut des <img>-HTML-Elements. Im Quellcode einer Webseite sieht das typischerweise so aus:

<img src="beispiel-bild.jpg" alt="Beschreibung des Bildinhalts">

Das alt-Attribut enthält die eigentliche textliche Beschreibung. Dieser Text ist für den durchschnittlichen Besucher der Webseite nicht direkt sichtbar, es sei denn, das Bild wird aus technischen Gründen (z.B. langsame Verbindung, fehlerhafter Pfad) nicht dargestellt.

Alt-Texte werden vorrangig gesetzt, um Barrierefreiheit zu gewährleisten und keine Nutzer von deinen Inhalten auszuschließen. Für Menschen mit Sehbehinderungen, die auf Screenreader (Vorlese-Software) angewiesen sind, ist der Alt-Text unerlässlich. Er übersetzt den visuellen Inhalt eines Bildes in eine hörbare Beschreibung und ermöglicht so einen gleichberechtigten Zugang zu Informationen. Ohne Alt-Text bleibt der Bildinhalt für diese Nutzergruppe unzugänglich.

Darüber hinaus sind Alt-Texte ein wunderbares Mittel, um Suchmaschinen mitzuteilen, welche Inhalte auf deinen Bildern dargestellt werden. Da diese meist im inhaltlichen Kontext deiner Seite stehen, ist es nicht abwegig, dass diese Bilder auch die Zielkeywords deiner Seite behandeln.
Suchmaschinen-Crawler können Bilder zwar erkennen, aber deren Inhalt nicht so interpretieren wie Menschen. Der Alt-Text liefert den Crawlern entscheidenden Kontext darüber, was auf einem Bild dargestellt ist. Dies hilft Suchmaschinen, den Inhalt der gesamten Seite besser zu verstehen und thematisch korrekt einzuordnen.

1. Relevanzsteigerung: Gut formulierte Alt-Texte können die Relevanz einer Seite für bestimmte Suchanfragen erhöhen.
2. Bilder-SEO: Insbesondere für die Platzierung in der Bilder-Suche (z.B. Google Bilder) ist der Alt-Text ein direkter Rankingfaktor. Dies kann eine wertvolle Quelle für zusätzlichen, organischen Traffic sein.
3. Fallback-Mechanismus bei Anzeigeproblemen:
   Kann ein Bild nicht geladen werden, zeigt der Browser stattdessen den Alt-Text an. Dies gibt dem Nutzer zumindest eine Information darüber, was an dieser Stelle hätte sichtbar sein sollen, und verhindert eine komplett leere Fläche, die zu Verwirrung führen kann.

Es gibt bewährte Richtlinien, an denen Du Dich orientierten kannst, wenn Du vor der Aufgabe stehst, Alt-Texte für die Bilder deiner Webseite zu erstellen.

• Sei beschreibend und spezifisch: Der Text sollte den Bildinhalt präzise wiedergeben. Was ist das Hauptobjekt? Welche Handlung findet statt? Welche Details sind für das Verständnis im Kontext der Seite wichtig?
  • Schlecht: alt="Hund"
  • Gut: alt="Schwarzer Labrador apportiert einen roten Ball auf einer Wiese"
• Berücksichtige den Kontext: Der Alt-Text sollte zum umgebenden Text und zum Zweck des Bildes auf der Seite passen. Wenn ein Bild ein Produkt illustriert, sollten relevante Produktmerkmale oder der Produktname genannt werden.
• Sei  prägnant: Obwohl es keine strikte Längenbegrenzung gibt, wird empfohlen, Alt-Texte relativ kurz zu halten (ideal sind bis zu ca. 125 Zeichen), da manche Screenreader längere Texte abschneiden könnten.
• Sinnvoller Einsatz von Keywords: Wenn es natürlich in die Beschreibung passt, kann das Hauptkeyword der Seite oder ein relevantes sekundäres Keyword im Alt-Text verwendet werden. Vermeide jedoch unbedingt "Keyword-Stuffing" (das unnatürliche Überladen mit Keywords), da dies von Suchmaschinen negativ bewertet wird und die Nutzererfahrung beeinträchtigt.
• Vermeide Redundanz: Phrasen wie "Bild von..." oder "Grafik, die zeigt..." sind meist unnötig, da Screenreader bereits ankündigen, dass es sich um ein Bild handelt.