So entwerfen und erstellen Sie Formulare zur Verbesserung der UX in WordPress

Veröffentlicht: 2019-04-08

Obwohl es ein entscheidender Aspekt auf jeder einzelnen Website ist, ist es ein offenes Geheimnis, dass jeder es hasst, Formulare im Internet auszufüllen.

Aber es stellt sich die Frage…

Warum werden diese Online-Formulare gehasst? Was macht sie so nervig?

Die Antwort ist ziemlich einfach und unkompliziert. Kurz gesagt, es ist das Ergebnis von schlechtem Design und ungeeigneter Platzierung; Kurz gesagt, schlechte Form von UX ist der Hauptschuldige. Heute erfahren Sie in diesem Artikel, wie Sie bessere Formulare entwerfen und dann entsprechend erstellen, die eine hervorragende Benutzererfahrung gewährleisten.

Wie entwirft man bessere Formulare und erstellt sie mit einer guten UX?

Die meisten Online-Interaktionen haben mit Online-Formularen stattgefunden und sind für jede Art von Online-Geschäft unverzichtbar geworden. Wenn Sie also ein Online-Geschäft haben, müssen Sie sich um die Gestaltung kümmern und sich der optimalen Verwendung von Formularen bewusst sein.

Bevor wir in die Tiefe gehen, erstellen wir eine tabellarische Liste:

1. Design-authentische Formen
2. Spaltenlayout und Abschnittsausrichtung
3. Halten Sie Ihr Formular einfach und unkompliziert
4. Stellen Sie die relevantesten Fragen
5. Geben Sie alternative Optionen an
6. Erstellen von Formularen mit mehreren Schritten
7. Inline-Formularvalidierung
8. Formulare entsprechend platzieren
9. Setzen Sie einen starken Call-to-Action
10. Etikettenplatzierung
11. Autofill hinzufügen
12. Spaltenlayout & Abschnittsausrichtung
13. DSGVO-freundliches Formular
14. Verschiedenes

Schauen Sie sich jetzt die Taktik an in Details, die befolgt werden müssen, wenn es um das Entwerfen und Verwenden von Formularen für eine bessere UX geht.

Gestalten Sie authentische Formulare

Meistens wirken die Formulare langweilig und wenig authentisch, weil sie nachlässig und unprofessionell gestaltet sind. Es ist notwendig, dass Sie Ihre Benutzer über den Zweck des Formulars informieren.

Der erste Schritt, um Benutzer dazu zu bringen, ein Formular auszufüllen, besteht darin, ihr Vertrauen zu gewinnen und einen Zweck zu erfüllen!

Benutzer neigen nicht dazu, Informationen über sich selbst bereitzustellen. Und warum sollte jemand seine wertvollen Daten einem Fremden anvertrauen, der kein Vertrauensgefühl aufbaut? In diesem Fall müssen Sie sicherstellen, dass die von ihnen bereitgestellten Informationen in sicheren Händen sind und wie sie von Ihnen verwendet werden.

Während Sie bessere Formulare entwerfen, können Sie Google Captcha oder Goggle reCAPTCHA einsetzen, da sie verhindern, dass Webformulare durch Spam manipuliert werden. Sie werden sehen, dass das Ergebnis des Spams entfernt wird und vor allem die Benutzer sich beim Ausfüllen der Formulare wohl fühlen.

Zurück zum Index

Spaltenlayout & Abschnittsausrichtung

Studien zum Thema Eye-Tracking haben gezeigt, dass einspaltige Formulare besser sind als mehrspaltige Formulare. Im Allgemeinen neigen wir dazu, das Formular auszufüllen, während wir auf einer Website nach unten scrollen: von oben nach unten, und so konzentrieren wir uns auf den Inhalt, den wir eingeben durch gh.

UX in WordPress, Kontaktformulare
Behalten Sie die Ausrichtung in allen Abschnitten bei

