In diesem Kurs werden HTML-Formulare in leicht verständliche Teile unterteilt. In den nächsten Modulen erfahren Sie, wie ein HTML-Formular funktioniert und wie Sie es effektiv in Ihren Projekten einsetzen können. Im Menübereich neben dem Logo Learn Forms können Sie zwischen den Modulen wechseln.
Sie erfahren, wie Sie ein einfaches HTML-Formular erstellen, HTML-Formularelemente gestalten, Formulare gestalten, Nutzer bei der Eingabe von Daten unterstützen, dafür sorgen, dass das Formular zugänglich und sicher ist, wie Sie Ihre Formulare testen und welche Formulartypen verfügbar sind.
Jedes Modul ist voller interaktiver Demos und Selbsttests, mit denen Sie Ihr Wissen testen können.
Dieser Kurs ist für Einsteiger und fortgeschrittene HTML-Entwickler geeignet. Die ersten Module helfen Ihnen beim Erstellen von HTML-Formularen. In den anderen Modulen finden Sie weitere Informationen. Sie können die Reihe von Anfang bis Ende durchgehen, um einen allgemeinen Überblick über HTML-Formulare zu erhalten, oder ein bestimmtes Modul auswählen, über das Sie mehr erfahren möchten.
Voraussetzungen
Bevor Sie mit diesem Kurs beginnen, sollten Sie mit HTML vertraut sein. Wer noch nicht mit der Webentwicklung vertraut ist, sollte sich den Kurs Einführung in HTML von MDN ansehen, um alles über das Schreiben von Markups zu erfahren.
Demos
Für die meisten Demos verwenden wir CodePen.
Wenn Sie sich die Demos ansehen, fragen Sie sich vielleicht, woher die Stile kommen. Da wir ein allgemeines Stylesheet verwenden, das in allen Demos enthalten ist, werden nur die relevanten Stile angezeigt. In CodePen können Sie in den Einstellungen die enthaltenen CSS-Dateien auswählen.
Formularsteuerelemente und Formularfelder
Ein Formularsteuerelement ist ein Element, das Nutzerinteraktionen und Dateneingabe oder -auswahl ermöglicht: <input>, <select>, <textarea> oder <button>.
Manchmal bezieht sich Formularfeld auf Formularsteuerelemente, insbesondere Elemente für die Texteingabe: <input> und <textarea>.
Lerninhalte
Nutzerdaten über Formulare abrufen
In dieser Einführung zum Formularelement lernen Sie die Grundlagen der Verwendung von Formularen im Web kennen.
Nutzern bei der Eingabe von Daten in Formulare helfen
Eine Übersicht über die verschiedenen Formularelemente, die Sie zum Erstellen des Formulars auswählen können.
Die erneute Eingabe von Daten in Formulare vermeiden
Machen Sie es Nutzenden einfacher, Formulare auszufüllen.
Nutzern bei der Eingabe der richtigen Daten in Formulare helfen
Hier erfahren Sie, wie Sie Ihre Formulare im Front-End validieren.
Formulare testen
Hier erfahren Sie, wie Sie Ihre Formulare testen und analysieren.
Designgrundlagen
Hier erfahren Sie, wie Sie nutzerfreundliche Formulare erstellen.
Bedienungshilfen
Inklusive Formulare erstellen
Internationalisierung und Lokalisierung
Bereiten Sie sich auf internationale Datenformate vor und erfahren Sie, wie Sie Ihr Formular für die Lokalisierung planen.
Sicherheit und Datenschutz
Hier erfahren Sie, wie Sie Ihre Formulare schützen und die Daten Ihrer Nutzer schützen.
Automatisches Ausfüllen
Hier erfahren Sie alles über Autofill und das Attribut für die automatische Vervollständigung.
Wie Sie Formulare auf Nutzerfreundlichkeit testen
Erfahren Sie, wie Sie Usability-Tests durchführen und sicherstellen können, dass Ihr Formular bei allen Nutzenden gut funktioniert.
Formulare auf verschiedenen Geräten und Plattformen testen
Sorgen Sie dafür, dass Ihr Formular mit verschiedenen Geräten, Browsern, Plattformen und verschiedenen Kontexten funktioniert.
Daten erheben
Hier erfahren Sie, wie Sie Formulare analysieren und analysieren.
Das Formularelement im Detail
Hier erfahren Sie alles über das Formularelement und darüber, wann Sie ein Formular verwenden sollten und wie es im Detail funktioniert.
Detaillierte Formularfelder
Sie lernen die verschiedenen Formularfelder kennen und erfahren, wie Sie das richtige Formularelement auswählen.
Formularattribute im Detail
Hier erfahren Sie alles über Formularattribute: Sie erfahren unter anderem, wie Sie das Layout der Bildschirmtastaturen ändern und die integrierte Validierung aktivieren.
Stile für Formulare festlegen
Gestalten Sie Formulare mithilfe von CSS und stellen Sie gleichzeitig sicher, dass sie für alle nutzbar und lesbar sind.
Stile für Formularsteuerelemente festlegen
Hier erfahren Sie, wie Sie Formularsteuerelemente mit CSS implementieren.
JavaScript
Hier erfahren Sie, wie Sie Ihre Formulare mit JavaScript optimieren können.
Zahlungsformulare
Verbessern Sie die Conversion-Raten, indem Sie bessere Zahlungsformulare erstellen.
Adressformulare
Helfen Sie Nutzern, Adressformulare schnell und einfach auszufüllen.
Fazit und nächste Schritte
Weitere Ressourcen, die Ihnen bei den nächsten Schritten helfen
Sind Sie bereit, mehr über Formulare zu erfahren? Los gehts.