Soll jedes Bild ein Keyword im Alt-Text enthalten?

Der Alt-Text soll die relevante Information des Bildes im jeweiligen Kontext vermitteln. Ein passender Begriff kann darin natürlich vorkommen. Eine Keyword-Liste erfüllt diesen Zweck nicht.

Ist AVIF immer besser als WebP oder JPEG?

Die sinnvolle Wahl hängt von Motiv, Qualität, Dateigröße und technischer Einbindung ab. Vergleiche geeignete Exporte und prüfe das Ergebnis auf der fertigen Seite.

Soll ich für alle Bilder Lazy Loading aktivieren?

Nein. Bilder weiter unten können davon profitieren. Das wichtige sofort sichtbare Bild sollte rechtzeitig geladen werden; eine Verzögerung kann die wahrgenommene Ladezeit verschlechtern.

Bilder-SEO: Alt-Texte & Formate optimieren

Beginne mit der Aufgabe des Bildes

Frage vor dem Export, was das Bild auf der konkreten Seite leisten soll. Ein Projektfoto kann Arbeitsqualität zeigen. Ein Diagramm erklärt einen Zusammenhang. Ein rein dekoratives Motiv erfüllt dagegen eine andere Aufgabe und braucht nicht dieselbe Textalternative.

Ein Bild wird nicht allein durch einen Dateinamen relevant. Sichtbarer Kontext, verständliche Beschreibungen und die passende Einbindung gehören zusammen. Wenn ein austauschbares Motiv keinen Beitrag zur Aussage leistet, kann auch sein Weglassen die klarere Entscheidung sein.

Schreibe Alt-Texte nach Bedeutung und Kontext

Ein Alt-Text vermittelt den relevanten Bildinhalt für Menschen, die das Bild nicht sehen können. Beschreibe deshalb die Information, die im jeweiligen Zusammenhang wichtig ist. Wiederhole nicht eine Liste von Suchbegriffen und beginne nicht jedes Mal mit „Bild von“.

Informativ: Ein Foto zeigt den Eingangsbereich einer Praxis mit einer Rampe. Wenn es auf der Seite um den Zugang geht, ist diese Rampe eine wichtige Information. In einem rein dekorativen Aufmacher kann dasselbe Motiv eine andere Behandlung benötigen.

Dekorativ: Bei einem Bild ohne zusätzliche inhaltliche Aussage ist ein leeres alt-Attribut sinnvoll. Das Attribut einfach wegzulassen ist damit nicht gleichzusetzen. Komplexe Diagramme brauchen häufig zusätzlich eine sichtbare Erklärung ihrer wichtigsten Aussagen.

Bei verlinkten Bildern muss außerdem der Zweck des Links verständlich sein. Der passende Text hängt daher von der Funktion und nicht allein vom Motiv ab. Prüfe Alt-Texte zusammen mit der fertigen Seite, nicht nur im Medienordner.

Welchen Alt-Text braucht das Bild?. Informativ: Beschreibe die Aussage, die im aktuellen Kontext wichtig ist.; Dekorativ: Nutze einen leeren Alt-Text, wenn das Bild keine zusätzliche Information trägt.; Funktional: Beschreibe das Ziel oder die Aktion, wenn das Bild als Bedienelement dient. — Der Zweck des Bildes entscheidet über den Text.

Exportiere für den tatsächlichen Einsatz

Die passende Dateigröße hängt von Motiv, benötigten Abmessungen und sichtbarer Qualität ab. Eine pauschale Grenze von beispielsweise 100 Kilobyte ist kein verlässliches Ziel für jedes Bild. Ein großes Projektfoto und ein kleines Symbol haben unterschiedliche Anforderungen.

Exportiere keine deutlich größeren Abmessungen als für den Einsatz erforderlich.
Vergleiche moderne Formate wie WebP oder AVIF mit einer geeigneten Ausgangsdatei.
Kontrolliere feine Schrift, Kanten und wichtige Details nach der Kompression.
Erzeuge kleinere Varianten, wenn die Darstellung auf Mobilgeräten deutlich schmaler ist.
Halte Originaldateien getrennt von optimierten Website-Versionen aufbewahrt.

Ein moderner Formatname allein beweist noch keine gute Optimierung. Entscheidend ist das Verhältnis zwischen Qualität, Dateigröße und Auslieferung. Prüfe auch, ob die eingesetzte Website die Varianten tatsächlich verwendet.

