Was ist ein Alt-Text genau?

Ein Alt-Text (Alternativtext) ist eine kurze, präzise Beschreibung eines Bildes, die im alt-Attribut des <img>-Tags im HTML-Code einer Webseite hinterlegt wird. Er hat zwei primäre Funktionen:

1. Er wird angezeigt, wenn das Bild aus technischen Gründen nicht geladen werden kann (z.B. bei langsamer Verbindung oder fehlerhaftem Pfad).
2. Er wird von assistiven Technologien, insbesondere Screenreadern, vorgelesen, die blinde und sehbehinderte Menschen nutzen, um im Internet zu navigieren.

Ohne einen sinnvollen Alt-Text ist ein informatives Bild für diese Nutzergruppe eine unüberwindbare Barriere. Der Kontext und die Information des Bildes gehen komplett verloren. Es ist ein zentraler Punkt in jeder BFSG-Checkliste.

Warum sind gute Alt-Texte so wichtig?

• Barrierefreiheit & Inklusion: Sie sind die einzige Möglichkeit, blinden und sehbehinderten Nutzern den Zugang zu visuellen Informationen zu ermöglichen.
• Suchmaschinenoptimierung (SEO): Suchmaschinen wie Google können Bilder nicht "sehen". Der Alt-Text ist ein entscheidender Faktor, um den Inhalt eines Bildes zu verstehen und es thematisch zuzuordnen. Gut beschriebene Bilder können in der Google Bildersuche ranken und zusätzlichen Traffic bringen. Ein oft übersehener Vorteil der Barrierefreiheit.
• Technische Robustheit: Wenn Bilder (z.B. in E-Mail-Clients oder bei aktiviertem Ad-Blocker) blockiert werden oder nicht laden, gibt der Alt-Text dem Nutzer trotzdem die Information.

Wie schreibt man einen guten Alt-Text? Der Kontext ist König!

Ein guter Alt-Text beschreibt den Inhalt und, falls relevant, die Funktion des Bildes kurz und präzise. Die perfekte Länge gibt es nicht, aber man sollte sich auf das Wesentliche konzentrieren. Fragen Sie sich: "Welche Information würde verloren gehen, wenn das Bild nicht da wäre?"

Beispiel:

Guter Alt-Text: alt="Ein diverses Team von vier Personen sitzt an einem Konferenztisch und diskutiert über Grafiken auf einem Laptop."

Vermeiden Sie diese häufigen Fehler:

• Weglassen des Alt-Attributs: Das ist der größte Fehler. Screenreader lesen dann oft den Dateinamen vor, was sehr störend ist (z.B. "IMG_4711.jpg").
• Redundante Phrasen: Vermeiden Sie "Bild von...", "Grafik von...". Der Screenreader weiß bereits, dass es sich um ein Bild handelt.
• Zu generische Texte: alt="Team" ist besser als nichts, aber nicht wirklich hilfreich.
• Keyword-Stuffing: Füllen Sie den Alt-Text nicht mit Keywords voll. Das schadet der Nutzererfahrung und wird von Google negativ bewertet.

Was ist mit dekorativen Bildern?

Bilder, die rein zur Dekoration dienen und keine wichtigen Informationen enthalten (z.B. Schmuckelemente, Hintergrundbilder, grafische Trennlinien), sollten ein leeres Alt-Attribut erhalten: alt="". Dadurch wissen assistive Technologien, dass sie das Bild ignorieren können. Das ist etwas völlig anderes als ein fehlendes Alt-Attribut!

Nutzen Sie unser kostenloses Analysetool, um eine erste schnelle Prüfung durchzuführen, ob Ihre Bilder mit einem Alt-Attribut versehen sind und ob es potenziell problematische (zu kurze oder generische) Texte gibt.