Rastersysteme: Generator für Layoutraster für Druck und Bildschirm

Bauen Sie ein Rastersystem wie in den Lehrbüchern der Typografie: Seiten- oder Bildschirmformat, Stege nach einem Kanon (Van de Graaf, Tschichold) oder eine Voreinstellung (Goldener Schnitt, modular, gleiche Stege) oder eigene, Spalten mit Spaltenabstand, Module in ganzen Grundlinien, Zeilenabstand und eine am Grundlinienraster ausgerichtete Schriftgrößenskala. Live-Vorschau, Export nach SVG, PDF, CSS Grid, JSON und als Einstellungen für DTP-Programme.

Das Raster wird im Browser berechnet. Parameter und Dateien verlassen Ihr Gerät nicht.

Fertige Einstellungen für typische Projekte. Die Auswahl füllt die Felder unten, die Sie weiter anpassen können.

Seite / Bildschirm

Stege (Ränder)

Buchkanons (Van de Graaf, Tschichold) und die Voreinstellung nach dem Goldenen Schnitt ergeben bewusst breite Stege: der Satzspiegel umfasst etwa 40–60 % der Seite. Für Flyer, Plakate und Bildschirm wählen Sie symmetrische oder eigene Stege.

Spalten und Module

Grundlinienraster

Schriftgrößenskala

Vorschau

Werte

Bildgrößen im Raster

Ein Bild füllt ganze Felder: Unterkante auf einer Grundlinie, Oberkante etwa 0,7 Schriftgrad über der Grundlinie der ersten Zeile (Versalhöhe). Der Abstand zwischen den Feldern beträgt eine Zeile.

Code und Einstellungen


            
Herunterladen: Schrift für dieses Raster wählen

Was ist ein Rastersystem und wozu baut man es?

Ein Rastersystem ist die unsichtbare Konstruktion eines Layouts: Die Stege legen den Satzspiegel fest, Spalten und Spaltenabstände ordnen die Breiten, Module die Höhen, und das Grundlinienraster (Zeilenabstand) sorgt dafür, dass der Text in benachbarten Spalten und auf gegenüberliegenden Seiten auf denselben Linien steht. Ein gut gebautes Raster verkürzt die Gestaltung, vereinheitlicht die Publikation und erlaubt es, Druck und Bildschirm auf einer gemeinsamen Logik der Proportionen zu verbinden.

Kanons der Stege (Van de Graaf, Tschichold) und die Voreinstellung nach dem Goldenen Schnitt

Der Kanon von Van de Graaf ist eine geometrische Konstruktion, die die Seite in Neuntel teilt: Bundsteg 1/9 der Breite, Außensteg 2/9, Kopfsteg 1/9 der Höhe, Fußsteg 2/9. Der Satzspiegel behält die Proportion der Seite. Tschichold beschrieb die Proportionen 2:3:4:6 (innen : oben : außen : Unten). Die Voreinstellung nach dem Goldenen Schnitt skaliert die Stege mit 1,618 (1 : φ : φ : φ², ausgehend von 1/12 der Seitenbreite); sie ist kein historischer Kanon. Der Generator berechnet diese Werte für jedes Format und lässt Sie sie von Hand korrigieren. Ein Kanon ist ein Ausgangspunkt, kein Dogma.

Grundlinienraster und Schriftgrößenskala

Der Zeilenabstand des Grundtextes (z. B. 12 pt) wird zur Einheit des Grundlinienrasters: Der Satzspiegel wird an eine ganze Zahl von Zeilen angepasst, Module sind ganze Zeilen hoch, und die Schriftgrade der Überschriften aus der Skala (1,2 · 1,25 · 1,333 · 1,5 · 1,618) erhalten einen Zeilenabstand, der ein Vielfaches der Einheit ist. So „sitzt" alles auf einem Raster. Für den Bildschirm funktioniert dieselbe Logik in Pixeln (z. B. 8 px), mit Export nach CSS Grid und CSS-Variablen.

Glossar: Raster, Satz und Spalte

