Die Gestaltung von Formularen ist seit vielen Jahren meine Leidenschaft. Meine Leidenschaft für Formen begann 1983, als ich nach meinem Militärdienst der Formularlayoutgruppe von PTT Bedrijfsstijl beitrat, und ist seitdem nicht mehr verschwunden. Lesen Sie mehr über die Geschichte meiner Leidenschaft.

Barrierefreie Formulare:
Es beginnt mit einem grundlegenden Design.

Die Erstellung barrierefreier Formulare ist von entscheidender Bedeutung. Als Formulararchitekt entwerfe ich seit Jahren ganz „normale“ Websites, Formulare und Dokumentvorlagen (egal, ob es sich um Web- oder PDF-Formulare bzw. PDF-Dokumente handelt) unter Berücksichtigung und mit Zuversicht hinsichtlich der Barrierefreiheit. Mein Ansatz ist einfach, klar und unkompliziert und stellt sicher, dass jeder direkten Zugriff auf Informationen hat. Ein Formular ist ein Mittel zur Steigerung der Interaktion zwischen Benutzer und Kunde und bildet die Grundlage für eine intelligente Website.

Als Formulararchitekt bin ich davon überzeugt, dass Barrierefreiheit nicht nur eine Anforderung, sondern auch eine Verantwortung und ein Bewusstsein jedes Websitebesitzers ist.

Ich bin stolz darauf, sicherzustellen, dass die Formulare meiner Kunden inklusiv und für alle Benutzer einladend sind. Mit meiner Expertise stelle ich sicher, dass die Websites, Formulare und Dokumente meiner Kunden die Standards und Vorschriften zur Barrierefreiheit zuverlässig und problemlos erfüllen.

Grundlegendes Design von Webformularen

Beginnen Sie mit einem guten barrierefreien Design und lesen Sie meine Anleitung auf meinem GitHub und lesen Sie die Informationen für ein intelligentes und barrierefreies Basisdesign.

Basicdesign-Webformulare

Kopfbereich des Formulars

• Im Kopf des Formulars das Logo mit Skip-Link
• Der Formularname, vorzugsweise das H1-Tag, wenn es sich um eine eigenständige HTML-Seite handelt, andernfalls ein H2-Tag, wenn es in eine HTML-Seite eingebettet ist.
• eine kurze Anleitung von maximal 5 Zeilen.
• ein Abschnitt Name und Adresse oder Benutzerdaten, also wer die Person ist, die das Formular ausfüllt
• Die Kopfzeile enthält außerdem die auszufüllenden Komponenten, je nachdem, von wem das Formular stammt.
• eine Navigation (Lesezeichen), die die Arbeitsschritte möglichst horizontal darstellt.
• Abschnittsüberschrift ist immer der H2-Tag mit Attribut und Lesezeichen, um eine Navigation im Formular zu erstellen. Dies ist für ein mehrstufiges Formular nützlich.

Hauptteil oder Formularabschnitt

<h2>Abschnittsüberschrift</h2>
<h3>Abschnitte innerhalb eines Formulars</h3> /*oder Bezeichnung für eine Formularkomponente*/

Bitte beachten: H3 innerhalb des Abschnitts h2.
In diesem Abschnitt finden Sie das eigentliche Formular mit den Fragen.
Hierzu zählen auch Zwischenabschnitte mit dem H4-Tag, die in der Regel bedingte Inhalte enthalten.

Fußteil

Die Fußzeile dient ausdrücklich der Angabe von Initialen, Unterschrift und/oder Hinweisen zum Versand.

Neue Auswahl für WordPress-Vorlagen im Jahr 2025

Im Jahr 2025 werde ich völlig verliebt in die Greyd Suite mit 100 % zugänglichen und intelligenten Webformularen sein. Machen Sie die Probe aufs Exempel und füllen Sie das Kontaktformular aus.

Basicdesign PDF-Formulare

1. Grundlegendes Design, Kopf-, Haupt- und Fußzeile mit Navigation
2. Objektstile für Formularfelder
3. Artikel hinzufügen und Etiketten exportieren
4. Schichtbasiertes Design
5. Dies ist die Grundlage für den Export nach Adobe Acrobat Pro

Grundlegende Funktionen für Web- und PDF-Formulare

Digitale Formulare und PDFs sollten für alle zugänglich gemacht werden, auch für Menschen mit Behinderungen. Dadurch wird sichergestellt, dass jeder die Online-Ressourcen problemlos nutzen kann. Menschen mit Seh-, Hör- oder kognitiven Beeinträchtigungen können von barrierefreien Formularen profitieren. Barrierefreie digitale Formulare sollten leicht verständlich und einfach auszufüllen sein und mit verschiedenen Eingabemethoden und Tools funktionieren. Beim Entwerfen von PDF-Dokumenten sollte auf Barrierefreiheit geachtet werden.

Merkmale

1. Intelligente Eingabe, also nur das anzeigen, was für die jeweilige Funktion relevant ist.
2. Fügen Sie zusätzliche Zeilen hinzu oder löschen Sie sie.
3. Minimieren Sie Leerraum, um Papier zu sparen.
4. Schaltflächen zum Speichern, Drucken und Senden sowie optionaler Datenexport.
5. Nur ausgefüllte Felder drucken.
6. Digitales Signieren und Versenden per E-Mail
7. Normalerweise in so wenigen Schritten wie möglich abzuschließen, vorzugsweise 3
8. Erklärungen nur, wo wirklich nötig.

Der Aufbau eines Formulars ist anwendungsunabhängig und erfolgt nach den Formularstandards WCAG 2.1, ISO 14289-1 und PDF-UA. Darüber hinaus verfügt jede Form über einen semantischen Stil. Sehen Sie sich hier den Quellcode eines semantischen Formulars an.

PDF-Formulare können immer mit der neuesten Adobe Reader DC-Version verwendet werden.

Beispiele für einige intelligente und aktuelle Formulare

Die folgenden relevanten Beispiele untermauern meine langjährige Erfahrung im Erstellen intelligenter Formulare und der Darstellung intelligenter Websites. Es sind nicht nur diese großen Fälle, sondern ich habe auch – siehe mein intelligentes Lebenslauf-Portfolio – verschiedene Websites für kleine Unternehmen, wie z. B. Starter und verschiedene interaktive PDF- oder HTML5-Webformulare für kleine und große Unternehmen.

Arbeiten Sie noch mit Word-Formularen?

Haben Sie ein Word-Dokument mit Formularfeldern? Dann machen Sie sich keine weiteren Sorgen. Hören Sie auf und überlassen Sie mir die Arbeit in InDesign. Aus eigener Erfahrung und der Erfahrung anderer weiß ich, wie schwer es ist, mit Word ein komplexes Formular zu erstellen. Also tu das nicht.

Meine Vision ist und bleibt

Ein intelligentes, barrierefreies Formular erfordert keine Erklärung und ist plattformunabhängig.

Sehen Sie sich hier meine Portfolio-Formulare an: (Aus Vertraulichkeitsgründen darf ich echte Beispiele nur persönlich weitergeben).