Das Hinzufügen von Bildern zu Deinen Artikeln ermutigt die Besucher, sie zu lesen. Gut ausgewählte Bilder können auch Deine Botschaft unterstützen und Ihnen ein gutes Ranking in den Suchergebnissen verschaffen. Aber Du solltest immer daran denken, Deinen Bildern gute Alt-Attribute zu geben: Der Alt-Text verstärkt die Botschaft Deiner Artikel und verbessert die Zugänglichkeit Deiner Website. Dieser Artikel erklärt alles über Alt-Tags und Titel-Tags und warum Du sie optimieren solltest.
Hinweis: Der Begriff “alt tag” ist eine gebräuchliche Abkürzung für das, was eigentlich ein alt-Attribut auf einem img-Tag ist. Das Alt-Tag eines jeden Bildes auf Deiner Website sollte beschreiben, was darauf steht. Computerprogramme für Blinde und Sehbehinderte lesen diesen Text vor und machen Ihnen so Dein Bild zugänglich.
Was sind Alt-Tags und Titel-Tags?
Inhaltsverzeichnis
Dies ist ein vollständiges HTML-Bild-Tag:
<img src=”bild.jpg” alt=”Bild Beschreibung” title=”Bild Tooltip”>
Die Alt- und Titelattribute eines Bildes werden allgemein als Alt-Tag oder Alt-Text und Titel-Tag bezeichnet – auch wenn es sich nicht um technische Tags handelt. Der Alt-Text beschreibt, was auf dem Bild ist und die Funktion des Bildes auf der Seite. Wenn Du also ein Bild als Button verwendest, um Produkt X zu kaufen, sollte der Alt-Text lauten: “Klick, um Produkt X zu kaufen.”
Das alt-Tag wird von Screenreadern verwendet, also Browsern, die von blinden und sehbehinderten Menschen verwendet werden, um ihnen mitzuteilen, was auf dem Bild steht. Das Titelattribut wird als Tooltip angezeigt, wenn Du mit der Maus über das Element fährst, so dass im Falle einer Bild-Schaltfläche der Bildtitel einen zusätzlichen Aufruf zur Aktion enthalten könnte, wie z.B. “Jetzt Produkt X für 10 EUR kaufen”, obwohl dies keine gute Vorgehensweise ist.
Jedes Bild sollte einen Alt-Text haben. Dies nicht nur für die Suchmaschinenoptimierung, aber auch, weil sehbehinderte und blinde Menschen sonst nicht erkennen können, worum es bei dem Bild geht. Ein Titelattribut ist nicht erforderlich. Es steht nur Benutzern von Mäusen (oder anderen Zeigegeräten) zur Verfügung.
Wenn die Informationen, die durch das Titelattribut übermittelt werden, relevant sind, solltest Du erwägen, sie an einem anderen Ort im Klartext verfügbar zu machen. Wenn sie nicht relevant sind, solltest Du das Titelattribut vollständig entfernen.
Alt Tag SEO optimieren: Was ist, wenn ein Bild keine besondere Aufgabe hat?
Wenn Du Bilder in Deinem Design hast, die rein aus Designgründen vorhanden sind, machst Du es falsch, da diese Bilder im CSS und nicht im HTML sein sollten. Wenn du diese Bilder wirklich nicht ändern kannst, gib ihnen ein leeres alt-Attribut, so wie hier:
<img src=”bild.png” alt=””>
Das leere alt-Attribut stellt sicher, dass Screenreader das Bild überspringen.
Ratgeber klärt endlich auf! Die 7 Gründe warum 98,7 % aller Webseiten kein Geld (im Internet) verdienen, warum Deine Webseite zu wenig Besucher hat und Du nicht unter den Top 3 bei Google rankst...
Alt-Text und SEO
Googles Artikel über Bilder hat die Überschrift “Use descriptive alt text”. Dies ist kein Zufall, denn Google legt einen relativ hohen Wert auf den Alt-Text, um nicht nur festzustellen, was auf dem Bild ist, sondern auch, wie es sich auf den umgebenden Text bezieht.
Bewertung der Attribute von Bildänderungen
Mit SEO Tools wie beispielsweise Yoast SEO werden Bilder und deren Alt-Text in Deinen Beiträgen automatisch auf das alt tag überprüft. Du brauchst qualitativ hochwertige und relevante Bilder für Deine Beiträge. Wenn es Sinn macht, solltest Du das Fokus-Schlüsselwort im Alt-Text haben.
Google empfiehlt:
“Wenn Du Alt-Text wählst, konzentriere Dich auf die Erstellung nützlicher, informationsreicher Inhalte, die Schlüsselwörter angemessen verwenden und im Kontext mit dem Inhalt der Seite stehen. Vermeide es, Alt-Attribute mit Keywords zu füllen, da dies zu einer negativen Benutzererfahrung führt und dazu führen kann, dass Deine Website als Spam angesehen wird.”
Wenn es sich bei Deinem Bild um ein bestimmtes Produkt handelt, gib sowohl den vollständigen Produktnamen als auch die Produkt-ID in das alt-Tag ein, damit es leichter gefunden werden kann. Im Allgemeinen: Wenn eine Keyphrase nützlich sein könnte, um etwas zu finden, das sich auf dem Bild befindet, nimm es in das alt-Tag auf. Vergiss auch nicht, den Namen der Bilddatei so zu ändern, dass der Dateiname auch tatsächlich beschreibt, was auf dem Bild zu sehen ist.
Alt Attribute und Titelattribute in WordPress
Wenn Du ein Bild in WordPress hoch lädst, kannst Du einen Titel und ein Alt-Attribut festlegen. Standardmäßig verwendet es den Bilddateinamen im Titelattribut, der, wenn Sie kein alt-Attribut eingeben, in das alt-Attribut kopiert wird. Das ist zwar besser als nichts zu schreiben, aber es ist eine ziemlich schlechte Praxis. Du musst dir wirklich die Zeit nehmen, einen richtigen Alt-Text für jedes Bild zu erstellen, das Du zu einem Beitrag hinzufügst – Benutzer und Suchmaschinen werden Dir dafür danken. Die Benutzeroberfläche macht es einfach: Klicke auf ein Bild, klicke auf die Schaltfläche Bearbeiten, und gib den Text für das alt tag ein. Deine SEO wird davon profitieren, wenn Du diese kleinen Details konsequent umsetzt. Und auch sehbehinderte und blinde Menschen werden Dir danken, dass Du die Inhalte Deiner Webseite für sie zugänglich machst.