Beschreibung
Das Alt-Attribut (alternative text) ist eine wesentliche Komponente des HTML-Quellcodes und dient dazu, den Inhalt eines Bildes in Textform zu beschreiben. Es hat mehrere wichtige Funktionen im Webdesign, der Suchmaschinenoptimierung (SEO) und für die Barrierefreiheit.
Definition – Was ist ein Alt-Attribut (Alt-Tag)?
Das Alt-Attribut (auch „alternativer Text“ genannt) ist ein HTML-Attribut, das verwendet wird, um den Inhalt eines Bildes auf einer Webseite zu beschreiben. Es erscheint im HTML-Code als Attribut innerhalb des -Tags und wird angezeigt, wenn das Bild nicht geladen werden kann oder wenn Screenreader das Bild interpretieren.
Das Alt-Attribut spielt eine entscheidende Rolle in verschiedenen Bereichen der Webnutzung. Ein wesentlicher Aspekt ist die Barrierefreiheit, da Screenreader, die von sehbehinderten oder blinden Nutzern verwendet werden, den im Alt-Attribut hinterlegten Text vorlesen, um den Inhalt von Bildern zu beschreiben. Dadurch wird das Web zugänglicher und sorgt dafür, dass auch Bilder für alle Nutzergruppen verständlich sind.
Auch für die SEO ist das Alt-Attribut von großer Bedeutung. Da Suchmaschinen den Inhalt von Bildern nicht direkt interpretieren können, liefert das Alt-Attribut Informationen darüber, was auf dem Bild dargestellt ist. Dies verbessert die Sichtbarkeit der Seite in den Bildersuchergebnissen und sorgt dafür, dass sowohl die Bilder als auch die Seite besser indexiert werden. Google empfiehlt das Alt-Attribut ausdrücklich als Mittel zur Optimierung von Bildern.
Darüber hinaus fungiert das Alt-Attribut als Fallback, wenn ein Bild aufgrund von Ladefehlern oder einer langsamen Internetverbindung nicht angezeigt werden kann. In diesem Fall wird der im Alt-Attribut enthaltene Text angezeigt, sodass Nutzer dennoch eine Vorstellung davon bekommen, was auf dem Bild dargestellt werden sollte.
Best Practices für die Verwendung des Alt-Attributs
- Beschreibend, aber knapp: Der Text sollte das Bild präzise beschreiben, aber nicht unnötig lang sein. Zum Beispiel: Anstatt „Bild“ oder „Foto“, könnte man „roter Sportwagen auf einer Landstraße“ verwenden, wenn das Bild dies zeigt.
- Vermeidung von Keyword-Stuffing: Auch wenn das Alt-Attribut SEO-Vorteile bietet, sollte es nicht mit unnötigen Schlüsselwörtern überladen werden. Dies wird von Suchmaschinen als Spam gewertet und kann negative Auswirkungen auf das Ranking haben.
- Relevanz für den Inhalt: Das Alt-Attribut sollte immer relevant für den Inhalt des Bildes und der gesamten Seite sein.
- Leeres Alt-Attribut: Ein fehlendes oder leeres Alt-Attribut verhindert, dass der Bildinhalt für Screenreader oder Suchmaschinen verständlich wird.
- Zu allgemeine Beschreibungen: Ein Alt-Attribut wie „Bild123“ oder „Foto“ ist nicht hilfreich für Nutzer oder Suchmaschinen.
Beispiele für Alt-Attribute
- Für ein Bild von einem Hund im Park könnte das Alt-Attribut lauten: alt=“Golden Retriever spielt im Park“.
- Für ein Firmenlogo könnte das Alt-Attribut lauten: alt=“Firmenlogo von ABC GmbH“.
Über den Autor
Tobias Diehl
Tobias ist Gründer und Inhaber der DiehlOne Onlineagentur in Vallendar. Seit 2009 ist er im Online-Marketing und der Webentwicklung zu Hause. Er liebt es, sich tief in die Suchmaschinenwelt zu graben und das Beste aus jeder Website herauszuholen. Vallendar ist nicht nur sein Bürostandort, sondern auch sein Rückzugsort für kreative Ideen und Inspiration.