Warum zeigt mein Webflow-Bild einen anderen Alternativtext als den, den ich gesetzt habe?

Webflow-Bilder, die mit einem Asset verknüpft sind, können den Alternativtext verwenden, der am Asset in der Bibliothek gespeichert ist. In diesem Beispiel zeigte die veröffentlichte Seite den ukrainischen Alternativtext des Assets auf einer englischen Seite. Setzen Sie den Alternativtext am Bildelement, wenn das Bild einen seitenspezifischen Text braucht.

Warum ist mein Webflow-Formularlabel nicht mit seinem Feld verknüpft?

In diesem Beispiel hatte das veröffentlichte Label ein leeres for-Attribut, das Auswahlfeld hatte daher keinen zugänglichen Namen. Tragen Sie im Designer im Feld For des Labels die ID des Eingabefelds ein oder geben Sie dem Feld direkt einen zugänglichen Namen.

Wie lege ich die Seitensprache in Webflow fest?

Das lang-Attribut des html-Elements stammt aus der primären Locale der Website. Legen Sie sie unter Site settings > Localization fest und veröffentlichen Sie erneut. Auf einer einzelnen Seite lässt es sich nicht beheben.

Tests & Tools

Barrierefreiheitsprobleme auf einer Webflow-Website beheben und erneut prüfen

Diese Anleitung begleitet eine Webflow-Seite vom ersten Scan bis zur erneuten Prüfung. Die Seite ist eine Demo, die wir am 08.11.26 auf einer webflow.io-Subdomain einer stillgelegten eigenen Website veröffentlicht haben, keine Kundenwebsite. Anders als in unserem WordPress-Beispiel lief hier jeder Scan über den öffentlichen kostenlosen AllyProof-Test - die Zahlen sind also das, was jeder Besucher für diese URL sehen würde.

Was der erste Scan fand

Score 68, sechs automatisierte Probleme - eines kritisch, vier schwerwiegend, eines mittel (eines davon erst nach der Registrierung sichtbar):

Befund	Ursache auf dieser Seite	WCAG
Auswahlfeld ohne zugänglichen Namen (kritisch)	Datums-Dropdown in einem Webflow-Formular ohne Label	4.1.2
Textkontrast zu gering	Einleitungsabsatz in hellem „Markengrau“ (`#b0b0b0` auf Weiß)	1.4.3
Kontrast des Feldrahmens zu gering	Standardrahmen des Dropdowns	1.4.11
Seite ohne Sprachangabe	`<html>` ohne `lang`-Attribut veröffentlicht; von beiden Engines gemeldet	3.1.1

Was der Scan nicht erkennen konnte

Die Bilder wurden mit alt="" eingefügt. Die veröffentlichte Seite zeigte einen anderen Alternativtext: Webflow verknüpfte sie mit vorhandenen Assets der Bibliothek und verwendete den dort gespeicherten Alternativtext - auf Ukrainisch, auf einer englischen Seite. Das verlinkte Schließen-Symbol hatte daher einen Namen („Symbol, geschlossen“), der das Bild beschrieb und nicht den Link, der zur Startseite führte. Alle Regeln bestanden, weil beide Bilder einen Alternativtext hatten. Nur ein Mensch, der ihn im Kontext liest, bemerkt die falsche Sprache und die falsche Beschreibung.

Die Korrekturen in Webflow

Kontrast. Wir haben die Textfarbe der Einleitung in ihrer Klasse auf #595959 geändert und dem Dropdown einen 1-px-Rahmen in #767676 gegeben. Beide Änderungen gelten überall, wo die Klasse verwendet wird - prüfen Sie andere Seiten mit derselben Klasse.
Alternativtexte. Jedes Bild auswählen und den Alternativtext am Element setzen, statt sich auf das Asset zu verlassen: „Zurück zur Startseite“ für das verlinkte Symbol und eine kurze Beschreibung für das Foto.
Name des Dropdowns. Wir haben ein sichtbares Label ergänzt, aber Webflow veröffentlichte es mit leerem for-Attribut. Es war daher nicht mit dem Feld verknüpft, und die erneute Prüfung meldete weiter das kritische Problem. Erst ein zugänglicher Name „Workshop date“ direkt am Feld behob den Befund. Tragen Sie im Designer zusätzlich im Feld For des Labels die ID des Dropdowns ein, damit ein Klick auf das Label das Feld fokussiert.
Seitensprache. Sie stammt aus der primären Locale der Website unter Site settings > Localization, gefolgt von einer erneuten Veröffentlichung. Auf der Seite selbst lässt sie sich nicht setzen - planen Sie das mit der Person, die Zugriff auf die Website-Einstellungen hat.

Die erneuten Prüfungen

Jede erneute Prüfung lief wie Neuen Scan starten: Sie prüfte die neu veröffentlichte Seite, statt das zwischengespeicherte Ergebnis zu wiederholen.

Scan	Score	Probleme	Kritisch
Erster Scan	68	6	1
Nach Kontrast- und Alternativtext-Korrekturen	78	4	1
Nach Benennung des Dropdowns	86	4	0

Übrig bleiben die Seitensprache, die beide Engines melden, bis die Website-Einstellung geändert ist, und zwei mittlere Befunde, die nur angemeldete Nutzer sehen. Bevor Sie dem Kunden die Seite als erledigt melden: mit der Tabulatortaste durch das Formular gehen, die Sichtbarkeit des Fokus prüfen und Dropdown und Bilder mit einem Screenreader anhören.

Für Agenturen, die Webflow-Websites betreuen

Drei Webflow-Verhaltensweisen von dieser Seite lohnen sich auf jeder Kundenwebsite zu prüfen: Alternativtexte aus der Asset-Bibliothek in falschem Kontext oder falscher Sprache, Formular-Labels ohne Verknüpfung zum Feld und eine fehlende Website-Sprache. Das Erste ist für automatisierte Regeln unsichtbar; die anderen beiden zeigt ein Scan, beheben lassen sie sich aber nur im Designer oder in den Website-Einstellungen. Das Business-Monitoring (35 € pro Website und Monat oder 336 € pro Website und Jahr; 14-tägige Testphase für berechtigte Konten, Zahlungsmethode erforderlich, verlängert sich bis zur Kündigung) prüft die Website wöchentlich erneut - bringt eine CMS-Änderung ein Problem zurück, erscheint es im nächsten Scan.

Häufige Fragen

Warum zeigt mein Webflow-Bild einen anderen Alternativtext als den, den ich gesetzt habe?: Webflow-Bilder, die mit einem Asset verknüpft sind, können den Alternativtext verwenden, der am Asset in der Bibliothek gespeichert ist. In diesem Beispiel zeigte die veröffentlichte Seite den ukrainischen Alternativtext des Assets auf einer englischen Seite. Setzen Sie den Alternativtext am Bildelement, wenn das Bild einen seitenspezifischen Text braucht.
Warum ist mein Webflow-Formularlabel nicht mit seinem Feld verknüpft?: In diesem Beispiel hatte das veröffentlichte Label ein leeres for-Attribut, das Auswahlfeld hatte daher keinen zugänglichen Namen. Tragen Sie im Designer im Feld For des Labels die ID des Eingabefelds ein oder geben Sie dem Feld direkt einen zugänglichen Namen.
Wie lege ich die Seitensprache in Webflow fest?: Das lang-Attribut des html-Elements stammt aus der primären Locale der Website. Legen Sie sie unter Site settings > Localization fest und veröffentlichen Sie erneut. Auf einer einzelnen Seite lässt es sich nicht beheben.