In diesem Fall kann ein Formular mit mehreren Spalten Benutzer in die Irre führen und vom Inhalt ablenken. Ein Formular mit parallelen Spalten kann den Fluss unterbrechen und unterbrechen, aber es kann bequemer sein, es in einem einzigen Layout zu halten. Darüber hinaus ist das einspaltige Formular schneller auszufüllen und erhöht das Vertrauensniveau auf bis zu 95 %.

Zurück zum Index

Halten Sie Ihr Formular einfach und unkompliziert

Einfachheit hat die angeborene Kraft, alles authentisch und freundlich erscheinen zu lassen. Gleiches gilt für die Gestaltung von Webformularen. Versuchen Sie, die Webformulare zu vereinfachen und eine einfache und einfache Art der Kommunikation zu schaffen. Machen Sie eine Studie und gehen Sie bei Bedarf auf eine kurze Recherche darüber, was das Formular zu einem Hindernis für seine Benutzer macht.

Es gibt Studien, die auf die Apathie des Benutzers beim Einreichen der Informationen in das Formular hinweisen. Dies bedeutet, dass Sie wahrscheinlich Gefahr laufen, Ihre Conversion zu verlieren, wenn das Formular nicht richtig entworfen und verwaltet wird. Aus diesem Grund wäre es ratsam, die Formulare einfach und leicht auszufüllen.

Zurück zum Index

Stellen Sie die relevantesten Fragen

Um das Interesse der Benutzer am Ausfüllen von Formularen sicherzustellen, fragen Sie nur nach dem, was Sie wirklich brauchen, damit sie sich nicht langweilen. Dies sollte sofort implementiert werden, um eine bessere UX zu gewährleisten. Machen Sie es minimal, um das maximale Ergebnis zu erzielen.

WordPress, Kontaktformulare
Stellen Sie relevante Fragen

Eine Sache, die Sie beim Entwerfen von Formularen beachten müssen, sind die Länge und Anzahl der Eingabefelder in einem Formular einige der Schlüsselkomponenten, die berücksichtigt werden müssen. Denn die Länge eines Formulars ist proportional zur Drop-off-Rate. Das bedeutet, je länger Formulare Sie auf Ihrer Website kleben, desto höher ist die Drop-off-Rate, die Sie erwarten können.

Einmal offenbarte Neil Patel in einem seiner Artikel, dass er die Conversion um 26 % steigern konnte, indem er nur ein einziges Formularfeld aus seinem Kontaktformular entfernte. Stellen Sie also sicher, dass Ihr Kontaktformular die relevantesten Fragen enthält.

Formulare mit mehreren Schritten erstellen

Das Entwerfen von Webformularen zum Erstellen von mehrstufigen Formularen könnte eine weitere großartige Möglichkeit sein, die Benutzerbindung zu erhöhen und Formulare weniger lästig zu machen. Dies bedeutet, dass das Aufteilen von Formularen in mehrere Schritte für weniger Ermüdung beim Ausfüllen des Formulars sorgt.

Versuchen Sie beim Entwerfen, ein mehrstufiges Formular zu erstellen, im ersten Schritt nicht mehr als 2-3 Felder beizubehalten. Darüber hinaus motiviert der Fortschrittsbalken des Formulars die Benutzer, auch den gesamten Formularausfüllvorgang abzuschließen. Dadurch entsteht keine Ablenkung beim Ausfüllen des Formulars.

Zurück zum Index

Inline-Formularvalidierung

Ihre Online-Formulare sollten so gestaltet sein, dass sie sicherstellen, dass die validesten Informationen von Benutzern gesammelt werden. Wenn beispielsweise jemand ungültige Informationen bereitstellt, zeigt das Formular bei diesem Fehler ein rotes Signal an. Dieses Ereignis hilft Benutzern letztendlich beim Ausfüllen des Formulars.

