Auch bekannt als Alt-Attribut oder Alt-Text, handelt es sich bei einem Alt-Tag ("Alt" für Alternativ) um eine Text-Version eines Bildes, die alternativ auf einer Website erscheint, wenn das entsprechende Bild nicht geladen bzw. angezeigt wird.
Der Inhalt des Alt-Attributs unterstützt dadurch auch barrierefreies Surfen und übermittelt an Bildschirmleseprogramme, was sich auf dem Bild befindet.
In Bezug auf Suchmaschinenoptimierung (SEO) kann der Alt-Tag sogar die Suchmaschinenfreundlichkeit einer Website steigern, da auch die Crawler von Google und Co. das Alt-Attribut erkennen und dadurch den Inhalt von Bildern besser bewerten können.
In diesem Artikel sprechen wir über die Definition & Funktion des Alt-Tags und zeigen Ihnen, wo und wie der Alt-Tag eingepflegt werden kann.
Was ist der Alt-Tag?
Ein Alt-Tag (auch "Alt-Attribut" oder "Alt-Text" genannt), ist ein HTML-Attribut, das bei Bildern angewendet wird, um eine Textalternative für Suchmaschinen zu bieten.
Ein Alt-Tag sieht normalerweise wie folgt aus:
<img src=“meinbild.jpg” alt=“beschreibung des bildes” title=“Mein Bild”/
Was ist eigentlich richtig? Alt-Tag, Alt-Text oder Alt-Attribut?
Technisch gesehen handelt es sich bei dem Alt-Tag übrigens um kein ‘Tag’, sondern um ein Attribut in Textform innerhalb eines ‘Image-Tags’.
Tatsächlich wird der Begriff 'Alt-Tag' aber am häufigsten genutzt bzw. auf Google gesucht (Quelle: Google Ads Keyword-Planner).
Funktion des Alt-Tags
Grundsätzlich hat der Alt-Tag bei Bildern verschiedene Funktionen.
In Bezug auf SEO hilft es Crawlern oder Suchmaschinenbots (z.B. dem Googlebot) durch beachten mithilfe solcher Attribute besser zu verstehen, was sich auf dem Bild befindet und können so die gesamte Seite besser bewerten.
Über SEO hinaus hat das Alt-Tag folgende Funktionen:
- Kann das Bild aus technischen oder browser-bedingten Gründen nicht geladen werden, wird stattdessen der Inhalt des Alt-Attributs angezeigt.
- Bildschirmlese-Programme lesen z.B. sehbehinderten Internetnutzern den Alt-Text vor, um barrierefreies Surfen zu ermöglichen.
Wo gebe ich den Alt-Tag ein?
Handelt es sich bei Ihrer Website um eine reine, statische HTML Website oder einem CMS, bei dem Bilder per HTML eingebunden werden, lässt sich der Alt-Tag direkt im jeweiligen ‘Image’-Tag einpflegen.
<img src=“meinbild.jpg” alt=“Hier geben Sie den alt-Text ein.” title=“Mein Bild”/>
Bei den meisten Webseiten mit einem CMS gibt es keine allgemeine Anleitung zum Einpflegen von Alt-Tags.
Bei dem beliebten CMS Wordpress lässt sich der Alt-Tag unter anderem beispielsweise direkt bei ‘Medien’ bei dem jeweiligen Bild hinterlegen.
Klickt man auf das jeweilige Bild im Medienordner, öffnet sich je nach Version, Theme und Einstellung der Ansicht folgendes Fenster:
Unter ‘Alternativtext’ lässt sich dann der Alt-Tag eingeben.
Nutzt man das gleiche Bild auf mehreren Seiten und möchte jeweils einen individuellen Alt-tag, lässt sich dieser auch folgendermaßen bearbeiten:
Einfach bei dem entsprechenden Bild im Content ‘edit’ anklicken und dort auch unter ‘Alternativtext’ den jeweiligen Alt-Tag eingeben.
Für Anwendungsfälle bei anderen CMS oder individueller Theme-, bzw. Website-Lösungen empfehlen wir Ihnen die Suche in einem entsprechenden Support-Forum oder direkt Ihren Webmaster anzusprechen. Gerne können Sie uns natürlich auch nach Hilfe dazu fragen!
Wie viele Zeichen sollte der Alt-Tag haben?
Nach unserer Empfehlung sollte hier einfach und möglichst kurz in ein paar Worten beschrieben werden, was sich auf dem Bild befindet.
Eine genaue Zeichenbegrenzung wie bei Meta-Titeln oder Meta-Beschreibungen gibt es hier laut Google nicht wirklich. Die Meinungen von SEOs unterscheiden sich hier aber auch, welche Rahmen von Zeichenlängen am Besten sind. Die beliebtesten Screenreader schneiden Alt-Tags bei ca. 125 Zeichen ab, daher sollte man den Inhalt möglichst auf diese Zeichenanzahl oder weniger beschränken.
Was ist bei Alt-Tags zu beachten?
Wie bereits angesprochen, gilt hier folgender Grundsatz: Beschreiben Sie möglichst kurz und einfach was sich auf dem jeweiligen Bild befindet. Hier reichen je nach Inhalt meistens 3 bis 5 Wörter.
In Hinblick auf SEO macht es natürlich Sinn, sich an relevanten Keywords zu bedienen. Die Relevanz sollte sowohl zum Inhalt des Bildes und, wenn möglich, auch zum Inhalt der Unterseite des entsprechend eingebundenen Bildes bestehen.
Vermeiden Sie aber Aneinanderkettungen von Keywords. Google bewertet nicht-ausgefüllte oder nicht-relevante Alt-Tags nicht negativ, allerdings kann der Missbrauch von Keywords hier wie grundsätzlich bei SEO-Content zu Abwertungen führen.
Der Gebrauch von ‘Bild von…’ oder ‘Auf dem Bild befindet sich…’ ist bei Alt-Tags überflüssig. Dadurch, dass sich das Alt-Attribut in einem Bild-Tag befindet, ist hier bereits eindeutig dass es sich um die Beschreibung des Bildes handelt.
Fazit / Takeaways
Hier sind noch einmal die wichtigsten Infos zum Alt-Tag zusammengefasst:
- Attribut zur Bild-Beschreibung innerhalb eines Bild HTML-Tags
- Soll ein Bild möglichst einfach beschreiben
- Wird von Bildschirmleseprogramme für barrierefreies Surfen eingesetzt
- Wird von Suchmaschinen zum Analysieren und Bewerten von Bildern genutzt
- Ein relevanter Alt-Tag kann die Suchmaschinenfreundlichkeit einer Seite steigern
- Möglichst jedes Bild sollte, wenn nötig und möglich, einen Alt-Tag haben
- Kann direkt im Quellcode oder im CMS eingepflegt bzw. bearbeitet werden.
