Startseite News UI/UX Online-Formular für Ihre Webseite: Worauf müssen Sie achten?
Formulare verbessern (Usability und Optik)

Online-Formular für Ihre Webseite: Worauf müssen Sie achten?

So werden Online-Formulare gerne ausgefüllt

Eine Webseite ohne Formulare? Das funktioniert meistens nicht. Allerdings gehören diese zu den Elementen, die ein Besucher ungern sieht und schon gar nicht ausfüllen will. Um den User zur Nutzung zu animieren, muss das Online-Formular möglichst perfekt umgesetzt sein. Als professionelle Agentur für Digital Consulting, stehen wir Ihnen dabei gerne zur Seite.

Auf folgende Punkte sollte bei der Erstellung eines Online-Formulars geachtet werden:

Usability und Optik

Keep it simple! Auch bei noch so umfangreichen Datenerfassungen gilt: Auf einen klaren und einfachen Aufbau achten. Unübersichtliche, unnötig komplizierte oder lang wirkende Formulare werden nur sehr ungern bis gar nicht ausgefüllt. Um die Felder optimal erfassen zu können, sollten überflüssige Rahmen, Schattierungen oder Linien vermieden werden. Für die optimale Erfassung dürfen der Hintergrund und die Farben nicht vom Wesentlichen ablenken. Das menschliche Auge bevorzugt ausreichende Abstände zwischen den Feldern und eine lineare Ausrichtung.

Screenshot Formular Linkedin
Abbildung: Übersichtlichkeit – Quelle: www.linkedin.com

Unnötige Felder weglassen
Die Nutzer sind faul. Man sollte sich intensiv im Voraus bzgl. der Felderauswahl beschäftigen und sich stets hinterfragen: Welche Angaben braucht es tatsächlich?

Formulare in Schritte unterteilen und den Fortschritt darstellen
Umfangreiche Formulare müssen in mehrere Schritte unterteilen werden. Das hilf die Funktionsweise schneller zu verstehen – es wirkt leichter. Zusätzlich wird eine Transparenz geschaffen, die es ermöglicht bereits am Anfang zu zeigen, wie viele Schritte noch bis zum Ziel nötig sind. Zusätzlich lässt sich damit unnötiges Scrollen vermeiden.

Screenshot Zalando
Zalando Checkout

Positives Feedback geben
Beim Ausfüllen von Formularen stößt man nahezu immer nur auf Hinweise bzgl. Fehler beim Ausfüllen. Aber warum keine positive Meldung anzeigen, wenn man ein Feld erfolgreich ausgefüllt hat? Das lässt sich schon beispielsweise über kleine Haken neben den befüllten Feldern abdecken.

Screenshot Twitter
Twitter Anmeldung

Keine neuen Fragen aufkommen lassen
Wenn der Nutzer auf ein Feld trifft, das er nicht beantworten kann, bricht er wahrscheinlich ab. Mit gezieltem Einsatz von Tooltips lässt sich dieses Verhalten verhindern.

Formulare bei mobilen Endgeräten

Neben dem geringen Platz kommt bei mobilen Geräten nach wie vor folgendes Problem vor:  Trotz aller Verbesserungen an Tastaturen und steigender Touch-Genauigkeit, sind Formulare ein Thema, das man nicht mit Spaß verbindet. Der Durchschnittsuser wird es nach Möglichkeiten immer vermeiden mobil ein Formular auszufüllen.

Wie bereits oben erwähnt, muss das Formular so reduziert und kompakt wie möglich angelegt werden. Die Felder sollten in der maximal verfügbaren Größe abgebildet werden.
Wo immer es möglich ist, sollten Formularfelder mit Wertvorgaben belegt sein. Zusätzlich kann auf Sensoren der Geräte zurückgegriffen werden. So lässt sich z.B. sehr schnell und ohne zu tippen der Standort hinterlegen. Allerdings muss stets die Möglichkeit gegeben sein, diese Angaben manuell zu überschreiben.

Validierung

Pflichtfelder deutlich kennzeichnen
Falls eine Unterscheidung zwischen Pflichtfeldern und freiwilligen Angaben von­nö­ten ist, hat sich das Sternchen* als Standard für den Hinweis auf ein Pflichtfeld durchgesetzt. Ausnahme: Falls alles Pflicht ist, sind keine Sternchen nötig.

Spam-Schutz