Es gibt eine Reihe von Vorteilen, wenn Sie die Validierung innerhalb des Formulars platzieren. Einige von ihnen sind unten aufgeführt:

  • Die Validierung hilft Benutzern, die Fehler beim Ausfüllen des Formulars zu verstehen. Dies stellt die Richtigkeit der Daten sicher, die sie über das Formular angeben.
  • Es schafft auch ein Gefühl des Vertrauens bei den Benutzern. Das erfolgreich abgeschlossene Ausfüllen des Formulars zeigt Daumen nach oben mit ermutigendem visuellem Feedback.
  • Benutzer geben genaue und gültige Informationen an, gleichzeitig erhalten die Empfänger auch authentische Daten.

Geben Sie alternative Optionen an

Während Sie Benutzern die Möglichkeit bieten, sich auf Ihrer Website anzumelden, behalten Sie eine oder mehrere alternative Möglichkeiten bei, um dies zu erreichen. Damit steigern Sie auf jeden Fall das Interesse Ihrer Nutzer, das jeweilige Formular auszufüllen.

Plugin UX & UI WordPress
Alternative Option angeben

Der beste Weg, um alternative Optionen bereitzustellen, besteht darin, Ihren Benutzern die Anmeldung über Google, Facebook, Twitter oder andere Medien zu ermöglichen. Insgesamt lässt sich die Idee als „Weniger ist mehr“-Philosophie definieren, die Sie beim Entwerfen von Formularen in die Praxis umsetzen müssen.

Zurück zum Index

Formulare entsprechend platzieren

Nach dem Entwerfen von Webformularen ist es an der Zeit, sie an der richtigen Stelle zu platzieren. Dies erhöht das Engagement der Benutzer und hilft dabei, die richtigen Personen dazu zu bringen, den von Ihnen angebotenen Diensten zu vertrauen.

Einige Statistiken zeigen, dass die Interaktionszeit normalerweise am höchsten ist, wenn Sie die Formulare an der obersten Position platzieren. Dies erregt die Aufmerksamkeit Ihrer Benutzer überhaupt erst, wenn sie Ihre Website besuchen.

Aber auch hier kann es zu aufdringlich sein und die Benutzer verärgern, ein Abonnementformular zu platzieren, bevor Benutzer Ihre Seiteninhalte sehen können. Kurz gesagt, es gibt keine feste Regel, wo Sie Ihr Formular auf einer Seite platzieren sollten. Dies hängt von mehreren Variablen ab, wie z. B. dem Zweck dieser bestimmten Seite, Ihrem Geschäftsziel, dem allgemeinen Verhalten der Zielgruppe usw.

Grundsätzlich müssen Sie zwischen Ihrem Ziel und dem, was Ihre Benutzer benötigen, abwägen. und platzieren Sie das Formular entsprechend.

Zurück zum Index

Setzen Sie einen starken Call-to-Action

Statistiken zeigen eine überraschende Tatsache, dass 72 % der B2B-Vermarkter keinen Call-to-Action auf ihren Innenseiten haben. Stellen Sie sicher, dass Sie einen starken und einprägsamen Aufruf zum Handeln haben. Denken Sie beim Entwerfen eines Formulars daran, dass der CTA ein Wendepunkt zwischen Conversions und Absprungrate ist.

Aufruf zum Handeln, WordPress
Fügen Sie einen starken Call-to-Action hinzu

Ein passender CTA wird am Ende tonnenweise angeklickt, weil er die Nutzer zu positivem Handeln zwingt. Darüber hinaus verwirren zu viele CTAs die Leute und Sie müssen sicher sein, was Sie anbieten, und die Kopie des CTA muss dies zeigen.

Insgesamt müssen Größe, Farbe und Text des CTA aussagekräftig sein, damit er Wirkung erzielen kann. Sie können den CTA an Ihrer Markenstimme und Ihrem Ton ausrichten. Versuchen Sie, ein Gefühl der Dringlichkeit zu erzeugen, das sich auf die Bruttonutzer auswirken kann.

