WooCommerce Alt-Text vs. Bildtitel: Was ist der Unterschied?

WordPress zeigt für ein Bild mehrere Felder: Alternativtext, Titel, Beschriftung und Beschreibung. Sie sehen ähnlich aus, erfüllen aber unterschiedliche Aufgaben. Gerade bei WooCommerce-Produktbildern führt das zu einer häufigen Verwechslung: Bildtitel ist nicht dasselbe wie Alt-Text. Wenn du die Bildbeschreibung im HTML beeinflussen möchtest, musst du wissen, welches Feld dafür vorgesehen ist.

Alt-Text vs. Bildtitel: die kurze Antwort

Der Alternativtext ist das WordPress-Feld für das HTML-alt-Attribut. Der Titel benennt dagegen das Medienobjekt. Das endgültige HTML kann trotzdem von WooCommerce, dem aktiven Theme, einem Block oder einem Plugin abhängen. Prüfe deshalb auch die öffentliche Produktseite.

Was ist der Alternativtext in WooCommerce?

Der Alternativtext beschreibt die relevante Information eines Bildes. Bei einem Produktbild ist das meist das gezeigte Produkt und, falls wichtig, seine sichtbare Ansicht oder ein Detail. Er steht im HTML im alt-Attribut des jeweiligen <img>-Elements.

Angenommen, das Produkt heißt Braune Leder-Umhängetasche. Das Foto zeigt die Tasche von vorne mit ihrer auffälligen Schnalle. Ein passender Alternativtext wäre Braune Leder-Umhängetasche mit Frontschnalle. Im Shop könnte daraus dieses Markup werden:

<img src="tasche.jpg" alt="Braune Leder-Umhängetasche mit Frontschnalle">

Der Wert zwischen den Anführungszeichen von alt ist die hier relevante Bildbeschreibung. Der Dateiname und der interne Medientitel erfüllen andere Aufgaben. Bei einer Rückansicht derselben Tasche kann ein anderer Text sinnvoll sein, weil das Foto andere Informationen zeigt. Weitere Beispiele für Haupt- und Galeriebilder findest du im Leitfaden für WooCommerce-Produktbild-Alt-Texte.

Was ist der Bildtitel in WordPress?

Der Bildtitel ist ein Name für das Medienobjekt in WordPress. Er hilft dir, ein Attachment in der Mediathek zu erkennen und zu verwalten. Das Feld kann beim Hochladen aus dem Dateinamen entstehen und anschließend bearbeitet werden. Es ist aber nicht das Feld, in das du die HTML-Bildbeschreibung einträgst.

Ein Beispiel zeigt die Trennung:

Wenn du in diesem Beispiel nur den Bildtitel änderst, bedeutet das nicht automatisch, dass sich das alt-Attribut im Shop ändert. WordPress speichert die Angaben getrennt. Auch ein gut klingender Titel ist daher kein Beleg dafür, dass das Produktbild einen passenden Alternativtext hat.

Gerade beim Import vieler Produktfotos kann der Titel wie eine Beschreibung wirken. Ledertasche vorne sagt zwar etwas über die Datei, doch für das ausgegebene Bild-Markup ist das gespeicherte Alternativtext-Feld beziehungsweise die spätere Renderlogik entscheidend. Verwende den Bildtitel nicht als Ersatz für den Alt-Text.

Was ist der Unterschied zwischen Bildtitel und HTML-title-Attribut?

Zusätzlich zum WordPress-Bildtitel gibt es im HTML ein eigenes title-Attribut. Es kann an einem Bild stehen, ist aber ebenfalls etwas anderes als alt:

<img alt="Braune Leder-Umhängetasche" title="Produktbild">

alt und title sind hier zwei getrennte HTML-Attribute. Das HTML-title-Attribut ersetzt den Alternativtext nicht. Auch der Titel eines WordPress-Medienobjekts wird nicht automatisch zum HTML-title-Attribut: Ob ein Theme oder Plugin dieses Attribut ausgibt und welchen Wert es verwendet, hängt von dessen Umsetzung ab. Für die Frage nach der Bildbeschreibung liest du im fertigen <img>-Element den Wert von alt.

Was ist die Beschriftung?

Die WordPress-Beschriftung ist Begleittext, der beim Bild sichtbar erscheinen kann. Ob sie unter oder neben dem Bild gezeigt wird, hängt davon ab, wie das Bild eingefügt wurde und wie Theme, Block oder Galerie es ausgeben. Bei einem Produktfoto könnte eine Beschriftung beispielsweise lauten: Erhältlich in Schwarz und Braun.