Empfehlung: Google reCAPCTHA
Formulare müssen vor ungewollter Nutzung geschützt werden. Sonst trudelt oft eine Masse an schlecht ausgefüllten und fremdsprachigen Nachrichten ein. Diese werden von genannten Bots ausgefüllt und versendet. Man spricht auch von Spam.

Um das zu verhindern, genügt es das Formular mit dem reCAPCTHA-Tool von Google zu verknüpfen. Es dient als sicherere und viel einfacher ausfüllbare Alternative zu den „unlesbaren Texteingaben“.

Recaptcha gif

Experten für Webdesign und Webtrends

Sie wollen Ihre Webseite modernisieren?

Wir machen grafische Vorschläge für die neue Ausrichtung Ihrer Webseite. Modern und benutzerfreundlich – überzeugen Sie sich selbst!  Nehmen Sie Kontakt zu unseren Webdesignern auf:

Luisa Nutzinger

Ihre Ansprechpartnerin

Luisa Nutzinger

Tel.: 07131 / 12 01 45 – 0

E-Mail: l.nutzinger@econsor.de

Planung einer Webseite mit Wireframes.

Content im Relaunch: Der Schlüssel zu klarer Positionierung und Wirkung

Ein Website-Relaunch ist eine strategische Investitionsentscheidung. Wer dabei nur an neues Design oder eine technische Migration denkt, verschenkt enormes Potenzial. Der entscheidende Hebel liegt im Inhaltskonzept: Wie ist Ihre Website strukturiert? Welche Botschaften treffen Ihre Zielgruppen an den richtigen Stellen? Und wie führt das Zusammenspiel aus Inhalt, Architektur und UI/UX am Ende zu messbaren Ergebnissen? ...

Mehr erfahren

Zwei Mitarbeiterinnen arbeiten an einem Tisch voller farbiger Post-its, sortieren Notizen und entwickeln gemeinsam Ideen in einem modernen Besprechungsraum.

Die 3 Ergebnisstufen eines UX-Konzepts

Erfolgreiche Relaunches beginnen mit Struktur – nicht mit Farben Viele Website-Relaunches starten mit der falschen Frage.Nicht selten lautet sie: „Wie soll die neue Website aussehen?“ Die entscheidendere Frage wäre jedoch:„Wie sollen Nutzer sich orientieren, entscheiden und handeln?“ Denn ein überzeugendes Design ist kein Selbstzweck. Es ist das sichtbare Ergebnis eines sauberen UX-Konzepts. Wer diesen Zusammenhang ...

Mehr erfahren

Webdesign-Spezialist für Webdesign-Trends

Webdesign Trends 2026: Was Conversion, Performance und Wartbarkeit wirklich stärkt

Aktuelle Webdesign-Trends 2025: Das Webdesign bestimmt den Look und schlussendlich auch den Erfolg einer Internetseite.

ECONSOR gewinnt den German Marketing Award 2025

Auszeichnung für den digitalen Markenrelaunch: ECONSOR zählt offiziell zu den besten Agenturen im deutschsprachigen Raum. ECONSOR wird für den eigenen Markenrelaunch mit dem renommierten German Marketing Award 2025 ausgezeichnet. Verliehen wurde der Preis von Make a Brand – einer der bedeutendsten Auszeichnungen für Markenkommunikation im deutschsprachigen Raum. Damit gehört ECONSOR zu den führenden Agenturen, wenn ...

Mehr erfahren

Die Grafik zeigt einen Nutzer vor einem Laptop und Symbole, die Aussagen, dass die Conversion Rate steigt.

UI/UX im Mittelstand: So steigern Sie Conversion-Raten ohne mehr Traffic

Viele Unternehmen im Mittelstand investieren viel Geld in mehr Traffic – über SEO, SEA oder Performance Marketing. Doch häufig bleibt der große Erfolg aus: Mehr Besucher bedeuten nicht automatisch mehr Umsatz. Hier kommt UI/UX ins Spiel, um die Nutzererfahrung zu verbessern und die Conversions zu steigern. Die Bedeutung von UI/UX im Mittelstand wird dabei oft ...

Mehr erfahren

Above-the-Fold optimieren: Der Schlüssel zu erfolgreichem Webdesign 

Ein gut gestalteter Above-the-Fold-Bereich einer Website ist der perfekte Einstieg in die Nutzerreise. Er entscheidet, ob aus Besuchern interessierte Nutzer und schließlich Kunden werden.