Zurück zum Index

Etikettenplatzierung

Labels informieren Benutzer über die Informationen, die sie in das Eingabefeld eingeben müssen. Grundsätzlich sind sie außerhalb des Formularfeldes positioniert. Genau wie bei der Formularplatzierung selbst gibt es bei der Etikettenplatzierung keine eindeutige Anleitung, wo und wie sie ausgerichtet und platziert werden sollen. Das hängt vor allem von der Situation und den Anforderungen ab.

Formulardesigner können die Beschriftung ausblenden, um Formulare zu animieren, anstatt Platzhalter zu verwenden. Am gebräuchlichsten ist jedoch die Positionierung außerhalb des Formularfelds. Sie können das Etikett auch ausrichten, um mehr Aufmerksamkeit von den Benutzern zu erhalten. Die linksbündige Beschriftung erhält normalerweise mehr Aufmerksamkeit von den Benutzern. Stellen Sie also sicher, dass Sie das Formularetikett entsprechend gestaltet haben.

Zurück zum Index

Automatisches Ausfüllen hinzufügen

Ziehen Sie das automatische Ausfüllen in Betracht, wenn die Benutzer in den relevanten Feldern bereits bei Ihren Diensten registriert sind. Dies spart Zeit und unnötigen Aufwand beim Ausfüllen eines bestimmten Formulars.

Sie können einige Eingabefelder auch mithilfe der Geolokalisierung automatisch ausfüllen. Dies wird ihnen helfen, das Formular schnell auszufüllen. Stellen Sie in diesem Fall sicher, dass alle Eingabefelder für die Anpassung verfügbar sind, und geben Sie ihnen die maximale Kontrolle, während sie das jeweilige Formular ausfüllen.

Zurück zum Index

DSGVO-freundliches Formular

Machen Sie Ihre Formulare DSGVO-freundlich, damit sie innerhalb der Vorschriften der Europäischen Union (EU) funktionieren. Dies ist heutzutage einer der wichtigsten Aspekte und schützt Ihr Unternehmen vor den Auswirkungen des EU-Rechts.

DSGVO, DSGVO freundliches Kontaktformular
Erstellen Sie ein DSGVO-freundliches Formular

Obwohl nicht ersichtlich ist, wie Sie von der DSGVO betroffen sein können, kann sie die Quelle der Zerstörung für jede Art von Organisation sein. Führen Sie diesbezüglich eine gründliche Studie durch oder wenden Sie sich an einen Experten, der sich mit der DSGVO befasst.Lernen mehr darüber, wie Sie Ihre Website DSGVO-freundlich gestalten können.

Lesen Sie auch: So machen Sie Ihre Website mit einem WordPress-Plugin DSGVO-freundlich.

Zurück zum Index

Sonstig