Dieser Satz kann für Käufer sichtbar sein. Er ist aber keine Beschreibung des konkreten Bildes im alt-Attribut. Ein ausgefülltes Beschriftungsfeld behebt deshalb keinen fehlenden Alternativtext. Umgekehrt muss ein Bild nicht zwingend eine sichtbare Beschriftung haben, damit sein alt-Wert sinnvoll ist.

Was ist die Beschreibung?

Im Feld Beschreibung kannst du zusätzliche Informationen oder Inhalte zum Medienobjekt speichern. Das ist ein weiteres WordPress-Feld und nicht das HTML-alt-Attribut. Wie und ob solche Inhalte öffentlich erscheinen, hängt von der jeweiligen Darstellung ab. Für die Alt-Beschreibung eines WooCommerce-Produktbildes bearbeitest du stattdessen den Alternativtext.

Welches Feld sollte ich für WooCommerce-Produktbilder bearbeiten?

Wenn ein bedeutungsvolles WooCommerce-Produktbild eine Bildbeschreibung erhalten soll, bearbeite das Feld Alternativtext. Ein kurzer Ablauf genügt:

1. Öffne das Produktbild im Produkteditor oder den betreffenden Eintrag in der Mediathek.
2. Suche das Feld Alternativtext.
3. Beschreibe knapp, was das konkrete Bild zeigt.
4. Speichere beziehungsweise aktualisiere den Eintrag.
5. Öffne danach die öffentliche Produktseite und prüfe das ausgegebene alt-Attribut.

Die genauen WordPress-Ansichten können sich je nach Editor und Version etwas unterscheiden. Entscheidend ist die Bezeichnung des Feldes, nicht seine Position auf dem Bildschirm. Wenn du für mehrere Galerieansichten nur den Produkttitel wiederholst, gehen sichtbare Unterschiede möglicherweise verloren. Eine Seitenansicht oder Detailaufnahme darf entsprechend spezifischer beschrieben werden, ohne dass du daraus eine lange Keyword-Liste machst.

Falls du zuerst ermitteln willst, welche Bilder überhaupt keinen hilfreichen Wert haben, beginne beim Ratgeber zu fehlenden Alt-Texten in WooCommerce. Dort geht es um die Bestandsaufnahme; hier geht es um die Verwechslung der vier WordPress-Felder.

Warum kann der Live-Shop trotzdem etwas anderes ausgeben?

Zwischen Mediathek und öffentlicher Seite liegt ein weiterer Schritt. Vereinfacht sieht der Weg so aus:

WordPress-Mediathek → WooCommerce / Theme / Block / Plugin → HTML im Live-Shop

Eine WooCommerce-Komponente kann den gespeicherten Alternativtext verwenden. Ein Theme kann bei einem leeren Feld einen Fallback einsetzen, eine Galerie kann anderes Markup erzeugen oder ein Plugin kann die Ausgabe ändern. Auch Vorschaubild und großes Galeriebild können getrennte <img>-Elemente sein. Deshalb reicht ein Blick in die Mediathek nicht immer aus, um die Ausgabe auf der Produktseite sicher zu beurteilen.

Maßgeblich ist das finale alt-Attribut des richtigen Bildes im Live-Shop. Öffne die Produktseite, untersuche das betreffende Bild im Browser und lies den Wert im gerenderten <img>-Element. Achte bei Galerien darauf, ob du gerade das Vorschaubild oder die große Ansicht prüfst. Eine ausführlichere Anleitung bietet der Artikel WooCommerce Alt-Texte prüfen.

Beispiel: Bildtitel ausgefüllt, Alt-Text leer

Stell dir ein Produktbild mit diesen Angaben in der Mediathek vor:

Der ausgefüllte Bildtitel beweist nicht, dass im Shop ein nützlicher Alt-Text vorhanden ist. Je nach Renderlogik kann das Bild mit alt="" erscheinen, einen Fallback erhalten oder einen Wert aus einer anderen Quelle verwenden. Aus dem Titel allein lässt sich das Ergebnis nicht ableiten. Prüfe das zugehörige <img>-Element auf der öffentlichen Seite und entscheide dann, ob der tatsächlich ausgegebene Wert das Bild angemessen beschreibt.

Beispiel: Alt-Text korrekt ausgefüllt

Nun hat ein anderes Bild den internen Titel IMG_2048. Im Feld Alternativtext steht Weiße Damen-Laufschuhe mit blauer Sohle, Seitenansicht. Wenn der Shop diesen Wert übernimmt, enthält das gerenderte HTML:

