E-Mail-Feld
Sammeln Sie E-Mail-Adressen zuverlässig. Von Kontaktformularen bis hin zu Registrierungen mit Zwei-Faktor-Authentifizierung, Domainbeschränkungen und Browser-Autovervollständigung – das E-Mail-Feld ermöglicht die präzise Erfassung von E-Mail-Adressen mit integrierter Validierung und Tippfehlervermeidung.
Professionelle E-Mail-Sammlung mit intelligenter Validierung
Perfekt für:
Leistungsstarke Funktionen für jeden Anwendungsfall
✅ E-Mail-Bestätigungsfeld
Vermeidung von Tippfehlern durch doppelte Eingabe:
Fügen Sie ein zweites Feld „E-Mail bestätigen“ hinzu, in dem Benutzer ihre E-Mail-Adresse erneut eingeben müssen. Dies verhindert Tippfehler und gewährleistet eine korrekte Erfassung der E-Mail-Adressen.
So funktioniert es:
- Das primäre E-Mail-Feld wird zuerst angezeigt
- Das Feld „E-Mail bestätigen“ wird unten angezeigt
- Das System prüft, ob beide Einträge übereinstimmen.
- Visuelles Feedback zeigt den Übereinstimmungsstatus an (grün = Übereinstimmung, rot = Nichtübereinstimmung).
- Das Formular wird erst abgeschickt, wenn die E-Mail-Adressen übereinstimmen.
Warum eine Bestätigung verwenden?
- Verhindert kostspielige Tippfehler ([E-Mail geschützt] vs gmail.com)
- Gewährleistet die Zustellbarkeit wichtiger E-Mails
- Reduziert die Absprungraten
- Professionelle Best Practices für kritische Formulare
- Die Nutzer bemerken ihre eigenen Fehler.
Perfekt geeignet für:
- Kontoregistrierung (E-Mails zum Zurücksetzen des Passworts)
- Auftragsbestätigungen (Empfangsbestätigung)
- Veranstaltungsanmeldung (Ticket-E-Mails)
- Zahlungsbenachrichtigungen
- Jede Form, bei der die Genauigkeit der E-Mail-Adresse von entscheidender Bedeutung ist
Benutzererfahrung:
Echtzeit-Validierung mit farbcodierter Rückmeldung. Nutzer sehen sofort, ob die E-Mail-Adressen übereinstimmen, ohne auf das Absenden des Formulars warten zu müssen.
🏢 Domainbeschränkung
Bestimmte E-Mail-Domänen auf die Whitelist setzen:
Aktivieren Sie „Zulässige E-Mail-Domänen einschränken“, um nur E-Mails von bestimmten Domänen zu akzeptieren. Ideal für firmeninterne Formulare, private Registrierungen oder kontrollierten Zugriff.
So funktioniert es:
- Geben Sie die zulässigen Domänen ein (eine pro Zeile).
- Das System prüft die E-Mail-Domäne bei der Übermittlung.
- Es werden nur passende Domains akzeptiert.
- Klare Fehlermeldungen für abgelehnte Domains
Häufige Anwendungsfälle:
Nur für Firmen-E-Mails:
Für interne Formulare, Mitarbeiterbefragungen oder Mitarbeiterregistrierungen dürfen nur E-Mail-Adressen mit der Endung `@yourcompany.com` zugelassen werden.
Bildungseinrichtung:
Beschränken Sie die Nutzung auf `@university.edu` für Formulare, die ausschließlich für Studierende bestimmt sind, Campus-Umfragen oder akademische Anmeldungen.
Mehrere Partner:
Erlauben Sie mehrere Domains wie `company1.com`, `company2.com`, `partner3.com` für Partnerportale oder B2B-Formulare.
Verifizierte Organisationen:
Bestimmte Organisationen auf die Whitelist setzen, um Mitgliedern exklusive Inhalte, Angebote oder verifizierten Zugriff zu gewähren.
Beispiele:
- Mitarbeiterfeedback: Nur `yourcompany.com`
- Studentenportal: `school.edu`, `university.edu`
- Partnerregistrierung: `partner1.com, partner2.com, partner3.com`
- Mitgliederzugang: `org1.org, org2.org, nonprofit.org`
Vorteile:
- Gewährleistet die Rechtmäßigkeit der Einreichungen
- Verhindert unbefugten Zugriff
- Bestätigt die Zugehörigkeit zu einer Organisation
- Reduziert Spam aus öffentlichen E-Mails
- Kontrolliert den Zugriff auf geschützte Formulare
🔄 Browser-Autovervollständigung
Schnellere E-Mail-Eingabe:
Aktivieren Sie „Browservorschläge zulassen“, damit Ihr Browser Ihnen zuvor verwendete E-Mail-Adressen vorschlägt. Sie können dann mit einem Klick eine gespeicherte E-Mail-Adresse auswählen.
So funktioniert es:
Der Browser erkennt das E-Mail-Feld.
Schlägt gespeicherte E-Mail-Adressen vor
Der Nutzer klickt auf den Vorschlag zum automatischen Ausfüllen.
Sofortiges Ausfüllen des Formulars
Vorteile:
Schnelleres Ausfüllen des Formulars (1 Klick statt Tippen)
Reduziert Tippfehler (keine manuelle Eingabe)
Verbessert die Benutzererfahrung
Höhere Abschlussquoten
Besonders hilfreich auf Mobilgeräten
Datenschutzfreundlich:
Nutzer bestimmen selbst, was Browser speichern. Die Autovervollständigung respektiert die Datenschutzeinstellungen des Browsers und die Nutzerpräferenzen.
Wann aktivieren?
Kontaktformulare (für wiederkehrende Besucher)
Newsletter-Anmeldungen (wiederkehrende Nutzer)
Schnellanfrageformulare
Öffentliche Formulare mit wiederholter Nutzung
Wann deaktivieren?
Sensible Registrierungen
Szenarien mit gemeinsam genutzten Computern
Hochsicherheitsformulare
Wenn die E-Mail-Adresse manuell eingegeben werden muss
✉️ Integrierte E-Mail-Validierung
Automatische Formatprüfung:
E-Mail-Felder beinhalten eine integrierte HTML5-Validierung. Browser überprüfen das E-Mail-Format automatisch vor dem Absenden.
Validierungsregeln:
Muss das `@`-Symbol enthalten
Vor dem `@` (Benutzername) muss Text stehen.
Nach `@` muss eine Domain stehen.
Es muss eine gültige Domainendung vorhanden sein (.com, .org usw.).
Keine Leerzeichen oder ungültige Zeichen
Echtzeit-Feedback:
Browser zeigen Validierungsmeldungen an wie „Bitte fügen Sie das '@' in die E-Mail-Adresse ein“ oder „Bitte geben Sie die E-Mail-Adresse nach dem '@' ein“.
Häufige Fehler erkannt:
Fehlendes „@“: „useremailcom“ ✗
Fehlende Domäne: `user@` ✗
Fehlende Erweiterung: `user@domain` ✗
Leerzeichen: `[email protected]` ✗
Ungültige Zeichen: `user@@email.com` ✗
Gültiges E-Mail-Format:
`[E-Mail geschützt] `,`[E-Mail geschützt] `,`[E-Mail geschützt] ` ✓
📝 Standard-E-Mail-Wert
Vorausgefüllte E-Mail-Adressen:
Legen Sie eine Standard-E-Mail-Adresse fest, die beim Laden des Formulars angezeigt wird. Nützlich für Support-E-Mails, Standardkontakte oder Demoformulare.
Anwendungsfälle:
- E-Mail-Adresse für Rückrufanfragen vorausfüllen
- Beispiel-E-Mail-Format anzeigen ([E-Mail geschützt] )
- Bekannte Benutzer-E-Mail-Adresse aus Datenbank auswählen
- Standardkontakt für die Organisation
Bearbeitbar:
Benutzer können den Standardwert problemlos ändern oder ersetzen. Es handelt sich um einen Ausgangspunkt, der nicht gesperrt ist.
🎯 Verbesserte Benutzererfahrung
Intelligente Funktionen integriert:
- E-Mail-spezifische Tastatur – Mobilgeräte zeigen eine optimierte Tastatur mit den Tasten @ und . an.
- Autocomplete-Attribut – Korrekte HTML5-Autovervollständigung für E-Mail-Felder
- Leerzeichen entfernen – Automatisches Entfernen versehentlicher Leerzeichen
- Umwandlung in Kleinbuchstaben – Optionale Umwandlung in Kleinbuchstaben zur Vereinheitlichung
- Visuelle Validierung – Farbcodiertes Feedback zur Bestätigung der Übereinstimmung
- Klare Fehlermeldungen – Spezifisches Validierungsfeedback
- Erforderliche Validierung – E-Mail-Eingabe verpflichtend machen
- Hilfetext-Unterstützung – E-Mail-Formatierungshinweise hinzufügen
- Benutzerdefinierte CSS-Klassen – Benutzerdefiniertes Styling anwenden
- Unterstützung für Barrierefreiheit – ARIA-Labels, kompatibel mit Bildschirmleseprogrammen
- Platzhaltertext – Hinweise zum E-Mail-Format anzeigen
- Einfach zum Kopieren und Einfügen – Vollständige E-Mail-Adressen werden sauber eingefügt
🔀 Bedingte Logik
Dynamische Sichtbarkeit von E-Mail-Feldern:
E-Mail-Felder basierend auf anderen Formularwerten ein- oder ausblenden. E-Mail-Sammlung nur bei Bedarf anzeigen.
Erweiterte Logikregeln:
- UND-Logik – Alle Bedingungen müssen erfüllt sein
- ODER-Logik – Jede Bedingung kann die Aktion auslösen
- 8 Operatoren – Gleich, Ungleich, Größer als, Kleiner als, Enthält, Ist leer und mehr
Anwendungsfälle:
- „Geschäftliche E-Mail“ nur anzeigen, wenn der Kundentyp „Geschäftlich“ entspricht.
- „Alternative E-Mail-Adresse“ anzeigen, wenn der Benutzer „Zweiten Kontakt hinzufügen“ aktiviert.
- „Firmen-E-Mail“ anzeigen, wenn der Registrierungstyp „Unternehmen“ entspricht.
- „Private E-Mail“ ausblenden, wenn die Kontaktpräferenz auf „Nur Telefon“ eingestellt ist.
Einfache Einrichtung in 3 Schritten
Bereiten Sie Ihr E-Mail-Feld in wenigen Minuten vor.
E-Mail-Feld hinzufügen
Ziehen Sie das E-Mail-Feld aus dem Abschnitt „Basisfelder“ per Drag & Drop in Ihr Formular.
Bestätigung aktivieren (optional)
Aktivieren Sie die Option „Bestätigungsfeld hinzufügen“, um eine doppelte Dateneingabe zu erzwingen und Tippfehler in wichtigen Formularen zu vermeiden.
Einschränkungen konfigurieren (optional)
Aktivieren Sie die Domänenbeschränkung für E-Mails, die nur für das Unternehmen bestimmt sind, schalten Sie die Browser-Autovervollständigung ein, um den Komfort zu erhöhen, und legen Sie bei Bedarf einen Standardwert fest.
:-) Das war's! Ihr E-Mail-Feld ist nun mit intelligenter Validierung und Tippfehlervermeidung ausgestattet.
Anwendungen aus der realen Welt
Kontaktformulare
* Allgemeine Anfragen per E-Mail
* Ansprechpartner für Supportanfragen
* Erfassung von Kontaktdaten
* E-Mails mit Rückrufanfrage
Registrierung
* E-Mails zur Kontoerstellung
* E-Mails mit Anmeldeinformationen
* E-Mails zum Zurücksetzen des Passworts
* Bestätigungs-E-Mail-Adressen
Newsletter & Marketing
* Newsletter-Abonnement-E-Mails
* Erfassung von Marketing-Opt-ins
* Anmeldungen für E-Mail-Kampagnen
* Sammlung von Werbe-E-Mails
E-Commerce
* Bestellbestätigungs-E-Mails
* Empfangsbestätigungs-E-Mails
* Versandbenachrichtigungs-E-Mails
* E-Mails zum Kundenkonto
Geschäftsanwendungen
* E-Mails mit Angebotsanfragen
* E-Mails mit Angebotsbenachrichtigungen
* E-Mails zur Projektkommunikation
* Kundenkontakterfassung
Bildung & Veranstaltungen
* E-Mails zur Veranstaltungsregistrierung
* E-Mails zur Kurseinschreibung
* Webinar-Benachrichtigungs-E-Mails
* E-Mails zur Zertifikatszustellung
Feldoptionen ausfüllen
Grundlegende Einstellung
- Feldbezeichnung – Der Titel, der über dem E-Mail-Feld angezeigt wird
- Beschreibung/Hilfetext – Zusätzliche Hinweise für Benutzer
- Pflichtfeld – E-Mail-Eingabe als Pflichtfeld festlegen
- Platzhaltertext – Hinweis, der dem Benutzer angezeigt wird, bevor er tippt (z. B. „[E-Mail geschützt] ")
Standardwert
Standardwert – Vorausgefüllte E-Mail-Adresse beim Laden des Formulars
E-Mail-Bestätigung
- Bestätigungsfeld hinzufügen – Fügt ein zweites Feld hinzu, in dem Benutzer ihre E-Mail-Adresse erneut eingeben müssen, um Tippfehler zu vermeiden.
- Prüft automatisch, ob beide Einträge übereinstimmen
- Zeigt farbcodiertes Echtzeit-Feedback
- Verhindert das Absenden des Formulars, bis die E-Mail-Adressen übereinstimmen.
Browser-Integration
Browservorschläge zulassen – Erlauben Sie Ihrem Browser, zuvor verwendete E-Mail-Adressen für eine schnellere Vervollständigung vorzuschlagen.
Domain-Einschränkungen
Zulässige E-Mail-Domänen einschränken – Nur E-Mail-Adressen bestimmter Domänen akzeptieren (z. B. nur Firmen-E-Mails)
- Zulässige E-Mail-Domänen – Geben Sie jede zulässige Domäne in einer neuen Zeile ein (ohne @-Symbol).
- Beispiel: `gmail.com`, `outlook.com`, `yourcompany.com`
- Eine Domäne pro Zeile
- Das System validiert die Domain bei der Übermittlung.
Bedingte Logik
- Bedingte Logik aktivieren – Ein-/Ausblenden basierend auf Bedingungen
- Logiktyp
- Alle Bedingungen müssen erfüllt sein (UND)
- Jede Bedingung kann erfüllt sein (ODER)
- Bedingungsregeln
- Anzeigen/Ausblenden – Zu ergreifende Maßnahmen
- Feld – Welches Feld soll geprüft werden?
- Operator – Gleich, Ungleich, Enthält, Größer als, Kleiner als, Ist leer, Ist nicht leer
- Wert – Vergleichswert
- Mehrere Bedingungen – Unbegrenzt viele Regeln hinzufügen
Erweiterte Optionen
- Verstecktes Feld – Feld ausblenden, E-Mail-Adresse aber in die Übermittlungen einbeziehen
- Benutzerdefinierte CSS-Klassen – Benutzerdefiniertes Styling anwenden
- Barrierefreiheitsattribute – ARIA-Bezeichnungen für Bildschirmlesegeräte
- Texttransformation – Optionale Umwandlung in Kleinbuchstaben
- Leerzeichenbereinigung – Automatische Leerzeichenentfernung
Warum sollten Sie sich für unser E-Mail-Feld entscheiden?
✅ Tippfehlervermeidung -
Das Bestätigungsfeld gewährleistet die korrekte Erfassung von E-Mail-Adressen.
✅ Domänenbeschränkung -
Bestimmte Domains für kontrollierten Zugriff auf die Whitelist setzen
✅ Browser-Autovervollständigung -
Schnellerer Zugriff dank gespeicherter E-Mail-Vorschläge
✅ Integrierte Validierung – Automatische HTML5-E-Mail-Formatprüfung
✅ Mobil optimiert – E-Mail-spezifische Tastaturen auf Mobilgeräten
✅ Visuelles Feedback – Echtzeit-Übereinstimmungsprüfung zur Bestätigung
✅ Spam-Reduzierung – Domainbeschränkungen verhindern gefälschte E-Mails
✅ Anwenderfreundlich – Klare Validierungsmeldungen und Hinweise
✅ Voll Integriert – Funktioniert nahtlos mit allen Formularfunktionen
Häufig gestellte Fragen
F: Wozu dient das E-Mail-Bestätigungsfeld?
Es fügt ein zweites Feld „E-Mail bestätigen“ hinzu, in dem Benutzer ihre E-Mail-Adresse erneut eingeben müssen. Verhindert Tippfehler wie [E-Mail geschützt] statt gmail.com. Beide Felder müssen übereinstimmen, um die Anfrage abzusenden.
F: Wie funktioniert die Domänenbeschränkung?
Aktivieren Sie diese Funktion und geben Sie die zulässigen Domains (eine pro Zeile) wie z. B. IhreFirma.com ein. Nur E-Mail-Adressen, die mit diesen Domains enden, werden akzeptiert.
F: Kann ich mehrere Domains zulassen?
Ja. Geben Sie mehrere Domains ein, eine pro Zeile, z. B. company1.com, company2.com, partner.com. Alle werden akzeptiert.
F: Soll ich für alle Formulare eine E-Mail-Bestätigung verwenden?
Verwenden Sie es für wichtige Formulare wie Anmeldungen, Bestellungen oder Veranstaltungstickets. Verzichten Sie bei einfachen Anfrageformularen darauf, um die Bearbeitung für die Nutzer zu beschleunigen.
F: Was bewirkt die Option „Browservorschläge zulassen“?
Es ermöglicht die automatische Vervollständigung im Browser, sodass Benutzer aus ihren gespeicherten E-Mail-Adressen auswählen können, anstatt sie manuell einzugeben.
F: Können Benutzer die E-Mail-Validierung umgehen?
Nein. Browser setzen E-Mail-Formatregeln automatisch durch und blockieren falsche Formate wie user@ oder @domain.com.
F: Wie kann ich den Zugriff auf E-Mails ausschließlich auf Firmen-E-Mails beschränken?
Aktivieren Sie „Zulässige E-Mail-Domänen einschränken“ und geben Sie Ihre Unternehmensdomäne ein. Nur E-Mails mit dieser Domäne werden akzeptiert.
F: Wird das Bestätigungsfeld in derselben Zeile angezeigt?
Nein. Es erscheint direkt unter dem Haupt-E-Mail-Feld mit der Bezeichnung „E-Mail bestätigen“.
F: Welche Tastatur wird auf dem Handy angezeigt?
Auf Mobilgeräten wird eine E-Mail-freundliche Tastatur mit @-Zeichen, Punkt und gängigen Domain-Tastenkombinationen angezeigt.
F: Kann ich E-Mail-Felder mit bedingter Logik verwenden?
Ja. Sie können E-Mail-Felder basierend auf Benutzerauswahlen mithilfe von Bedingungen wie „Ist leer“, „Ist nicht leer“ oder „Gleich“ ein- oder ausblenden.
F: Was passiert, wenn die Domains nicht übereinstimmen?
Der Benutzer erhält eine Meldung wie: „E-Mail-Domäne nicht zulässig. Bitte verwenden Sie eine zugelassene Domäne.“
F: Sollte ich die Autovervollständigung aus Sicherheitsgründen aktivieren?
Das kommt darauf an. Aktivieren Sie die Option für mehr Komfort in öffentlichen Formularen. Deaktivieren Sie sie auf gemeinsam genutzten oder sensiblen Systemen, wenn die manuelle Eingabe bevorzugt wird.