Abgesehen von den oben genannten Problemen gibt es noch einige andere Probleme, die Sie berücksichtigen sollten, um eine bessere UX auf Ihrer Website zu haben. Werfen wir einen Blick auf die folgende Auflistung:

  • Einige Statistiken zeigen, dass Platzhalter in den Formularfeldern oft die Benutzerfreundlichkeit beeinträchtigen, manchmal kann dies das Ausfüllen von Formularen erschweren. Aber manchmal kann es eine gute Wahl sein, den einzigen Platzhalter anstelle der Feldbezeichnung beizubehalten. Es hängt von der Situation ab. Beispielsweise können wir bei einer Newsletter-Anmeldung anstelle eines Labels nur den Platzhalter verwenden.
  • Es ist nicht erforderlich oder notwendig, Label und Platzhalter gleichzeitig beizubehalten.
  • Bei Bedarf sollten die Feldbezeichnungen und ihre Eingabefelder visuell gruppiert werden, um Benutzern das Verständnis des Formulars zu erleichtern. Seien Sie in diesem Fall vorsichtig mit den losen Polstern, sie können manchmal ein Buzzkill sein.
  • Sie können die Autofokussierung zum Hervorheben des Startpunkts hervorheben. Dies hilft dem Benutzer, richtig zu beginnen.
  • Großbuchstaben sind schwer zu lesen; Es wäre ratsam, das Etikett in der Kombination von beidem zu schreiben. Manchmal können Schaltflächentexte in Großbuchstaben geschrieben werden.
  • Die Schaltfläche ist etwas, das die direkte Aktion des Benutzers ausführen soll. Daher sollte dem Button-Design besondere Beachtung geschenkt werden. Der Button sollte nach dem Anhängen der Felder gestaltet und erstellt werden.
  • Vergessen Sie nicht, die maskierte Eingabe einzubinden, um das Ausfüllen des Formulars zu erleichtern.
  • Es ist ratsam, anstelle eines Dropdown-Menüs ein Optionsfeld zu verwenden. Dies beschleunigt das Ausfüllen des Formulars. Es macht das Ausfüllen von Formularen einfach und reibungslos.
  • Bewahren Sie eine Option zur Passwortvorschau oder die Möglichkeit für Benutzer auf, ihre Informationen zu überprüfen, bevor sie auf die Schaltfläche „Senden“ klicken. In diesem Fall benachrichtigen Sie die Benutzer auch über die gedrückte Feststelltaste.

Zurück zum Index

Vor dem Ende

Formulare sind einer der unverzichtbarsten Bestandteile einer Website. Aus diesem Grund könnte das Entwerfen von Formularen und das anschließende Erstellen eines Formulars der entscheidende Aspekt für eine solide UX auf Ihrer Website sein. Bevor Sie Formulare entwerfen, müssen Sie die Dinge aus der Perspektive des Benutzers sehen.

1 neues NT-BG

WP Fluent Forms Pro

Probieren Sie Fluent Forms noch heute aus und überzeugen Sie sich selbst!

Jetzt downloaden

Gestalten Sie alle Formulare von Anfang bis Ende prägnant und erleichtern Sie den Benutzern das Ausfüllen des gesamten Formulars. Machen Sie eine gründliche Studie aus den relevanten Ressourcen und geben Sie sich die beste Mühe, die Sie brauchen. Da Formulare ein wichtiger Teil der Konversionsleistung sind, stellen Sie sicher, dass die Benutzer sie schnell und reibungslos durchlaufen können.

Fazit

Da Formulare ein kritischer Teil Ihrer Website sind, müssen Sie bei der Gestaltung und Erstellung sorgfältig vorgehen. Beim Entwerfen von Webformularen ist es immer wichtig, A/B-Tests durchzuführen und alle aktuellen Marketingtrends zu untersuchen.

Außerdem sollten Sie sicherstellen, dass alle von Ihnen erstellten Formulare für Mobilgeräte geeignet sind. Zusammenfassend lässt sich sagen, dass es definitiv die beste Wahl für Ihre Website wäre, wenn Sie die hier besprochenen Taktiken befolgen.

Als meine Empfehlung: Wenn Sie ein beliebiges WordPress-Formularerstellungs-Plugin verwenden möchten, stellen Sie sicher, dass Sie WP Fluent Forms verwenden, um Ihre UX in WordPress zu verbessern. Ich hoffe, dieser Artikel hat Ihnen sehr dabei geholfen, mehr über das Entwerfen von Formularen auf Ihrer Website zu erfahren, um die Website-UX zu verbessern. Wenn Sie Fragen zum Kontext haben, teilen Sie mir Ihr Anliegen mit, indem Sie unten einen Kommentar hinterlassen. Hoffentlich melde ich mich in Kürze bei Ihnen zurück.

Einige coole empfohlene Lektüre:

? TypeForm-Alternativen

? Caldera Forms vs. WP Fluent Form

? Erhöhen Sie das Benutzerengagement