Style Guide

Typografie – Headlines

H1 – XL

Page Title / Identity Heading

.fs-h1

font: -font-heading

weight:

Dies ist eine H1 Überschrift

Sie steht für das zentrale Thema, die Hauptaussage und den inhaltlichen Fokus einer Seite. Es darf pro Seite nur eine H1 geben.

Rolle:
Seitenidentität, thematischer Fokus, inhaltlicher Einstieg

H2 – L

Section Heading

.fs-h2

font: -font-heading

weight:

Dies ist eine H2 Überschrift

H2 strukturiert die Seite in Hauptabschnitte.
Sie gliedert Inhalte in logisch zusammenhängende Themenbereiche und bildet die primäre Inhaltsstruktur unterhalb der H1.

Rolle:
Inhaltsstruktur, Themenblöcke, Seitenabschnitte

H3 – M

Subsection Heading

.fs-h3

font: -font-heading

weight:

Dies ist eine H3 Überschrift

H3 untergliedert H2-Abschnitte in inhaltliche Teilbereiche.
Sie schafft Hierarchie innerhalb eines Themenblocks und strukturiert komplexere Inhalte.

Rolle:
Unterthemen, Modulstruktur, Feature-Gruppierung

H4 – S

Content Heading

.fs-h4

font: -font-heading

weight:

Dies ist eine H4 Überschrift

H4 kennzeichnet einzelne inhaltliche Einheiten.
Sie dient weniger der Seitenstruktur, sondern der Gliederung von Content-Modulen.

Rolle:
Karten-Titel, Box-Überschriften, Module, Inhaltsblöcke

H5 – XS

Meta Heading

.fs-h5

font: -font-heading

weight:

Dies ist eine H5 Überschrift

H5 ist eine strukturelle, semantische Überschrift mit geringer visueller Dominanz.
Sie dient primär der logischen Ordnung, nicht der visuellen Führung.

Rolle:
Meta-Informationen, Sidebar-Titel, Listenheader, UI-Gruppierung

H6 – XXS

Micro Heading / Label Level

.fs-h6

font: -font-heading

weight:

Dies ist eine H6 Überschrift

H6 ist die feinste Hierarchieebene.
Sie fungiert eher als strukturelles Label denn als klassische Überschrift.

Rolle:
UI-Labels, Formulargruppen, Mikrostruktur, interne Gliederung

Typografie – Body text

Body Text / Fließtext

Primärer Lesetext für Artikel, Inhalte, Seiten, Formulare.

.fs-body

font: –font-body

Line-height: –lh-body
Max-width: var(–gb-container-width)
Spacing: margin-bottom

Der Amsterdamer Kröpfer Club von 1926 steht seit einem Jahrhundert für die Pflege, Zucht und Förderung der Rassetaube „Amsterdamer Kröpfer“.
Generationen von Züchtern haben Wissen, Erfahrung und Leidenschaft weitergegeben.

Im Mittelpunkt unseres Vereinslebens steht die Gemeinschaft. Diese leben wir durch persönlichen Austausch, gemeinsame Ausstellungen und die Förderung des züchterischen Nachwuchses.

Ziel ist es, Tradition und Moderne zu verbinden und die Zuchtkultur verantwortungsvoll in die Zukunft zu führen.

Typografie – Inlines

Typografie – Inline Text

Inline-Elemente im Fließtext: Betonung, Links, Hervorhebungen, Meta-Information.

.a .strong .em .small .code .mark

font: –font-body

Line-height: –lh-body
Max-width: var(–gb-container-width)
Spacing: margin-bottom

Der Amsterdamer Kröpfer Club von 1926 steht seit einem Jahrhundert für die Pflege, Zucht und Förderung der Rassetaube „Amsterdamer Kröpfer“.
Generationen von Züchtern haben Wissen, Erfahrung und Leidenschaft weitergegeben.

Weitere Informationen findest du auf unserer Website oder im Bereich Downloads & Dokumente. Technische Details werden intern als Rassestandard v1.2 dokumentiert. Besonders wichtig ist die nachhaltige Zuchtentwicklung.