Rastersystem
Ein Regelwerk für den Seitenaufbau: Stege, Spalten, Module und Grundlinienraster, die gemeinsam die Position von Text und Bildern in einer ganzen Publikation oder Website ordnen.
Satz
Das Anordnen von Text und Grafik auf der Seite nach festen Parametern: Format, Stege, Spalten, Schriftgrad und Zeilenabstand. Früher das Setzen von Bleilettern, heute die Arbeit im DTP-Programm oder in CSS.
Satzspiegel
Der Bereich der Seite innerhalb der Stege, in dem Text und Bilder platziert werden. In der Buchtypografie auch Kolumne (im Sinne der Fläche) oder Textblock genannt.
Textspalte
Ein senkrechtes Textband mit festgelegter Breite (Satzbreite); eine Seite kann eine oder mehrere Textspalten haben. Im Webdesign entspricht ihr die Inhaltsspalte.
Rasterspalte
Die Einheit, in die die Breite des Satzspiegels geteilt wird. Eine Textspalte kann eine oder mehrere Rasterspalten einnehmen, z. B. 3 von 12.
Spaltenabstand (Gutter)
Der leere Streifen zwischen Rasterspalten oder Textspalten. Häufig wird er auf den Zeilenabstand oder ein Vielfaches davon gesetzt, damit das horizontale Raster mit dem vertikalen übereinstimmt; letztlich richtet er sich nach Spaltenbreite und Schriftgrad.
Stege (Ränder)
Die Flächen zwischen dem Seitenrand und dem Satzspiegel: Kopfsteg (oben), Fußsteg (unten), Bundsteg (innen) und Außensteg (außen). Auf der Doppelseite treffen sich die Bundstege im Bund.
Satzspiegelkanon
Eine historische Konstruktion, die die Proportionen der Stege festlegt, z. B. nach Van de Graaf (1/9 und 2/9 der Seite) oder Tschichold (2:3:4:6). Eine Voreinstellung ist eine moderne, vereinbarte Proportion, kein Kanon.
Modul (Feld)
Das Rechteck, das am Schnittpunkt einer Rasterspalte mit einer Rasterreihe entsteht; die Einheit, an der Textblöcke und Bilder ausgerichtet werden. Ein 8-, 20- oder 32-Felder-Raster gibt die Zahl der Module im Satzspiegel an.
Grundlinienraster
Eine Folge waagerechter Linien im Abstand des Zeilenabstands des Grundtextes. Die Grundlinien der Zeilen liegen in allen Spalten und auf benachbarten Seiten auf denselben Linien.
Grundlinie
Die unsichtbare Linie, auf der Buchstaben ohne Unterlänge (a, m, x) stehen. Der Zeilenabstand ist der Abstand zwischen aufeinanderfolgenden Grundlinien.
Zeilenabstand
Der Abstand zwischen den Grundlinien aufeinanderfolgender Zeilen, in Punkt oder Pixel. Die Angabe 10/12 pt bedeutet Schriftgrad 10 pt und Zeilenabstand 12 pt.
Schriftgrad
Die nominelle Größe der Schrift in Punkt (1 pt = 0,353 mm) oder Pixel. Die Buchstaben sind kleiner und hängen von der Schriftart ab: bei den meisten Textschriften nehmen die Versalien etwa 0,66–0,73 des Schriftgrads ein.
Satzbreite (Zeilenlänge)
Die Breite der Textspalte, ausgedrückt in Zeichen pro Zeile. Für Fließtext werden meist 45–75 Zeichen empfohlen; kürzere Zeilen zerhacken das Lesen, längere ermüden das Auge, die Grenzen hängen aber von Schrift, Schriftgrad und Textart ab.
Typografische Hierarchie
Ein geordneter Satz von Textrollen (Bildunterschrift, Grundtext, Vorspann, Überschriften), die sich in Schriftgrad, Zeilenabstand und Schriftstärke unterscheiden und auf einer gemeinsamen Skala aufbauen.
Schriftgrößenskala
Eine Folge von Schriftgraden, die sich aus einem einzigen Verhältnis ergibt, z. B. 1,25: Jeder weitere Schriftgrad ist der vorherige, multipliziert mit dem Verhältnis.
Doppelseite
Zwei nebeneinanderliegende Seiten einer aufgeschlagenen Publikation. Ihre Stege sind gespiegelt: der Bundsteg am Bund, der Außensteg an der Kante.
Vertikaler Rhythmus
Die Regelmäßigkeit der senkrechten Abstände, die sich aus dem Grundlinienraster ergibt: Die Höhen der Blöcke und die Abstände dazwischen sind Vielfache des Zeilenabstands.
Beschnitt (Beschnittzugabe)
Der Bereich der Grafik, der über die Schnittlinie hinausragt (meist 3 mm) und nach dem Beschneiden weiße Blitzer verhindert. Er gehört nicht zum Satzspiegel.
DTP
Desktop Publishing: die Vorbereitung von Publikationen für den Druck am Computer. Das Werkzeug exportiert keine Dateien für DTP-Programme; es erzeugt eine Textübersicht (Stege, Spalten, Grundlinienraster), die von Hand in die Dokumenteinstellungen übertragen wird.

Brauchen Sie eine Publikation, einen Katalog oder ein Erscheinungsbild auf einem soliden Raster? Wir gestalten es