Typografie

Lesbar, flexibel, für Menschen gemacht

Zwei Schriften, ein Ziel: Die Botschaften der Linken visuell stärken. Die Headline-Schrift „Work Sans“ kann laut und kämpferisch sein, aber bleibt dabei menschlich. Die „Inter“ ist das Arbeitstier für Mengensatz – klar, gut lesbar und flexibel.

Sich überlagernde Beispiel Print-Layouts im Corporate Design der Linken

tl;dnr: Das Wichtigste zur Typografie

  1. Die „Work Sans“ wird exklusiv für Überschriften eingesetzt.
  2. Der Schnitt „Black“ kann um den Schnitt „Light“ ergänzt oder mit einem farbigen Banner hinterlegt werden.
  3. Der Schriftsatz in Headlines folgt der Aussage und dem Rhythmus der Sprache.
  4. Wenn’s mal länger wird: Die „Inter“ ist die exklusive Schrift für Mengensatz.

Überschriften, die sprechen

Die Headline-Schrift „Work Sans“ (gestaltet von Wei Huang) wird für Überschriften in stark kontrastierenden Schnitten eingesetzt.

Klar und deutlich

Der Schnitt „Black“ strahlt Stärke und Präsenz aus und ist ein zentrales Erkennungsmerkmal des Corporate Designs

Headline: "Ein Praktikum darf keine Ausrede für unbezahlte Arbeit sein!" gesetzt im Black Schnitt der Schrift Work Sans.

Kontrast-Version

Der „Black“-Schnitt der „Work Sans“ kann um den Schnitt „Light“ ergänzt werden. Dadurch entsteht ein spannender, visueller Kontrast, der genutzt werden kann, um die Botschaft der Headline zu unterstreichen.

Subheadlines stehen ebenfalls im „Light“-Schnitt der „Work Sans“, in einer deutlich kleineren Schriftgröße.

Headline: "Bus und Bahn statt Autobahn". "Bus und Bahn" gesetzt im Black Schnitt der Schrift Work Sans, "statt Autobahn" gesetzt im stark kontrastierenden Light Schnitt der Schrift Work Sans

Banner-Version

Der „Black“-Schnitt kann mit einem farbigen Hintergrund hinterlegt werden, um eine Botschaft stärker hervorzuheben. Umbrüche, Einrückungen oder kleine Variationen in der Schriftgröße unterstreichen den Sprachrhythmus.

Subheadlines können in einem farbigen Kasten an den Textblock angedockt werden. Sie sind kurz, laut und prägnant und stehen deshalb ausnahmsweise im Schnitt „Regular“ der „Work Sans“.

Mehr zu den Farbpaaren
Headline: "4 Tage Woche für alle!" gesetzt im Black Schnitt der Work Sans. Die einzelnen Zeilen sind farbig hinterlegt und rythmisch angeordnet.

Fließtext: Jede Menge Information

Die Fließtext-Schrift „Inter“ (gestaltet von Rasmus Andersson) bleibt auch in kleinen Größen und am Bildschirm gut lesbar. Der Schnitt „Regular“ wird für Mengensatz verwendet, „Bold“ und „Italic“ für Auszeichnungen. Bei komplexeren Anwendungen, für kleine Auszeichnungen oder Bildunterschriften kommt der Schnitt „Medium“ zum Einsatz. 
 

Ausschnitt eines Print-Layouts mit Fließtex, der durch Zwischenheadlines strukturiert ist.

Fließtext mit typografischer Binnenstruktur.

Ein klarer Rhythmus, im Print und digital

In Print-Anwendungen steht der Schriftgrößenkontrast zwischen Headlines, Subheadlines und Fließtext im Vordergrund, um eine klare Informationshierarchie zu gewährleisten. Die Headlines werden in einer engen Zeilenhöhe gesetzt, das erzeugt ein kompaktes Schriftbild. Fließtext bekommt mehr Weißraum zwischen den Zeilen, das verbessert die Lesbarkeit. Detaillierte Absatz- und Zeichen-Stile werden in den jeweiligen Dokumentvorlagen definiert.

Richtwerte für eine Typescale für Print-Anwendungen: 
- Headline 1: Work Sans Black 200pt, 95-105% Zeilenabstand
- Headline 2: Work Sans Light 200pt, 95-105% Zeilenabstand
- Subheadline 1: Work Sans Black 80pt, 110% Zeilenabstand
- Subheadline 2: Work Sans Light 80pt, 110% Zeilenabstand
- Fließtext: Inter Regular 12pt, 120 - 150% Zeilenabstand

Auch die digitalen Anwendungen stehen in einem grundsätzlichen typografischen Rhythmus. Die Hierarchie der Headlines folgt deutlichen Schritten, die sich immer am gemeinsamen Teiler 6 orientieren.

Richtwerte für eine Typescale für Digital-Anwendungen: 
- Headline 1: Work Sans Black 54px, 105% Zeilenabstand
- Headline 2: Work Sans Black 42px, 110% Zeilenabstand
- Headline 3: Work Sans Black 30px, 115% Zeilenabstand
- Headline 4: Work Sans Black 24px, 120% Zeilenabstand
- Headline 5: Work Sans Black 18px, 120% Zeilenabstand
- Zitat: Work Sans Light 24px, 120% Zeilenabstand
- Fließtext: Inter Regular 16px, 150 - 160% Zeilenabstand
- Fließtext Klein: Inter Regular 14px, 150 - 160% Zeilenabstand
- Buttons: Inter Regular 15px

Do’s & Don’ts

Die folgenden Beispiele helfen dir dabei, die Schriften richtig anzuwenden.

  • Ausschnitt eines Plakats mit der Headline "Bus und Bahn statt Autobahn" gesetzt in den Schnitten und Black und Light der Schrift Work Sans.
    Der Umbruch und die Schriftgröße unterstreichen die Botschaft visuell.
  • Ausschnitt eines Plakats mit der Headline "Gerechte Zukunft für alle!" und der Subheadline "Gemeinnützigkeit statt Profitlogik". Beide im Black Schnitt der Work Sans gesetzt.
    Die Überschriften-Hierarchie sollte klar und eindeutig sein – nicht mehr als eine Headline und eine Subheadline.
  • Ausschnitt eines Plakats mit der Headline "Gerechte Zukunft für alle!", gesetzt im Black Schnitt der Work Sans.
    Die Headline-Schrift Work Sans wird bevorzugt in weiß und rot eingesetzt – in Farbanwendungen niemals in schwarz.
  • Ausschnitt eines Plakats mit der Headline "Die Waffen nieder!" in Versalschrift
    Die Headline-Schrift Work Sans steht immer in gemischter Schreibweise, niemals in Versalien.
  • Ausschnitt eines Plakats mit der Headline "Bus und Bahn statt Autobahn" und Zusatzinformationen gesetzt mit der Schrift Inter.
    Die Inter wird für weiterführende Informationen eingesetzt.
  • Ausschnitt eines Plakats mit der Headline "Gerechte Zukunft für alle!" gesetzt in der Schrift Inter.
    Die Inter steht niemals alleine als Headline-Schrift.

Work Sans & Inter: Der Schriften-Koffer zum Download

Beide Schriften sind für den Einsatz in gedruckten und in digitalen Medien optimiert. Sie liegen als gut ausgebaute Schriftsysteme vor und können unter einer Open-Source-Lizenz frei verwendet werden. Damit alle Vorlagen funktionieren, sollten ausschließlich die zum Download bereitgestellten Schriften im TTF-Format verwendet werden.

Um diesen Inhalt nutzen zu können ist Ihre Anmeldung erforderlich.