Binde Bilder mit passenden Abmessungen ein

Mit width und height kann der Browser das Seitenverhältnis früh berücksichtigen. Das hilft, Platz für ein Bild vorzusehen und unerwünschte Verschiebungen zu vermeiden. Responsive Varianten über srcset und sizes ermöglichen eine zur Darstellung passende Auswahl.

Das Beispiel verwendet Platzhalterdateien und muss an die tatsächlichen Bilder und Seitenbreiten angepasst werden. Die Größenangabe ist eine Beschreibung der Darstellung, keine universelle Empfehlung für jedes Layout.

<img src="/bilder/praxis-800.webp"
     srcset="/bilder/praxis-480.webp 480w, /bilder/praxis-800.webp 800w"
     sizes="(max-width: 600px) 100vw, 800px"
     width="800" height="533"
     alt="Praxiseingang mit stufenlos zugänglicher Rampe"
     loading="lazy" decoding="async">

Auch die übrigen Seitenangaben sollten zum Inhalt passen; dabei hilft die Prüfliste für Title und Meta-Tags. Ein aussagekräftiger Dateiname erleichtert außerdem die Pflege. Er sollte das Motiv knapp beschreiben. Eine lange Aneinanderreihung von Orten und Leistungen macht die Datei nicht hilfreicher.

Lade wichtige Bilder rechtzeitig

Lazy Loading kann bei Bildern unterhalb des zunächst sichtbaren Bereichs sinnvoll sein. Das wichtigste sofort sichtbare Bild sollte jedoch nicht durch unnötig verzögertes Laden ausgebremst werden. Besonders beim LCP-Bild lohnt sich die Prüfung, wann der Browser die Datei entdeckt und anfordert.

Verwende erhöhte Ladepriorität gezielt und nicht für jedes Bild. Wenn alle Dateien gleichzeitig besonders wichtig sein sollen, fehlt die Priorisierung. Prüfe zunächst den tatsächlichen Engpass: Dateigröße, späte Entdeckung, langsame Antwort oder eine andere Ressource.

Ein einzelner guter Labortest garantiert noch keine gleich gute Erfahrung für alle Besucher. Unterschiedliche Geräte, Verbindungen und Bildschirmgrößen gehören zur Bewertung. Dokumentiere deshalb, welche Seite und welche Darstellung du geprüft hast.

Zwei Wege für die Bildauslieferung. Im Startbereich: Wichtiges sichtbares Bild rechtzeitig laden. Abmessungen und passende Varianten angeben.; Weiter unten: Bilder bei Bedarf verzögert laden. Platz vorab reservieren und Schärfe prüfen. — Unterscheide zwischen dem Startbereich und später sichtbaren Inhalten.

Eine kompakte Prüfliste für bestehende Seiten

Unterstützt jedes Bild den Zweck des jeweiligen Abschnitts?
Sind informative und dekorative Bilder passend unterschieden?
Bleiben wichtige Details nach dem Export verständlich?
Sind Abmessungen und responsive Varianten zur Darstellung passend?
Werden Bilder außerhalb des Startbereichs bei Bedarf verzögert geladen?
Wird das zentrale sichtbare Bild rechtzeitig entdeckt und geladen?
Funktionieren Bild-URLs und Beschreibungen nach einem Relaunch weiter?

Prüfe die fertige Seite sowohl auf einem schmalen als auch auf einem großen Bildschirm. Gerade unterschiedliche Zuschnitte und Bildgrößen fallen beim Blick auf die ursprüngliche Datei allein nicht auf.

Verbinde technische Prüfung und Inhaltsprüfung

Wenn Bilder unpassend zugeschnitten sind oder die Seite stark verschieben, ist das auch ein Problem der Nutzerführung. Ein Website Audit betrachtet diese Zusammenhänge. Wenn Bilder im Kontext von Indexierung und Suchzugriffen bewertet werden sollen, passt eine SEO-Analyse.

Verbessere zuerst die Bilder auf wichtigen Einstiegs- und Entscheidungsseiten. Danach lässt sich das Vorgehen auf weitere Bereiche übertragen. Miss konkrete Veränderungen und behaupte keinen Rankinggewinn allein aufgrund einer kleineren Datei.