Webflow Q&A: Barrierefreiheit richtig umsetzen / Bildkomprimierungs-Tricks / Spam-Schutz in Formularen / SEO beim Export / GmbH gründen / KI & Webdesign / Hintergrundvideos & Performance

Eure Fragen im Überblick

Andrej fragt

Aktuell bin ich ich Freiberufler und verdiene immer mehr. Ich frage mich, ab wann sich eine GmbH lohnt. Kannst du bei Gelegenheit dazu deine Gedanken teilen? Danke!

Alex fragt:

• Wenn man bei Webflow den Code exportiert, dann gehen die Funktionen für Formulare und CMS verloren. Ich habe es mit einem make.com Webhook getestet, und die Formulare funktionieren trotzdem. Worauf muss man noch achten, wenn man Webflow-Code exportiert und extern hostet? Besonders interessiert mich der SEO-Aspekt – was ist mit Sitemap, Open Graph, Title-Tags und Meta-Descriptions? Hast du solche Projekte früher umgesetzt? Ich weiß, dass du mittlerweile nur noch über Webflow hostest.
• Wie komprimierst du Bilder vom Kunden? Direkt in Webflow, mit TinyPNG oder mit anderen Tools? Ich habe entdeckt, dass „Compression or Die“ die besten Ergebnisse erzielt, aber hier kann man leider nicht automatisieren.
• Gibt es einen schnellen Weg, um in Webflow in den Navigator zu gelangen? Ich weiß, dass man Klassen mit CMD + Enter benennt und Items mit CMD + E/K suchen kann. Gibt es eine ähnliche Funktion für den Navigator? ChatGPT sagt „F“, aber damit öffnet sich bei mir die Finsweet-Erweiterung.
• Was hältst du davon, mehrere Technologien anzubieten (Webflow, WordPress, WIX Studio, Onepage etc.) und je nach Kundenwunsch die passende Plattform zu nutzen?
• Was sagst du zu DeepSeek? Nutzt du es anstelle von ChatGPT oder siehst du es eher als kurzfristigen Trend?
• Siehst du für dich, Webdesign und die Selbstständigkeit allgemein eine Zukunft in AI-Agents?

Milan fragt:

Mich interessiert die Umsetzung eines Hintergrundvideos (Fullscreen) auf der Startseite, das sofort nach dem Laden der Seite angezeigt wird. Es gibt Empfehlungen, das Video auf dem Server zu speichern und direkt von dort zu laden. Performance ist hier sehr wichtig. Welche Lösung gibt es, wenn der Kunde nur eine Domain, aber kein eigenes Hosting hat? Wird so etwas von Webflow unterstützt oder wie würdest du es umsetzen?

Links zur Antwort:

• Dropbox Lösung mit free Account
• 100GB Bandwidth / month bei AWS for free
• BunnyCDN und Video dazu
• Zum Komprimieren von Videos nutze ich HandBrake (Kostenlos, Open Source)

Max fragt:

Wenn eure Seite in Webflow fertig gebaut ist, wie stellt ihr sicher, dass sie auf allen Geräten und Browsern funktioniert?

Martin fragt:

• Gibt es eine Möglichkeit, in Webflow eine Shared Library für mehrere Projekte bereitzustellen, sodass verschiedene Webflow-Sites auf denselben Style Guide oder Design Tokens zugreifen können? Oder ist das nur mit Webflow Enterprise möglich? Falls es eine Workaround-Lösung gibt, welche würdest du empfehlen?
• Ich setze aktuell Formulare mit Formspark und Botpoison um, um Spam zu vermeiden und die DSGVO-Anforderungen zu erfüllen. Stimmt es, dass Webflow-Formulare mittlerweile standardmäßig DSGVO-konform sind? Welche Lösung nutzt du zur Spam-Protection? Ich finde reCAPTCHA problematisch, da es nur funktioniert, wenn der Cookie-Banner akzeptiert wurde. Gibt es eine elegantere Alternative, die du empfehlen kannst?
• Achtest du bei deinen Webflow-Projekten aktiv auf Barrierefreiheit oder ist das für deine Kunden eher kein großes Thema? Falls doch, nutzt du bestimmte Tools zur Überprüfung oder Umsetzung?
• Wie sieht dein grober Workflow aus, bevor du mit der Umsetzung in Webflow startest? Erstellst du zuerst Wireframes und dann das Design in Figma? Arbeitest du Mobile First oder startest du vom Desktop aus? Würde mich interessieren, welche Schritte du vor dem eigentlichen Webflow-Development durchläufst.
• Gibt es bestimmte Dinge, die du in Figma bewusst berücksichtigst, um später effizienter in Webflow weiterarbeiten zu können? Hast du z. B. bestimmte Strukturen, Naming-Konventionen oder Workflows, die sich für dich bewährt haben?

Arne fragt:

Kannst du mal deine Gedanken zum Barrierefreiheitsgesetzt teilen und darauf eingehen, inwiefern und in welchem Umfang (AA oder AAA) du Barrierefreiheit in deinen Web-Projekten umsetzt?

Antwort

Checkliste für Barrierefreiheit nach WCAG 2.1 AA (und teilweise AAA)

🔹 Wahrnehmbarkeit (Perceivable)

• ✅ ALT-Texte für alle relevanten Bilder & Icons
• ✅ Guter Text-Kontrast (mind. 4.5:1 für normalen Text, 3:1 für große Schrift)
• ✅ Responsives Design & Zoom-Kompatibilität (bis 200% ohne Layout-Probleme)
• ✅ Untertitel & Transkripte für Videos und Audios
• ✅ Keine Texte in Bildern (außer Logo)

🔹 Bedienbarkeit (Operable)

• ✅ Tastatur-Navigation möglich (TabReihenfolge beachten)
• ✅ Fokus-Indikatoren sichtbar (:focus für Buttons, Links, Formulare)
• ✅ Keine „Hover-only“-Funktionen (Menüs & Dropdowns auch per Tastatur bedienbar)
• ✅ Klare Formular-Labels & Fehlermeldungen (keine Placeholder als Labels)
• ✅ Keine Auto-Animationen oder Blinke-Effekte (max. 3 Blinks/Sekunde)

🔹 Verständlichkeit (Understandable)

• ✅ Einfache, klare Sprache (keine unnötig komplizierten Begriffe)
• ✅ Konsistente Navigation & Design (Menüs, Buttons immer an der gleichen Stelle)
• ✅ Lesbare Schriftarten (min. 16px, Zeilenhöhe ≥ 1.5em)
• ✅ Eindeutige Button-Beschriftungen (statt „Hier klicken“ besser „Jetzt anmelden“)

🔹 Robustheit (Robust)

• ✅ Semantisches HTML verwenden (<button>, <h1>, <nav> richtig nutzen)
• ✅ ARIA-Attribute nur wenn nötig (role="alert", aria-label für nicht-sichtbare Inhalte)
• ✅ Screenreader-Kompatibilität testen (NVDA, VoiceOver)
• ✅ Formulare & Buttons ohne JavaScript nutzbar