Referenzthemen reference-themes

Designs ermöglichen Ihnen, Ihre Formulare ohne fundierte Kenntnisse im Umgang mit CSS zu formatieren. Zusätzlich zum Standardthema können Sie die folgenden Themen erhalten, indem Sie das AEM Forms Add-On-Pakete installieren:

  • Beryl
  • Exec
  • Exec-Light
  • Liberty
  • Ultramarine
  • Urbane
  • U.S. Web Design Standards
  • Tranquil

Jedes Design enthält einen einzigartigen und eleganten Stil, den Sie verwenden können, um ansprechende adaptive Formulare für Ihre Benutzerinnen und Benutzer zu erstellen. Es enthält einen eindeutigen Stil für Selektoren wie Bedienfeld, Textfeld, numerisches Feld, Optionsfeld, Tabelle und Umschalter. Die Stile in diesen Designs basieren auf Anforderungen. Beispielsweise benötigen Sie in einem bestimmten Szenario ein minimalistisches Design mit sauberen Schriftarten. Mit dem Freiheits-Design können Sie diesen Look erzielen.

Referenzthemen

Die Designs, die in diesem Paket enthalten sind, sind responsive und die Formatierung in diesen Themen ist definiert für Mobil- und Desktopanzeigen. Die meisten modernen Browser auf einer Vielzahl von Geräten können Formulare rendern, die mit einem dieser Designs mühelos angewendet werden.

Weitere Informationen zur Installation eines Pakets finden Sie unter Arbeiten mit Paketen.

Beryl beryl

Das Beryl-Design wird vom adaptiven We.Gov-Formular verwendet, und hebt die Verwendung von Hintergrundbildern, Transparenz und großen und flachen Symbolen hervor. Im Screenshot unten können Sie sehen, wie das Beryl-Design angezeigt wird und wie es das Formatieren des Formulars verbessern kann.

Beryl-Design

Exec exec

Das Exec-Design vermeidet einfarbige Hintergrundfüllungen, um die Formularkomponenten hervorzuheben.  Das Auswählen von und Klicken auf Komponenten ändert die Schriftfarben.  Im Vergleich zum standardmäßigen Arbeitsflächen-Design ändert sich die Schriftfarbe des Textes auf der ausgewählten Registerkarte zu Dunkelblau. Beachten Sie, wie sich die Navigations- und Senden-Schaltflächen vom Beryl-Design unterscheiden.

Exec-Design

Exec Light exec-light

Das Exec Light-Design verwendet Leerräume, um ein nahtloses Erlebnis zu erstellen.  Die Schaltflächen „Weiter“ und „Senden“ erhalten eine durchgehende Füllung und einen 3D-Schatten.  Ausgewählte Registerkarten links erhalten einen Pfeil statt Doppelhäkchen.

Exec light-Design

Liberty liberty

Das Liberty-Design verwendet eine minimalistische Herangehensweise, um das Wichtige hervorzuheben.  Beispielsweise ändert sich die Schriftfarbe der besuchten Registerkarte zu Grün.  Sie können nur die untere Kontur des Textfelds sehen, was den Look eines papierbasierten Formulars mit Linien simuliert.  Die untere Kontur des aktiven Textfelds ist schwarze, während die untere Kontur anderer Felder hellgrau ist.

Liberty-Design

Tranquil tranquil

Das Tranquil-Design bietet helle und dunkle Schattierungen des Tranquil-Farbschemas, um verschiedene Komponenten eines Formulars hervorzuheben. Beispielsweise erhalten Optionsfelder, Bereiche und Registerkarten jeweils einen anderen Grünton.

Tranquil-Design

Ultramarine ultramarine

Das Ultramarine-Design verwendet dunkelblaue Töne, um Komponenten wie Registerkarten, Bereiche, Textfelder und Schaltflächen hervorzuheben.

Ultramarine-Design

Urbane urbane

Das Urban-Design betont einen minimalistischen und funktionalen Look für Ihr Formular. Wenn Sie das Urbane-Designs auf Ihr Formular anwenden, können Sie sehen, dass Komponenten reduziert sind. Die Bedienfelder erhalten dünne Konturen, um einen modernen Look zu erzielen.

Urbane-Design

U.S. Web Design Standards u-s-web-design-standards

Das U.S. Webdesign Standard-Design, verwendet, wie der Name sagt, Schriftbilder und Stile, die auf der Seite „Draft U.S. Webdesign Standards“ beschrieben sind. Der Webstandard wird von verschiedenen Bundesorganisationen verwendet, um konsistente Web-Erlebnisse für Bundesregierungswebsites zu erstellen.

U.S. Web Design Standards-Design

recommendation-more-help
19ffd973-7af2-44d0-84b5-d547b0dffee2