alt="Weiße Damen-Laufschuhe mit blauer Sohle, Seitenansicht"

Der wenig attraktive interne Bildtitel ist für die Bildbeschreibung dann nicht entscheidend. Das konkrete alt beschreibt die gezeigte Ansicht. Eine Umbenennung des Titels kann die Medienverwaltung verbessern, ist aber keine Voraussetzung für diesen Alt-Text.

Sollten Bildtitel und Alt-Text identisch sein?

Sie können zufällig gleich lauten, müssen es aber nicht. Der Titel benennt das Attachment in WordPress. Der Alternativtext beschreibt das Bild im Kontext seiner Verwendung. Für ein einfaches Produktfoto können beide Angaben ähnlich sein; bei einem Detailbild kann der passende Alt-Text deutlich genauer sein als der interne Medienname.

Kopiere daher nicht automatisch jeden Bildtitel in das Alternativtext-Feld. Ein Titel wie IMG_2048 oder Herbstkollektion final sagt wenig über den sichtbaren Bildinhalt. Sieh dir das Foto und die Stelle im Shop an, bevor du den Alt-Text festlegst. Auch ein guter Alt-Text muss nicht für jede Verwendung derselben Datei unverändert passen, wenn der Seitenkontext eine andere Bildinformation hervorhebt.

Typische Fehler

• Nur den Bildtitel bearbeiten: Das getrennte Alternativtext-Feld bleibt dabei möglicherweise leer.
• Den Dateinamen als Alt-Text übernehmen: ledertasche-front-final.jpg ist meist keine natürliche Bildbeschreibung.
• Die Beschriftung statt des Alternativtexts ausfüllen: Sichtbarer Begleittext ersetzt das alt-Attribut nicht.
• Jedes Galeriebild mit demselben Produkttitel versehen: Unterschiedliche Ansichten bleiben dann unklar.
• Nur die WordPress-Mediathek prüfen: Ein Template oder Plugin kann die tatsächliche Ausgabe verändern.
• Keywords in Alt-Texte stopfen: Beschreibe das Bild, statt Suchbegriffe aneinanderzureihen.

WooCommerce-Bildfelder im Überblick

Diese Zuordnung hilft bei der Bearbeitung in WordPress. Für die abschließende Kontrolle zählt weiterhin das konkrete Produktbild auf der veröffentlichten Seite.

Wie IMSCRIB hilft

IMSCRIB scannt den Live-WooCommerce-Shop und prüft das ausgegebene Bild-Markup. Das ist hilfreich, weil WordPress-Metadaten und das finale HTML im Shop voneinander abweichen können. Du kannst so auffällige Alt-Werte auf den untersuchten Seiten finden und anschließend am jeweiligen Bild beurteilen. Der Scanner für deinen Shop steht direkt bei diesem Artikel bereit.

FAQ

Ist der Bildtitel dasselbe wie der Alt-Text in WordPress?

Nein. WordPress speichert Bildtitel und Alternativtext in getrennten Feldern. Der Titel benennt das Medienobjekt; der Alternativtext ist für die Bildbeschreibung im HTML vorgesehen.

Welches Feld wird für Alt-Text verwendet?

Normalerweise das Feld Alternativtext in WordPress. Prüfe anschließend, welchen alt-Wert WooCommerce und dein aktives Theme tatsächlich ausgeben.

Wird der WordPress-Bildtitel automatisch als Alt-Text verwendet?

Darauf solltest du dich nicht verlassen. WooCommerce, Theme, Block oder Plugin können je nach Einbindung einen gespeicherten Alt-Text, einen Fallback oder einen anderen Wert ausgeben. Entscheidend ist das Live-HTML.

Ist die Beschriftung dasselbe wie Alt-Text?

Nein. Eine Beschriftung kann sichtbar beim Bild stehen. Alt-Text ist der Wert des HTML-alt-Attributs am Bild.

Können Bildtitel und Alt-Text identisch sein?

Ja, wenn derselbe Wortlaut für beide Aufgaben passt. Eine Pflicht dazu gibt es nicht. Prüfe den Alt-Text anhand des konkreten Bildes, statt den Titel automatisch zu kopieren.

Wie prüfe ich den tatsächlichen Alt-Text in WooCommerce?

Öffne die öffentliche Produktseite, untersuche das richtige <img>-Element im Browser und lies sein alt-Attribut. Alternativ kann ein Storefront-Scan das ausgegebene Bild-Markup der untersuchten Seiten erfassen.