Eine Spalte.
Musterbogen
Was diese Seite ist
Sie zeigt jeden Baustein der Gestaltung — und jeden Zustand, den ein Baustein annehmen kann, auch die leeren.
Die Seite ist zugleich Prüfstand: Die Kontrastwerte neben den Farbfeldern werden beim Aufbau der Seite aus denselben Werten berechnet, gegen die auch die Prüfskripte laufen. Es gibt nur eine Liste, also können die beiden nicht auseinanderlaufen. Kein Wert auf dieser Seite ist abgetippt.
Ebenso dauerhaft sind die Textproben weiter unten. Sie stehen hier nicht als einmalige Stichprobe, sondern damit ein späterer Eingriff in Raster oder Typografie an derselben Stelle wieder auffällt.
Erster Teil
Farbe
Zwei Goldtöne, niemals einer. Jedes Feld unten steht auf der Fläche, für die sein Ton bestimmt ist, und trägt seinen berechneten Kontrastwert daneben.
Freigegebene Paarungen auf dunkler Fläche
- Fermentiertes Feuer
- Fermentiertes Feuer
- Fermentiertes Feuer
- Fermentiertes Feuer
- Fermentiertes Feuer
- Fermentiertes Feuer
- Fermentiertes Feuer
- Fermentiertes Feuer
- Fermentiertes Feuer
Freigegebene Paarungen auf heller Fläche
- Fermentiertes Feuer
- Fermentiertes Feuer
- Fermentiertes Feuer
- Fermentiertes Feuer
- Fermentiertes Feuer
- Fermentiertes Feuer
- Fermentiertes Feuer
- Fermentiertes Feuer
Nicht-Text: der Fokusring
- Fokus
- Fokus
Dekorative Linien
Die Haarlinie ist Gold mit reduzierter Deckkraft. Sie trägt keine Bedeutung, also gilt für sie kein Mindestwert — ihr Wert steht hier, damit niemand ihn später für eine Freigabe hält. Alles Bedienbare nimmt den vollen Ton.
Gesperrte Paarungen
Diese Kombinationen stehen hier nur als Text. Sie werden bewusst nicht als Schriftprobe gezeigt — eine gesperrte Paarung vorzuführen heißt, sie einmal zu setzen, und genau davor schützt die Liste.
- --gold-on-dark auf --surface-cream 1,88 : 1 Der benannte Fehlerfall dieses Projekts — ein Goldton für beide Flächen
- --gold-ink auf --surface-base 3,22 : 1 Verfehlt AA für Text und wirkt stumpf
- --ink-on-dark auf --surface-cream 1,15 : 1 Unlesbar
- --ink-on-light auf --surface-base 1,10 : 1 Unlesbar
- --ember-on-dark auf --surface-cream 3,30 : 1 Verfehlt AA für Text
- --ember-on-light auf --surface-base 2,97 : 1 Verfehlt AA für Text
- #FFFFFF auf --surface-base 19,76 : 1 RULE T2 — besteht den Kontrast, verfehlt die Marke: maximale Überstrahlung, wirkt hart und billig
Außerhalb jeder Fläche: Magenta
Die acht kontextabhängigen Merkmale sind außerhalb einer Fläche absichtlich auf einen Wert gesetzt, der niemals Gestaltung sein kann. Ein Baustein, der seine Fläche verliert, wird dadurch beim ersten Aufbau sichtbar falsch statt still falsch. Die Vorführung dazu steht am Ende dieser Seite , außerhalb aller Bänder — denn nur dort kann sie überhaupt greifen.
Zweiter Teil
Typografie
Vier Größen, zwei Schnitte, zwei Schriften — und neun Rollen, die daraus entstehen. Alles darüber hinaus kommt aus Schriftfamilie, Schnitt, Laufweite und Raum.
Die neun Rollen
Titelzeile (H1) · --step-3 · Archivo 700 · Zeilenhöhe 1,05 · Laufweite −0,015em
Zeit, Salz und Geduld
Bandüberschrift (H2) · --step-2 · Archivo 700 · Zeilenhöhe 1,15 · Laufweite −0,01em
Vom Ansatz bis zur Reife
Kartentitel (H2 in Listen) · --step-2 · Archivo 700 · Zeilenhöhe 1,15 · Laufweite −0,01em — dieselbe Zeile der Rollentabelle wie die Bandüberschrift, deshalb braucht eine Karte keine eigene Größe
Im Holzfass gereift
Zwischenüberschrift (H3) · --step-0 · Source Sans 3 600 · Zeilenhöhe 1,20 · Laufweite +0,02em
Ansatz und Ruhephase
Vorzeile · --step-0 · Source Sans 3 kursiv 400 · Zeilenhöhe 1,50 · Laufweite 0
Die Vorzeile trägt einen echten kursiven Schnitt, eine engere Zeilenhöhe und ein schmaleres Maß — und dafür keine eigene Größe.
Fließtext · --step-0 · Source Sans 3 400 · Zeilenhöhe 1,60 · Laufweite 0
Der Fließtext läuft auf 1,60 statt 1,50. Deutsche Wörter sind im Mittel länger und Umlaute stoßen an die Oberlängen der Zeile darüber; 1,50 ist der Boden, nicht der richtige Wert.
Bedienbeschriftung · --step-0 · Source Sans 3 600 · Zeilenhöhe 1,20 · Laufweite +0,02em
Kleintext · --step--1 · Source Sans 3 400 · Zeilenhöhe 1,45 · Laufweite 0
Die kleinste Stufe der Skala. Sie endet bei 13 px und ist die einzige Stufe, die das Prüfwort weiter unten ungebrochen in ein 288 px breites Feld setzt.
Augenbraue · --step--1 · Source Sans 3 600 · Zeilenhöhe 1,30 · Laufweite +0,14em · Versalien
Gestaltungsraster
ß und ẞ nebeneinander
Die erste Zeile ist die Prüfzeile aus dem Gestaltungsvertrag. Die zweite setzt dasselbe Wort mit dem Großbuchstaben ẞ, denn die korrekte Versalform von ß ist SS — die erste Zeile enthält das Zeichen also gar nicht. Nur eine gezeichnete Glyphe beweist, dass es kein leeres Kästchen ist.
Archivo
Großhandelspreisliste / GROSSHANDELSPREISLISTE
Großhandelspreisliste / GROẞHANDELSPREISLISTE
Source Sans 3
Großhandelspreisliste / GROSSHANDELSPREISLISTE
Großhandelspreisliste / GROẞHANDELSPREISLISTE
Die dauerhaften Prüfzeichenfolgen
Die sechs deutschen Zusammensetzungen stehen für den wirklichen Fall. Die siebte Zeichenfolge ist kein Wort, sondern ein technischer Prüfwert ohne Trennstelle: ohne sie kann die Prüfung gar nicht scheitern, weil die automatische Silbentrennung jede der sechs Zusammensetzungen rettet. Beide zusammen sind der Prüfstand.
- Fermentationsgeschwindigkeitsmessung 36 Zeichen Der Grundfall — 36 Zeichen, ein Wort
- Milchsäurebakterienkulturvermehrung 35 Zeichen Umlaut im Kompositum
- Weißweinessigfassreifung 24 Zeichen ß in der Wortmitte
- STRASSENVERKAUFSGENEHMIGUNG 27 Zeichen Versalien — hier stünde ẞ, wenn aus ß versalisiert würde
- Großhandelspreisliste / GROSSHANDELSPREISLISTE 46 Zeichen ß und SS nebeneinander (siehe die ẞ-Zeile darunter)
- Über uns · Wo kaufen · Häufige Fragen 37 Zeichen Oberlängen und Diakritika bei enger Zeilenhöhe
- 012345678901234567890123456789012345678901234567890123456789 60 Zeichen Ohne Trennstelle — der einzige Wert, der RULE G1 scheitern lässt, wenn G1 fehlt
Darunter läuft jede dieser Zeichenfolgen durch jede Textrolle. Das ist die Probe, die 02-08 an sechs Breiten gegen die echte Seite fährt.
Titelzeile
Fermentationsgeschwindigkeitsmessung
Milchsäurebakterienkulturvermehrung
Weißweinessigfassreifung
STRASSENVERKAUFSGENEHMIGUNG
Großhandelspreisliste / GROSSHANDELSPREISLISTE
Über uns · Wo kaufen · Häufige Fragen
012345678901234567890123456789012345678901234567890123456789
Bandüberschrift
Fermentationsgeschwindigkeitsmessung
Milchsäurebakterienkulturvermehrung
Weißweinessigfassreifung
STRASSENVERKAUFSGENEHMIGUNG
Großhandelspreisliste / GROSSHANDELSPREISLISTE
Über uns · Wo kaufen · Häufige Fragen
012345678901234567890123456789012345678901234567890123456789
Zwischenüberschrift
Fermentationsgeschwindigkeitsmessung
Milchsäurebakterienkulturvermehrung
Weißweinessigfassreifung
STRASSENVERKAUFSGENEHMIGUNG
Großhandelspreisliste / GROSSHANDELSPREISLISTE
Über uns · Wo kaufen · Häufige Fragen
012345678901234567890123456789012345678901234567890123456789
Vorzeile
Fermentationsgeschwindigkeitsmessung
Milchsäurebakterienkulturvermehrung
Weißweinessigfassreifung
STRASSENVERKAUFSGENEHMIGUNG
Großhandelspreisliste / GROSSHANDELSPREISLISTE
Über uns · Wo kaufen · Häufige Fragen
012345678901234567890123456789012345678901234567890123456789
Fließtext
Fermentationsgeschwindigkeitsmessung
Milchsäurebakterienkulturvermehrung
Weißweinessigfassreifung
STRASSENVERKAUFSGENEHMIGUNG
Großhandelspreisliste / GROSSHANDELSPREISLISTE
Über uns · Wo kaufen · Häufige Fragen
012345678901234567890123456789012345678901234567890123456789
Kleintext
Fermentationsgeschwindigkeitsmessung
Milchsäurebakterienkulturvermehrung
Weißweinessigfassreifung
STRASSENVERKAUFSGENEHMIGUNG
Großhandelspreisliste / GROSSHANDELSPREISLISTE
Über uns · Wo kaufen · Häufige Fragen
012345678901234567890123456789012345678901234567890123456789
Augenbraue
Fermentationsgeschwindigkeitsmessung
Milchsäurebakterienkulturvermehrung
Weißweinessigfassreifung
STRASSENVERKAUFSGENEHMIGUNG
Großhandelspreisliste / GROSSHANDELSPREISLISTE
Über uns · Wo kaufen · Häufige Fragen
012345678901234567890123456789012345678901234567890123456789
Dritter Teil
Raum, Bewegung, Formate
Jeder Abstand auf dieser Seite ist eines der elf Merkmale unten. Ein eigener Pixelwert in einem Bauteil ist ein Fehler, keine Feinabstimmung.
Abstandsskala
- --space-2xs 4px Abstand Symbol zu Beschriftung
- --space-xs 8px Abstände in einer Zeile
- --space-sm 12px Enge Stapelrhythmen, Innenabstand von Eingaben
- --space-md 16px Standardabstand, Seitenrand am Telefon
- --space-lg 24px Kartenpolster, Absatzrhythmus
- --space-xl 32px Bauteilabstand, Kartenpolster am Schreibtisch
- --space-2xl 48px Unterbrechung zwischen Teilabschnitten
- --space-3xl 64px Zeilenabstand im Raster, kleine Bandpolsterung
- --space-4xl 96px Bandpolsterung am Tablet
- --space-5xl 128px Bandpolsterung am Schreibtisch
- --space-6xl 160px Titelbereich und große Brüche
Abgeleitete Maße
- --gutter clamp(1rem, 4vw, 3rem) 16 px bei 320, 48 px ab 1200
- --container-max 72.5rem 1160 px — die Breite des Inhaltsbands
- --space-section clamp(4.5rem, 2.5rem + 10vw, 10rem) 72 px bei 320, 160 px ab 1200
- --measure-prose 62ch Zeilenlänge für Fließtext
- --measure-lede 46ch Zeilenlänge für die Vorzeile
- --tap-min 44px Kleinste Berührfläche (WCAG 2.5.5)
Bewegung
Erlaubt sind Farbe, Rahmen, Deckkraft, eine Verschiebung und das Aufziehen einer
Linie. Die Verschiebung hat zwei Maße, und der Unterschied ist keine Abweichung:
Hover- und Fokuszustände bewegen sich um höchstens vier Pixel, der Bandeintritt um
den Wert von --space-md — den Regelabstand
dieser Seite und keine eigens für die Bewegung erfundene Zahl. Nichts dauert
länger als 300 ms, nichts federt, keine Layout-Eigenschaft wird animiert, und
nichts davon braucht ein Skript.
- --motion-fast 120ms Farbe, Rahmen, Deckkraft
- --motion-base 240ms Alles Übrige
- --motion-ease cubic-bezier(0.22, 0.61, 0.36, 1) Die einzige Beschleunigungskurve
Genau ein Bewegungsregister: Bänder treten beim Erreichen ein — Deckkraft und eine Verschiebung um 16 Pixel, 240 ms, eine einzige Beschleunigungskurve. Keine Layout-Eigenschaft wird animiert.
Aktiv — Ihr Browser unterstützt scrollgesteuerte Animation und Ihr System verlangt keine reduzierte Bewegung. Die Bänder unten treten beim Erreichen ein.
Reduziert — Ihr System verlangt weniger Bewegung. Die Bewegungsschicht ist vollständig abgeschaltet; der Inhalt steht sofort.
Ohne Unterstützung — Ihr Browser kennt animation-timeline: view() nicht. Die Schicht wird gar nicht erst angewandt; der Inhalt steht sofort.
- Eintritt
Deckkraft null, um
--space-mdnach unten versetzt. Nur innerhalb beider Bedingungen überhaupt erreichbar. - Ruhe Volle Deckkraft, keine Versetzung. Der Zustand, in dem jedes Band gelesen wird — und der einzige, den ein Band ohne die Schicht je hat.
- Ankunft
Dieselbe Bildfolge
bandeintrittüber--motion-basemit--motion-ease. Hier zeitgesteuert gezeigt, im Band scrollgesteuert.
Fällt die Bewegung aus, bleibt der Inhalt sichtbar. Nie umgekehrt.
Bildformate
Ein geschlossener Satz. Ein weiteres Format kommt nicht dazu, ohne dass der Gestaltungsvertrag geändert wird — der Bildzuschnitt in Phase 4 und der Fotografie-Auftrag in Phase 7 lesen genau diese Liste.
- --ratio-bottle 3 / 4 Flaschen
- --ratio-portrait 4 / 5 Porträt
- --ratio-wide 16 / 9 Titelbild und Bandbilder
- --ratio-square 1 / 1 Rasterkacheln
Vierter Teil
Bausteine: Struktur
Fünf Bauteile, die nichts aussagen und alles tragen: Band, Maß, Raster, Stapel, Linie.
1 · Section — das Band
Ein Band setzt die Fläche und die Polsterung. Die beiden Bänder darunter sind echte Bänder mit echter Polsterung, ineinandergestellt. Der Zustand »erstes Band der Seite« — Polsterung oben auf null — ist der Kopf dieser Seite selbst.
Dunkel, mit Überschrift
Ein dunkles Band
Die Fläche färbt sich selbst und gibt allen Bausteinen darin ihren Ton.
Hell, ohne Überschrift
Dasselbe Band, dieselbe Polsterung, andere Fläche — und kein Titel.
2 · Container — das Maß
Standard: 1160 px am Schreibtisch, 288 px Inhalt bei 320 — die Zahl, gegen die jedes Zeichenbudget gerechnet ist. Die Linien zeigen die beiden Breiten.
Schmal: 62 Zeichen Fließtext plus Seitenrand
3 · Grid — das Raster
Einspaltig, bei jeder Breite
Zweispaltig ab 768
Erste Spalte.
Zweite Spalte.
Dreispaltig ab 1024
Erste Spalte.
Zweite Spalte.
Dritte Spalte.
Der Beweis für RULE G1: dasselbe dreispaltige Raster, in jeder Zelle die längste Zusammensetzung und der Prüfwert ohne Trennstelle. Ohne die Sperre auf der Zelle zöge der Prüfwert die ganze Seite breiter als das Fenster.
Fermentationsgeschwindigkeitsmessung
012345678901234567890123456789012345678901234567890123456789
Milchsäurebakterienkulturvermehrung
012345678901234567890123456789012345678901234567890123456789
Weißweinessigfassreifung
012345678901234567890123456789012345678901234567890123456789
Dasselbe Raster mit blanken Zellen — ohne Karte, ohne Stapel. Nur diese Reihe prüft die Sperre des Rasters selbst: fehlt sie, zieht der Prüfwert die Seite breiter als das Fenster.
012345678901234567890123456789012345678901234567890123456789
012345678901234567890123456789012345678901234567890123456789
012345678901234567890123456789012345678901234567890123456789
4 · Stack — der Stapel
gap="xs" — enge Zeile
gap="lg" — Absatzrhythmus
gap="3xl" — Rasterzeile
12 · Rule — die Haarlinie
Dunkel — kurz (48 px) und über die volle Breite
Hell — kurz (48 px) und über die volle Breite
Fünfter Teil
Bausteine: Text
Jede Rolle in jedem Zustand, den der Vertrag verlangt — auch in den Zuständen, die über ihr Zeichenbudget hinausgehen.
5 · Eyebrow — die Augenbraue
Dunkel · Regelfall
Aus der Werkstatt
Am Budget: 28 Zeichen (28 gezählt)
Ruhe und Zeit im Fass Geduld
Über Budget: 44 Zeichen — bricht sichtbar auf eine zweite Zeile, statt still gekürzt zu werden
Ruhe und Zeit im Fass Salz Geduld Schicht um
Hell · Regelfall
Aus der Werkstatt
Am Budget: 28 Zeichen (28 gezählt)
Ruhe und Zeit im Fass Geduld
Über Budget: 44 Zeichen
Ruhe und Zeit im Fass Salz Geduld Schicht um
6 · DisplayHeading — die Titelzeile
Eine Zeile
Zeit und Salz
Am Budget: 48 Zeichen (48 gezählt), drei Zeilen bei 320
Ruhe und Zeit im Fass Salz Geduld Schicht um und
Prüfwort
Fermentationsgeschwindigkeitsmessung
text-wrap: balance — ein (der Regelfall)
Ruhe und Zeit sind die beiden Zutaten, die man nicht kaufen kann
text-wrap: balance — aus. Derselbe Text; der Unterschied liegt in der Länge der letzten Zeile.
Ruhe und Zeit sind die beiden Zutaten, die man nicht kaufen kann
Dunkel
Zeit und Salz
Hell
Zeit und Salz
7 · SectionHeading — die Bandüberschrift
Ohne Linie
Vom Ansatz bis zur Reife
Am Budget: 56 Zeichen (56 gezählt)
Ruhe und Zeit im Fass Salz Geduld Schicht um Schicht und
Prüfwort
Fermentationsgeschwindigkeitsmessung
Verbindlich: die Linie steht VOR der Überschrift und eröffnet sie. Siehe die Begründung in 02-07-SUMMARY.md.
Vom Ansatz bis zur Reife
Die Vorzeile folgt der Überschrift ohne Unterbrechung.
Verworfen: dieselbe Linie unter der Überschrift. Sie trennt die Überschrift von dem Text, den sie einleitet, und liest sich als Abschluss statt als Auftakt.
Vom Ansatz bis zur Reife
Die Vorzeile steht nun hinter einer Linie, die nicht zu ihr gehört.
8 · SubHeading — die Zwischenüberschrift
Regelfall
Ansatz und Ruhephase
Am Budget: 40 Zeichen (40 gezählt)
Ruhe und Zeit im Fass Salz Geduld Geduld
Prüfwort
Fermentationsgeschwindigkeitsmessung
Direkt unter einer Bandüberschrift — der Beweis, dass eine ganze Stufe kleiner trotzdem untergeordnet und nicht verloren wirkt
Vom Ansatz bis zur Reife
Ansatz und Ruhephase
Direkt unter Fließtext — der Beweis, dass sie sich bei gleicher Größe vom Absatz darüber löst
Der Absatz darüber läuft in derselben Größe und derselben Schrift. Was die Zwischenüberschrift trennt, ist der Schnitt, die Laufweite und der Raum über ihr.
Ansatz und Ruhephase
Und der Text darunter setzt in derselben Größe wieder ein.
9 · Lede — die Vorzeile
Regelfall
Eine einzige Zeile, niemals zwei.
Am Budget: 160 Zeichen (160 gezählt)
Ruhe und Zeit im Fass Salz Geduld Schicht um Schicht ohne Eile mit ruhiger Hand in kleinen Mengen Tag für Tag langsam und stetig Handgriff für Handgriff Reifung
Über Budget: 220 Zeichen — sie läuft weiter, sie bricht nicht
Ruhe und Zeit im Fass Salz Geduld Schicht um Schicht ohne Eile mit ruhiger Hand in kleinen Mengen Tag für Tag langsam und stetig Handgriff für Handgriff Aromen Reifung Handwerk Fasslager Handarbeit Fermentation Fasslager
Direkt über Fließtext — der Beweis, dass echte Kursive, engere Zeilenhöhe und schmaleres Maß ohne eigene Größe genügen
Eine Vorzeile trägt den Ton, nicht die Größe.
Und der Fließtext darunter läuft in derselben Größe, aber aufrecht, weiter und auf 62 Zeichen Maß.
10 · Prose — der Fließtext
Der Zustand darunter ist der, den 02-05 ausdrücklich hierher verschoben hat: starke Betonung auf dunkler Fläche. RULE T1 verbietet Betonung über den Schnitt im Fließtext auf dunkler Fläche, und das dort vorgeschlagene Mittel — der Goldton — steht nicht auf der geschlossenen Liste der sieben erlaubten Goldstellen. Die getroffene Entscheidung und ihre Begründung stehen in 02-07-SUMMARY.md; hier steht der Fall, an dem sie zu sehen ist.
Dunkel
Ein Absatz mit echter Kursive, mit starker Betonung und mit einem Verweis im Satz . Die Kursive ist ein wirklich mitgelieferter Schnitt, keine geneigte Aufrechte.
Ein zweiter Absatz, damit der Absatzrhythmus sichtbar wird.
- Ein Listenpunkt.
- Ein zweiter, etwas längerer Listenpunkt mit ruhigem Umbruch.
- Milchsäurebakterienkulturvermehrung
Hell
Ein Absatz mit echter Kursive, mit starker Betonung und mit einem Verweis im Satz . Die Kursive ist ein wirklich mitgelieferter Schnitt, keine geneigte Aufrechte.
Ein zweiter Absatz, damit der Absatzrhythmus sichtbar wird.
- Ein Listenpunkt.
- Ein zweiter, etwas längerer Listenpunkt mit ruhigem Umbruch.
- Milchsäurebakterienkulturvermehrung
11 · FinePrint — der Kleintext
Dunkel · voller Ton und gedämpft
Kleintext im vollen Ton, wie ihn ein Rechtstext braucht.
Kleintext gedämpft, wie ihn eine Fußzeile braucht.
Hell · voller Ton und gedämpft
Kleintext im vollen Ton, wie ihn ein Rechtstext braucht.
Kleintext gedämpft, wie ihn eine Fußzeile braucht.
Sechster Teil
Bausteine: Marke und Verweise
Die Zeichen sind handgezeichnet, tragen keine eigene Farbe und erben sie von ihrer Fläche.
13 · BrandMark — das Zeichen
Dunkel · 24 px, 96 px, Wasserzeichen bei 8 %
Hell · 24 px, 96 px, Wasserzeichen bei 8 %
14 · Icon — die Symbole
Dunkel · alle Symbole, 24er Raster
Hell · alle Symbole, 24er Raster
Zwei Formen: stumm (der Regelfall — das Symbol wiederholt nur, was daneben steht) und benannt (das Symbol trägt die Aussage allein und bekommt einen deutschen Namen).
16 · TextLink — der Verweis
Der besuchte Zustand ist nachgestellt und nicht echt: ein Browser lässt für besuchte Verweise nur die Farbe zu und gibt über sie bewusst falsche Auskunft. Gezeigt wird genau der gedämpfte Ton, den die echte Regel setzt.
17 · SkipLink — der Einstieg
Der echte Sprungverweis ist das erste Element dieser Seite. Er ist unsichtbar, aber im Tab-Lauf: die erste Tabulatortaste holt ihn hervor. Darunter steht derselbe Baustein mit erzwungenem Fokus, damit der Zustand auch auf einem Bildschirmfoto zu sehen ist.
Erzwungener Fokuszustand
Siebter Teil
Bausteine: Bedienung
Drei Ausprägungen, fünf Zustände, zwei Flächen — und genau eine gefüllte Goldfläche auf der ganzen Website.
15 · Button — die Schaltfläche
Dunkle Fläche
Primär
- Ruhe
- Zeigerkontakt
- Tastaturfokus
- Gedrückt
- Gesperrt
Sekundär
- Ruhe
- Zeigerkontakt
- Tastaturfokus
- Gedrückt
- Gesperrt
Leise
- Ruhe
- Zeigerkontakt
- Tastaturfokus
- Gedrückt
- Gesperrt
Helle Fläche
Primär
- Ruhe
- Zeigerkontakt
- Tastaturfokus
- Gedrückt
- Gesperrt
Sekundär
- Ruhe
- Zeigerkontakt
- Tastaturfokus
- Gedrückt
- Gesperrt
Leise
- Ruhe
- Zeigerkontakt
- Tastaturfokus
- Gedrückt
- Gesperrt
Achter Teil
Bausteine: Inhalt
Karte, Bildrahmen, Wertepaare und Schärfegrad — und in jedem Fall auch der Zustand, in dem nichts eingetragen ist.
18 · Card — die Karte
Am Budget: Titel 32 Zeichen (32 gezählt), Text 130 Zeichen (130 gezählt) — gemessen im 240 px breiten Karteninneren
Ruhe und Zeit im Fass Salz Feuer
Ruhe und Zeit im Fass Salz Geduld Schicht um Schicht ohne Eile mit ruhiger Hand in kleinen Mengen Tag für Tag langsam und Handwerk
Ruhe und Zeit im Fass Salz Feuer
Ruhe und Zeit im Fass Salz Geduld Schicht um Schicht ohne Eile mit ruhiger Hand in kleinen Mengen Tag für Tag langsam und Handwerk
Ruhe und Zeit im Fass Salz Geduld Schicht um Schicht und
Ruhe und Zeit im Fass Salz Geduld Schicht um Schicht ohne Eile mit ruhiger Hand in kleinen Mengen Tag für Tag langsam und stetig Handgriff für Handgriff Aromen Reifung Handwerk Fasslager Handarbeit Fermentation Fasslager
Links mit Bild, in der Mitte reine Textkarte mit Fußzeile, rechts über Budget: Titel und Text laufen über ihre Grenze und der Text wird auf vier Zeilen gekürzt — gekürzt wird ausschließlich hier und in der Wertepaarliste.
Ruhe · Zeigerkontakt (erzwungen) · Fokus im Inneren (mit der Tabulatortaste erreichbar)
Ruhezustand.
Zeigerkontakt: Rahmen im vollen Ton, zwei Pixel angehoben.
Fokus im Inneren — derselbe Rahmen, ausgelöst vom Verweis darin.
Verweis in der Karte Die Karte hebt sich von ihrer Fläche ab, und zwar gemessen. Der Abstand steht in ΔL* — dem wahrnehmungsnahen Helligkeitsmaß —, weil nur dieses Maß auf dunkler und heller Fläche vergleichbar ist. Den Mindestwert trägt allein ΔL*: unterhalb davon sind zwei große Felder nicht mehr auf einen Blick als getrennt erkennbar. Der Kontrastwert daneben ist nur ein Zeuge und kein Mangel — für zwei benachbarte Flächen ist er das falsche Werkzeug, denn er meldet denselben Schritt auf heller Fläche als den stärkeren.
- --surface-raised-on-dark auf --surface-base ΔL* 6,53 · 1,1377 : 1 Karte, Bildrahmen, Leerzustand und Hinweisleiste auf dunkler Fläche — Mindestwert ΔL* 5,00, Kontrastwert nur als Zeuge
- --surface-raised-on-light auf --surface-cream ΔL* 6,54 · 1,1861 : 1 Dieselben vier auf heller Fläche — Mindestwert ΔL* 5,00, Kontrastwert nur als Zeuge
19 · Figure — der Bildrahmen
Die vier Formate, mit Bild
3 / 4 · Flaschen
4 / 5 · Porträt
16 / 9 · Titelbild und Bandbilder
1 / 1 · Rasterkacheln
Die vier Formate, ohne Bild — dieselben Kästen, auf den Pixel
3 / 4 · Flaschen
4 / 5 · Porträt
16 / 9 · Titelbild und Bandbilder
1 / 1 · Rasterkacheln
Der Beschnitt: dasselbe Bild im Seitenverhältnis 8:3 in einen quadratischen Rahmen gegeben. Es wird beschnitten, nicht verzerrt — deshalb ist der Satz der Formate geschlossen.
20 · DefinitionList — die Wertepaare
Dunkel · vollständig
- Herkunft
- Ruhe und Zeit im Fass Salz Geduld Geduld
- Füllmenge
- Fermentation
- Begleitung
- Ruhe und Zeit im Fass Salz Geduld Schicht um Schicht ohne Eile mit ruhiger Hand in kleinen Mengen Tag für Tag langsam im
- Zutaten
- Ruhe und Zeit im Fass Salz Geduld Schicht um Schicht ohne Eile mit ruhiger Hand in kleinen Mengen Tag für Tag langsam und stetig Handgriff für Handgriff Aromen Reifung Handwerk Fasslager Handarbeit Fermentation Handwerkszeit im Fermentation
Hell · mit fehlenden Werten — die leeren Zeilen fallen ganz weg, sie werden nicht leer gezeigt
- Herkunft
- Ruhe und Zeit im Fass Salz Geduld Geduld
- Zutaten
- Ruhe und Zeit im Fass Salz Geduld Schicht um Schicht ohne Eile mit ruhiger Hand in kleinen Mengen Tag für Tag langsam und stetig Handgriff für Handgriff Aromen Reifung Handwerk Fasslager Handarbeit Fermentation Handwerkszeit im Fermentation
21 · HeatScale — der Schärfegrad
Dunkel · alle fünf Stufen mit deutschem Wort
Mild Spürbar Mittel Kräftig Sehr scharfHell · alle fünf Stufen; die Wortmarke am Budget: 16 Zeichen (16 gezählt)
Mild Spürbar Mittel Kräftig Sehr scharf Ruhe und Zeit imNeunter Teil
Leere Zustände
Zwei verschiedene Fälle, die nicht verwechselt werden dürfen — und ein Bildrahmen, der ohne Bild genauso viel Platz einnimmt wie mit.
22 · EmptyState — die leere Seite
Dunkel · mit nächstem Schritt
Hell · ohne nächsten Schritt
Noch keine Bezugsquellen hinterlegt
Wir bauen unser Händlernetz gerade auf. Fragen Sie uns direkt, wo Sie unsere Saucen bekommen.
Am Budget: Überschrift 40 Zeichen (40 gezählt), Text 120 Zeichen (120 gezählt)
Fall A und Fall B nebeneinander
Fall A ist ein listengetriebenes Band, dessen Liste leer ist: es wird gar nicht gebaut — kein Titel, kein Band, kein Hinweis. Ein Kasten mit »noch keine Auszeichnungen« bewirbt genau das Fehlen. Fall B ist eine Seite, deren ganzer Zweck diese Liste ist: sie kann nicht verschwinden, also bekommt sie eine Überschrift, einen Satz und einen nächsten Schritt.
Fall A · Liste gefüllt — das Band wird gebaut
Auszeichnungen
Ein Eintrag.
Ein zweiter Eintrag.
Fall A · Liste leer — hier steht absichtlich nichts
Kein Titel, kein Rahmen, keine Meldung: das Band wird gar nicht erst gebaut. Was hier zu sehen ist, ist diese Erklärung — im Betrieb wäre an dieser Stelle nichts.
Fall B · Liste gefüllt
Eine Sorte.
Eine zweite Sorte.
Der Beweis zu DSGN-08: dasselbe Raster, mit und ohne Bild
Mit Bild
Ruhe und Zeit im Fass Salz Feuer
Ruhe und Zeit im Fass Salz Geduld Schicht um Schicht ohne Eile mit ruhiger Hand in kleinen Mengen Tag für Tag langsam und Handwerk
Ruhe und Zeit im Fass Salz Feuer
Ruhe und Zeit im Fass Salz Geduld Schicht um Schicht ohne Eile mit ruhiger Hand in kleinen Mengen Tag für Tag langsam und Handwerk
Ruhe und Zeit im Fass Salz Feuer
Ruhe und Zeit im Fass Salz Geduld Schicht um Schicht ohne Eile mit ruhiger Hand in kleinen Mengen Tag für Tag langsam und Handwerk
Ohne Bild — dieselben Kästen, dieselbe Höhe, dieselbe Anmutung. Ein Monogrammfeld, kein Platzhalter: keine Schrift, kein Fragezeichen, kein graues Kästchen.
Ruhe und Zeit im Fass Salz Feuer
Ruhe und Zeit im Fass Salz Geduld Schicht um Schicht ohne Eile mit ruhiger Hand in kleinen Mengen Tag für Tag langsam und Handwerk
Ruhe und Zeit im Fass Salz Feuer
Ruhe und Zeit im Fass Salz Geduld Schicht um Schicht ohne Eile mit ruhiger Hand in kleinen Mengen Tag für Tag langsam und Handwerk
Ruhe und Zeit im Fass Salz Feuer
Ruhe und Zeit im Fass Salz Geduld Schicht um Schicht ohne Eile mit ruhiger Hand in kleinen Mengen Tag für Tag langsam und Handwerk
Zehnter Teil
Bausteine: Formular
Vier Bauteile, die erst die Kontaktseite in Phase 5 braucht — hier bereits in jedem Zustand, damit sie dort unverändert zusammengesetzt werden können.
23 · Field — das Eingabefeld
Dunkle Fläche
Damit wir antworten können.
Bitte geben Sie eine gültige E-Mail-Adresse ein.
Beschriftung am Budget: 30 Zeichen (30 gezählt)
Helle Fläche
Damit wir antworten können.
Bitte geben Sie eine gültige E-Mail-Adresse ein.
Beschriftung am Budget: 30 Zeichen (30 gezählt)
24 · SegmentedChoice — die Auswahl
Dunkle Fläche · ohne Auswahl
Mit Auswahl und erzwungenem Fokus auf der zweiten Möglichkeit
Alle vier am Budget: 20 Zeichen — bei 320 bricht die Gruppe auf zwei Reihen
Gesperrt
Pflichtangabe im Fehlerzustand — beide Kästchen im Fehlerrand, beide Optionen aria-invalid, eine Meldung
Mit error="" — eine leere Zeichenkette ist keine Meldung und markiert nichts
Helle Fläche · ohne Auswahl
Mit Auswahl und erzwungenem Fokus auf der zweiten Möglichkeit
Alle vier am Budget: 20 Zeichen — bei 320 bricht die Gruppe auf zwei Reihen
Gesperrt
Pflichtangabe im Fehlerzustand — beide Kästchen im Fehlerrand, beide Optionen aria-invalid, eine Meldung
Mit error="" — eine leere Zeichenkette ist keine Meldung und markiert nichts
25 · Checkbox — die Einwilligung
Dunkle Fläche
Bitte bestätigen Sie diesen Punkt.
Einwilligungstext am Budget: 180 Zeichen (180 gezählt) — er läuft neben dem Kästchen, nie darunter
Helle Fläche
Bitte bestätigen Sie diesen Punkt.
Einwilligungstext am Budget: 180 Zeichen (180 gezählt) — er läuft neben dem Kästchen, nie darunter
26 · FormError — die Fehlermeldung
Dunkle Fläche · am Feld
Bitte geben Sie eine gültige E-Mail-Adresse ein.
Am Formular · eigene Meldung, mit Linie an der Vorderkante
Ihre Nachricht konnte nicht gesendet werden. Bitte versuchen Sie es noch einmal oder schreiben Sie uns direkt.
Am Budget: 90 Zeichen (90 gezählt)
Ruhe und Zeit im Fass Salz Geduld Schicht um Schicht ohne Eile mit ruhiger Hand in kleinen
Helle Fläche · am Feld
Bitte geben Sie eine gültige E-Mail-Adresse ein.
Am Formular · eigene Meldung, mit Linie an der Vorderkante
Ihre Nachricht konnte nicht gesendet werden. Bitte versuchen Sie es noch einmal oder schreiben Sie uns direkt.
Am Budget: 90 Zeichen (90 gezählt)
Ruhe und Zeit im Fass Salz Geduld Schicht um Schicht ohne Eile mit ruhiger Hand in kleinen
Elfter Teil
CMS-Anbindung (intern)
Alles in diesem Band wird bei jedem Aufruf aus dem Inhaltsbereich gelesen. Kein Wort davon steht im Quelltext dieser Seite.
Saucen
Titel, Text und Bild je Eintrag. Kein Eintrag trägt derzeit ein Bild, also zeigt jeder Rahmen das Monogrammfeld — dieselbe Höhe, dieselbe Anmutung, dasselbe Raster wie mit Bild.
Italian Stallion
Oliven, Kapern, Tomaten und alles was einen noch an den Italienurlaub erinnert. Dazu noch ordentlich Fuoco, wie es sich für einen temperamentvollen Italiener gehört.
Fiery Ale
Drei dunkle Biere die Ihre Karamellnoten perfekt an den Buchenrauch anschmiegen. Dazu gesellen sich dunkler Balsamico und sonnengereifte Tomaten die alles vereinen.
Umeboshi in de Goshi
Die Japaner machen schon verrückte Sachen mit ihren Lebensmitteln. Wir nehmen ein paar davon und machen etwas noch Verrückteres daraus. Fruchtig aber alles andere als gewöhnlich.
Sri Rachacha
Die schärfste der vier Saucen. Überwältigend, jedoch nur beim Geschmack.
Ein vorhandener Abschnitt
Schlüssel: fermentation-intro — im Inhaltsbereich hinterlegt
Das Verfahren
Was im Fass passiert, während wir draußen warten müssen.
Fermentation ist das älteste Verfahren, das Menschen kennen, um Lebensmittel haltbar und zugleich besser zu machen. Hier ist sie nicht nur ein Schritt unter vielen. Sondern der Schritt der den gewissen Twist erschafft.
Ein Abschnitt, den es nicht gibt
Schlüssel: cal03-probe-nicht-vorhanden — absichtlich nicht angelegt. Genau derselbe Aufruf wie darüber, genau dieselbe Darstellung: statt einer Lücke kommt der vollständig vorbelegte deutsche Abschnitt zurück, und die Diagnoseliste unten nennt den fehlenden Schlüssel.
Fermentiertes Feuer
Bezugsquellen
Nach Region gruppiert. Die Reihenfolge ist die, die im Inhaltsbereich eingetragen ist.
Oberösterreich
- Marktstand Auer 4020 Linz
Steiermark und Südburgenland
- Hofladen Stiegler 8352 Unterlamm, Südoststeiermark
- Weinhof & Feinkost Reiterer 8330 Feldbach
Wien
- Feinkost Wallner 1060 Wien
- Greißlerei zum Grünen Anker 1070 Wien
- Feinkosthandlung am Karmelitermarkt Wien 1020 Wien
Schritte der Fermentation
In der eingetragenen Reihenfolge; die Zahl daneben ist der Sortierwert aus dem Inhaltsbereich.
- Die Auslese 1
- Das Einsalzen 2
- Die Maische 3
- Die lange Ruhe und die Reife 4
- Die Kocherei 5
- Das Abfüllen 6
Einstellungen
Fermentiertes Feuer e.U.
Diagnosen dieses Aufrufs
Sammlung, Feld und Art — bewusst ohne den Meldungstext, denn der trägt die Wortwahl der Plattform und gehört auf keine ausgelieferte Seite. Die Liste entsteht bei diesem einen Aufruf und wird danach verworfen. Gleiche Einträge sind zusammengefasst; fast alle bedeuten nur, dass ein freiwilliges Feld leer ist.
202 Meldungen, zu 18 Zeilen zusammengefasst
- saucen claim over-budget · 4×
- saucen kurzbeschreibung over-budget · 3×
- haendler website defaulted · 4×
- seitenabschnitte eyebrow defaulted · 15×
- seitenabschnitte lede defaulted · 11×
- seitenabschnitte cta_label defaulted · 35×
- seitenabschnitte cta_ziel defaulted · 35×
- seitenabschnitte bild_alt defaulted · 47×
- seitenabschnitte textkoerper defaulted · 25×
- seitenabschnitte eyebrow over-budget · 2×
- seitenabschnitte lede over-budget · 12×
- seitenabschnitte schluessel defaulted · 2×
- seitenabschnitte ueberschrift defaulted
- fermentationsschritte textkoerper over-budget
- fermentationsschritte bild_alt defaulted · 2×
- einstellungen telefon defaulted
- einstellungen uid_nummer defaulted
- einstellungen blattlinie defaulted
Musterdaten
Katalog
Der Preisblock in seinen drei Zuständen, die vollständigen Angaben zum Produkt und die Karte — an erfundenen Werten, weil echte noch nirgends eingetragen sind.
Alle Werte in diesem Abschnitt sind erfundene Musterdaten für die Prüfung der Darstellung. Die „Musterflasche" ist kein Erzeugnis, ist nicht erhältlich und beschreibt keine unserer Saucen.
Solange die vierzehn Pflichtangaben im Content Manager leer sind, entsteht dieser Block auf keiner echten Seite. Er steht deshalb hier: eine Prüfung, die nur echte Seiten ansieht, wäre grün, ohne irgendetwas gemessen zu haben. Die „Musterflasche" ist der Prüfkörper, an dem die Darstellung überhaupt erst prüfbar wird.
Die drei Zustände
Zustand N — nur redaktionell
Der Betrag ist „0". Der Preis stirbt am Formatierer, nicht am Parser: formatEuro liefert null, also entsteht überhaupt kein Preisblock — kein Nullbetrag, kein Platzhalter, kein Gedankenstrich.
Kein Preisblock. Nicht leer, nicht durchgestrichen, nicht „nicht verfügbar" — dieser Zustand ist genau die Seite von heute.
Zustand P — Preis ohne Kauf
Preis, Grundpreis, Verfügbarkeit und Versandhinweis. Anstelle einer Kaufmöglichkeit steht ein Satz, der den Weg nennt, der wirklich offen ist.
€ 14,90
€ 99,33 je 1 l
Derzeit ausverkauft
Online bestellbar ist diese Sauce noch nicht. Wo es unsere Saucen gibt, steht unter Bezugsquellen .
Zustand K — kaufbar
Derselbe Block mit genau einer Kaufmöglichkeit. Diese Musterseite ist die einzige Stelle im ganzen Bestand, an der dieser Zustand überhaupt entsteht.
Die eine Kaufmöglichkeit oben hängt an der Vollständigkeitsprüfung, nicht an einem festen Wert: fehlt eine einzige Pflichtangabe, verschwindet sie. Sie führt seit dem 17. August 2026 zum Warenkorb — vorher gab es die Seite nicht, und ein Verweis auf eine Seite, die es nicht gibt, wäre schlechter als gar keiner gewesen. Weil hinter der Musterflasche kein Erzeugnis steht, endet dieses Muster im Warenkorb mit genau dem Satz, den auch eine von Hand gebaute Anfrage bekäme.
Derselbe Preisblock auf dunkler Fläche
Dunkel · Zustand P
Hell · Zustand P
Auf keiner der beiden Flächen steht ein Steuersatz, ein Prozentzeichen oder eine Angabe zur Steuerposition. Diese Abwesenheit ist die richtige Darstellung — die Kleinunternehmerposition erlaubt keine solche Angabe — und sie wird geprüft.
Angaben zum Produkt
Angaben zum Produkt
Zutaten
Wasser, fermentierte Chilischoten, Weißweinessig, Senfsaatmehl, Selleriewurzelstücke, Meersalz, Rohrzucker, Knoblauchzehenfermentat, Chilischotenfermentationsansatz
Die beiden hervorgehobenen Wörter stehen nirgends für sich allein im Text — nur die Erweiterung auf das ganze Wort bringt sie hervor. Hervorgehoben wird ausschließlich über den Schriftschnitt: dieselbe Farbe, dieselbe Fläche.
Menge und Herkunft
- Nettofüllmenge
- 150 ml
- Ursprungsland
- Musterland
Nährwerte
je 100 ml
- Energie
- 1.234 kJ / 295 kcal
- Fett
- 0,8 g
- davon gesättigte Fettsäuren
- 0,1 g
- Kohlenhydrate
- 9,4 g
- davon Zucker
- 7,1 g
- Eiweiß
- 1,2 g
- Salz
- 2,3 g
Aufbewahrung
Kühl und dunkel lagern, nach dem Öffnen im Kühlschrank aufbewahren
Lebensmittelunternehmer
Musterbetrieb e.U.
Musterweg 1, 1000 Musterstadt
Das Mindesthaltbarkeitsdatum gilt je Abfüllung und ändert sich mit jeder Charge. Deshalb steht es auf dem Etikett der Flasche und nicht hier.
Die sieben Zeilen stehen in der Reihenfolge, die der Anhang XV vorschreibt; die Reihenfolge ist Gesetz und keine Gestaltung. Der Kilokalorienwert wird aus dem Kilojoulewert berechnet, nicht eingetragen.
Die Karte
Links mit Bild, in der Mitte und rechts ohne — ohne Bild erscheint das gestaltete Monogrammfeld, niemals eine Lücke und niemals ein gebrochenes Bild. Rechts steht eine Zusammensetzung in Prüflänge in der Unterzeile.
Musterflasche
Fermentierte Chilisauce, Musterrezeptur
12 Wochen im Fass
Musterflasche
Fermentierte Chilisauce, Musterrezeptur
12 Wochen im Fass
Musterflasche
Milchsäurebakterienkulturvermehrung
12 Wochen im Fass
Auf einer Karte steht nie eine Kaufmöglichkeit — die Pflichtangaben stehen auf der Einzelseite, und dort wird gekauft. Die Karten hier führen bewusst nirgendwohin: eine Einzelseite zur Musterflasche gibt es nicht.
Das Set
Links eine Musterflasche, rechts ein Musterset — dieselbe Füllmenge, derselbe Betrag. Rechts fehlt die Schärfeskala, weil vier verschiedene Saucen keinen einzelnen Schärfegrad haben, und rechts fehlt die Grundpreiszeile, weil das Preisauszeichnungsgesetz Sachgüter verschiedener Art zu einem Gesamtpreis davon ausnimmt. Statt ihrer steht dort die Gesamtfüllmenge.
Musterflasche
Fermentierte Chilisauce, Musterrezeptur
Die vier Saucen im Set
Zutaten, Allergene und Nährwerte finden Sie auf den Produktseiten.
Diese vier Verweise führen — anders als die Karten oben — an echte Ziele: sie kommen aus demselben Bestand wie die Verweise auf der echten Setseite und werden nach derselben Regel gebildet. Ein Muster, das ins Leere zeigt, würde genau die Eigenschaft nicht zeigen, um die es hier geht.
Musterdaten
Warenkorb
Der Warenkorb in den Zuständen, die auf der echten Seite heute nicht entstehen können — Positionen, Mengen, Summe, Fehler und der Weg zurück.
Alle Werte in diesem Abschnitt sind erfundene Musterdaten für die Prüfung der Darstellung. Es gibt keinen „Musterflasche"-Warenkorb, keine Musterbestellung und keine „Musterzahlart".
Solange keine Sauce online verkäuflich ist, bleibt der echte Warenkorb leer und zeigt genau einen Zustand. Alles Übrige steht deshalb hier: eine Prüfung, die nur echte Seiten ansieht, wäre grün, ohne die Positionszeile, die Mengensteuerung, die Summe, den Entfernt-Hinweis und die sieben Meldungen je gesehen zu haben.
Positionen und Mengen
-
„Musterflasche" wurde aus dem Warenkorb entfernt.
-
Menge 1 — „Weniger" ist stillgelegt
Musterflasche
€ 14,90
Fermentierte Chilisauce, Musterrezeptur
Einzelpreis € 14,90
€ 99,33 je 1 l
-
Mittlere Menge, ohne Bezeichnung
Zweite Musterflasche
€ 84,50
Einzelpreis € 16,90
€ 67,60 je 1 l
-
An der Zwölfergrenze — „Mehr" ist stillgelegt
Dritte Musterflasche
€ 178,80
Fermentierte Chilisauce, Musterrezeptur
Einzelpreis € 14,90
Größere Mengen besprechen wir gern direkt mit Ihnen. Anfrage schreiben
-
An der Bestandsgrenze — „Mehr" ist stillgelegt
Vierte Musterflasche
€ 45,80
Fermentierte Chilisauce, Musterrezeptur
Einzelpreis € 22,90
€ 152,67 je 1 l
Mehr ist von dieser Sauce derzeit nicht vorrätig.
Ohne Zahlungshinweis — heute
- Zwischensumme
- € 324,00
- Lieferung
- Kostenlos
- Gesamtsumme
- € 324,00
Wir liefern ausschließlich innerhalb Österreichs.
Der Warenkorb besteht nur in dieser Browsersitzung: Nach etwa vier Stunden ist er leer, und mit dem Schließen des Browsers ebenfalls.
Im nächsten Schritt geben Sie Lieferadresse und Zahlungsdaten ein. Verbindlich bestellen Sie erst dort.
Was beim Bestellen verarbeitet wird, steht in der Datenschutzerklärung .
Mit Zahlungshinweis
- Zwischensumme
- € 324,00
- Lieferung
- Kostenlos
- Gesamtsumme
- € 324,00
Wir liefern ausschließlich innerhalb Österreichs.
Bezahlen können Sie mit Musterzahlart.
Der Warenkorb besteht nur in dieser Browsersitzung: Nach etwa vier Stunden ist er leer, und mit dem Schließen des Browsers ebenfalls.
Im nächsten Schritt geben Sie Lieferadresse und Zahlungsdaten ein. Verbindlich bestellen Sie erst dort.
Was beim Bestellen verarbeitet wird, steht in der Datenschutzerklärung .
Die sieben Meldungen
1 · Sitzung abgelaufen
Ihr Warenkorb ist nicht mehr vorhanden. Sitzungen enden nach etwa vier Stunden — bitte legen Sie die Sauce noch einmal hinein.
2 · Position nicht mehr da
Diese Position ist nicht mehr im Warenkorb. Möglicherweise haben Sie sie schon entfernt.
3 · Menge angepasst
Von dieser Sauce ist derzeit weniger vorrätig, als Sie bestellen möchten. Wir haben die Menge angepasst.
4 · Über der Zwölfergrenze
Mehr als zwölf Flaschen einer Sorte bestellen Sie bitte direkt bei uns. Anfrage schreiben
5 · Online nicht verkäuflich
Diese Sauce können wir online derzeit nicht verkaufen. Wo es unsere Saucen gibt, steht unter Bezugsquellen .
6 · Schreiben fehlgeschlagen
Der Warenkorb konnte gerade nicht aktualisiert werden. Bitte versuchen Sie es noch einmal oder schreiben Sie uns direkt.
7 · Herkunft abgelehnt (HTTP 403, kein 303)
Diese Anfrage kam nicht von dieser Seite und wurde deshalb nicht ausgeführt. Bitte versuchen Sie es noch einmal.
Der leere Warenkorb, in beiden Fassungen
B-1 — wenn etwas kaufbar ist
Die Kaufmöglichkeit zum Warenkorb steht genau einmal auf dieser Seite, im Abschnitt Katalog — dort, wo sie auch auf der echten Einzelseite steht. Ihre Formularfelder kommen aus derselben Musterdatei wie alles hier.
Komposition: die sieben Bandformen
Jede Seite dieser Website ist aus Bändern gebaut, und jedes Band hat genau eine von sieben Formen. Die folgenden sieben Bänder zeigen alle sieben — dazu beide Breiten und beide Rhythmen.
Auf jeder anderen Seite darf dieselbe Form in derselben Breite kein zweites Mal vorkommen. Diese Seite ist davon ausgenommen, denn eine Seite, die alle sieben Formen vorführt, muss manche wiederholen. Ebenso ausgenommen ist sie von der Obergrenze für Augenbrauen-Zeilen, weil sie diesen Baustein in jedem Zustand zeigen soll. Beide Ausnahmen sind mit diesem Abschnitt bezahlt: Wer hier eine Form vermisst, hat einen Fehler gefunden und keine Geschmacksfrage.
Dieses Band ist selbst die erste Form, der Auftakt: eine Überschrift über die volle Breite, darunter Text und Bild ungleich verteilt. Im Betrieb trägt ein Auftakt die einzige Hauptüberschrift seiner Seite. Hier steht die Überschrift eine Ebene tiefer, weil diese Seite ihre Hauptüberschrift schon ganz oben hat und die Reihenfolge der Überschriften geprüft wird.
Zweite Form: das Paar
Eine Textspalte neben einer Bildspalte, sechs zu fünf geteilt. Ab 1024 Pixel stehen beide nebeneinander, darunter untereinander in der Lesereihenfolge.
Was das Paar leistet
Das Paar ist die Form für einen Gedanken mit einem Bild daneben; es trägt die erzählenden Bänder der Startseite. Die Spalten sind bewusst ungleich breit: Zwei gleiche Hälften lesen sich als Gegenüberstellung, nicht als Erzählung.
Dritte Form: das Raster
Gleichrangige Karten nebeneinander. Die Spaltenzahl wird aus der Anzahl der Karten abgeleitet und nie umgekehrt — deshalb bleibt keine Zeile angebrochen.
Drei Karten, drei Spalten
Bei drei Einträgen überspringt das Raster die zweispaltige Stufe und geht von einer
Spalte direkt auf drei.
Die Anzahl ist die Eingabe
Der Baustein bekommt gesagt, wie viele Dinge er hält, und entscheidet selbst, wie viele
Spalten er dafür benutzen darf.
Keine halbe Reihe
Jede benutzte Spaltenzahl teilt die Anzahl ohne Rest. Eine einzelne Karte am Ende einer
Reihe kann so gar nicht entstehen.
Vierte Form: die Folge
Eine nummerierte Abfolge, Schritt für Schritt, mit einer Haarlinie zwischen den Schritten und keiner über dem ersten. Dieses Band zeigt zugleich die zweite Breite: Das Bild darunter läuft bis an den Rand des Fensters.
-
Schritt 1
Das Bild steht direkt im Band
Die volle Breite entsteht allein durch die Position im Aufbau: Das Bild ist ein unmittelbares Kind des Bandes und steht außerhalb der Spalte, die alle übrigen Inhalte hält.
-
Schritt 2
Dafür braucht es keine eigene Regel
Ein Band setzt seinen Abstand nur nach oben und unten, nie zur Seite. Ein direktes Kind nimmt sich die volle Breite deshalb von selbst, ohne eine einzige zusätzliche Zeile in der Gestaltung.
-
Schritt 3
Der bequeme Weg ist der gesperrte
Eine Breitenangabe in Fensterbreiten zählt die senkrechte Bildlaufleiste mit und gibt der Seite dadurch eine waagrechte dazu. Diese Seite ist die längste im Bestand, also der lauteste denkbare Ort für diesen Fehler — und deshalb ist der Weg ausdrücklich versperrt.
Fünfte Form: das Register
Zwei Spalten auf gemeinsamer Schriftlinie, eine Haarlinie zwischen den Zeilen und keine über der ersten. Die Form für Aufzählungen, die man abliest statt sie zu lesen.
- Auftakt eine je Seite
- Paar, Raster, Folge erzählende Bänder
- Register, Prosa lesende Bänder
- Schluss der nächste Schritt
Sechste Form: die Prosa
Eine einzelne Textspalte auf Lesebreite, ohne Bild daneben. Dieses Band trägt zugleich den zweiten Rhythmus — es ist enger gesetzt als seine beiden Nachbarn.
Ein enges Band nimmt oben und unten 64 Pixel, ein gewöhnliches bei 1440 Pixel Fensterbreite 160. Der Unterschied ist nur als Nachbarschaft lesbar, deshalb steht dieses Band mitten zwischen zwei gewöhnlichen und nicht am Anfang oder Ende der Reihe.
Der engere Rhythmus ist ausschließlich der Innenabstand dieses Bandes. Kein Außenabstand, kein Abstandhalter, kein zusammengeschobener Stapel — ein Band, das eines Tages nicht mehr gebaut wird, hinterlässt so auch keine doppelte Lücke.
Das erste Band einer Seite darf nie eng sein. Sein oberer Abstand wird bereits von einer anderen Regel gesetzt, und zwei gleich starke Regeln auf demselben Rand entscheiden sich nach der Reihenfolge der Stilvorlagen — also nach etwas, das hier niemand festlegt.
Absichtliche Vorführung — RULE C1b. Dieser eine Baustein steht bewusst außerhalb jeder Fläche. Weil er dort nicht wissen kann, welches der beiden Goldtöne richtig wäre, nimmt er keinen: er wird magenta. Ein Baustein, der seine Fläche in einer späteren Phase verliert, sieht genauso aus — und die Prüfung in 02-08 bricht daran ab.
Ohne Fläche kein Ton. Dieses Feld ist der Beweis, dass die Sperre greift.