Wie sehen richtige Alt Tags für Webseiten aus?

Jedes Bild auf deiner Website sollte einen Alternativtext besitzen. Ein Alternativtext, oder auch alt-tag genannt, beschreibt den Inhalt des Bildes und ist zudem eine wichtige Einstellung für die SEO Suchmaschineneinstellung.
Die Funktion eines Alternativtextes, kommt aus der Zeit als das Internet noch nicht so schnell war. Kann ein Bild aufgrund zu langsamer Internetgeschwindigkeit nicht geladen werden, so wird anstatt des Bildes der Alt Tag angezeigt. Auch wenn das Bild gelöscht oder verschoben wurde, wird anstatt des Bildes ein Alternativer Text angezeigt. Viel wichtiger ist, dass du durch setzen des Alt Attributs, wichtige Informationen an die Google Suchmaschine übermittelst.
Dabei muss der auf dem Bild dargestellte Inhalt zum Alternativtext inhaltlich passten. Google kann sehr gut den Inhalt eines Bildes auslesen. Des weiteren ist davon auszugehen, dass Google in naher Zukunft immer besser den Content auf einem Bild erkennen wird. Gleichzeitig sollte der Alt Tag das Fokus Keyword deiner Webseite beinhalten.

Wie fügt Ihr einen Alternativtext für Bilder ein?

Das Alt Atribut wird in einem Image Tag nach dem Source / Quelle eingetragen und wird mit "alt" bezeichnet. Dabei muss das Attribut zwischen zwei Anführungszeichen " " stehen. Also zum Beispiel:

<img src="segelflugzeug waldshut.jpeg alt="segelflugzeug fliegt über waldshut"/>

Wenn Ihr ein CMS verwendet wie Wordpress, könnt Ihr das ganze kinderleicht in der Mediathek einfügen. Einfach in der Mediathek das gewünschte Bild aussuchen und in der Zeile "Alternativer Text" dein Alt-Attribut eintragen.

An einem praktischen Beispiel zeige ich dir, wie ein Alternativtext (ALT-Tag) aussehen kann.

Bildinhalt: Auf dem Beispielbild sieht man ein Segelflugzeug, dass über die Stadt Waldshut fliegt.

Sehr schlecht:

<img src="img-36.jpg" alt=""/>

Das Dateiname und der Alternativtext enthalten keine Keywords

Schlecht:

<img src="segelflugzeug.jpg" alt=""/>

Das Bild enthält keinen Alternativtext

Gut:

<img src="segelflugzeug.jpg" alt="Segelflugzeug"/>

Der Alternativtext enthält das Keyword „Segelflugzeug“

Sehr gut:

<img src="segelflugzeug-waldshut.jpg" alt="Segelflugzeug fliegt über die Stadt Waldshut"/>

Der Alternativtext des Bildes enthält neben dem Keyword „Segelflugzeug“ noch ein weiteres Keyword „Waldshut“. Zusätzlich enthält der Dateiname die beiden Keywords.

Lass uns reden

Kostenloses Beratungsgespräch

Meet the Team

Wir sind ein individuelles Team, welches aus IT Spezialisten, Entwicklern, Programmierer und Designern besteht.
Vom ersten Konzept bis zum fertigen Launch, hast du die richtigen Partner an deiner Seite.
Wir wollen das bestmögliche Ergebnis für dich, und für uns selbst.
Für alle Belange, für die wir nicht selbst Expertenwissen besitzen, arbeiten wir mit unserem erprobten Netzwerk zusammen.

Pino P.

Appentwickler
Webentwickler

Daniel A.

Master of Science
Programmierer

Das sagen unsere Kunden

Lass uns zusammen Arbeiten

Projekt anfragen

Über den Autor

pino von digitalarbeit sitzt am Schreibtisch mit zwei Bildschirmen und ist am programmieren am webseite designen

Pino Prezzo

Web und Appentwickler

Pino arbeitet seit über 7 Jahren als Webentwickler. Wordpress, Linux, HTML / CSS sowie Javascript gehören zum Alltag. Aber auch Frameworks wie Bootstrap oder Flutter runden sein Profil ab.
Auf Backend Systemen fühlt sich Pino bei Django sehr wohl.