Die Seite begleitet den Kurs „Gute Typografie“ an der VHS Frankfurt am Main, 11. und 18. April 2013. Die Seite wird im Laufe des Kurses vervollständigt und steht den Teilnehmerinnen und Teilnehmern sowie anderen Interessierten auch danach weiterhin als Referenz zur Verfügung.

Einführung Bearbeiten

Was ist Typografie? Bearbeiten

  • Herkunft des Begriffs Typografie: Aus dem Griechischen: typos („Figur“) und graphia („schreiben“).
  • Das „richtige“ und schöne Setzen (Drucken) von Schrift. ↔ Kalligraphie: Das schöne Schreiben.
  • Zweck: Dient dazu, Inhalte leichter lesbar zu machen, damit sie besser aufgenommen werden können.
  • Kunst und Handwerk: Eine Kunstform neben Malerei, Skulptur, Architektur . . . , die bestimmten Regeln folgt und die man erlernen kann.

Was ist digitale Typografie? Bearbeiten

Neben der digitalen Typografie ist auch der Digitaldruck ein wesentlicher Bestandteil. Dabei werden beim Digitaldruck fertigen Druckvorlagen direkt vom Computer in die entsprechende Druckmaschine übertragen.[1]

Zitate Bearbeiten

  • „Wenn die Typographie eine Kunst ist, dann nur die, sich in den Leser hineinzuversetzen und ihm einen Text so wenig aufdringlich wie möglich, so angenehm wie möglich zu offerieren . . . Das Auge reagiert extrem empfindlich auf das Leseangebot. Nicht wohlwollend angebotene Texte läßt es liegen.“ – Otl Aicher, Schriftgestalter.
  • How do we persuade new users that spreading fonts across the page like peanut butter across hot toast is not necessarily the route to typographic excellence? – Peter Flynn.

Beispiele Bearbeiten

Grundbedingungen für Typografie Bearbeiten

Worauf ist Rücksicht zu nehmen?

  • Historische Prägungen: Traditionen, Konventionen, Gewohnheiten.
  • Biologische Grundlagen: Augen, Nerven, Gehirn – wie liest man?
  • Wahrnehmungspsychologie: Aufnehmen und Verarbeitung des Gesehenen.
  • Erwartungen der Leser an das jeweilige Schriftstück.

Technische Grundlagen im Überblick Bearbeiten

Heute übliche Software für die Arbeit mit Texten:

  • Textsatz: TeX/LaTeX
  • Desktop-Publishing/Layout: Adobe InDesign, QuarkXPress, Scribus.
  • Textverarbeitung: LibreOffice Writer, Microsoft Word.

Anwendungen zur Grafikbearbeitung: Adobe Photoshop, Gimp.

Vom Text zur Druckvorstufe Bearbeiten

  • Trennung von Inhalt und Form:
  • Inhalt: Die Texterfassung im Editor.
  • Form: Der Satz im Layout-Programm.
    • Mikrotypographie: Das Setzen des Texts, der Schrift, mit allen Feinheiten.
    • Makrotypographie: Das Seitenlayout. Das Anordnen von Texten und Bildern auf der Seite.

Druckvorstufe: PS/PDF-Datei → Druck.

Die Arbeitsweise im einzelnen Bearbeiten

Textsatz mit LaTeX Bearbeiten

  • Texteingabe mit Markup in einem beliebigem Editor.
  • Format: TEX.
  • In der Regel keine Änderungen am Layout.
  • Das Layout wird von einer Vorlage bestimmt.
  • Kompilieren des LaTeX-Dokuments → PS/PDF.
  • Kontrolle im Previewer → Druck.

Desktop-Publishing Bearbeiten

  • Texteingabe in Editor oder Textverarbeitung.
  • Formate: TXT oder ODT/DOC/RTF.
  • Im Layout-Programm:
    • Verwenden einer Vorlage; sonst händisch:
    • Festlegen von Seite, Satzspiegel, Schrift, Raster.
    • Textrahmen aufziehen und ggf. verketten.
    • Text in Textrahmen einfügen.
    • Bilder in Bildrahmen einfügen.
    • Position und Größe der Rahmen experimentell bestimmen. Text ggf. passend umformulieren.
  • PS/PDF-Export → Druck.

Textverarbeitung Bearbeiten

  • Texteingabe in die Textverarbeitung: Keine gesonderte Anwendung zur Texterfassung.
  • Formate: ODT/DOC/RTF.
  • Formatierung des Texts, bei Laien oft schon bei der Eingabe.
  • Möglich, aber nicht zwingend: Rahmen, Raster, PS/PDF-Export.
  • Drucken oft direkt aus der Textverarbeitung.

Empfehlung Bearbeiten

Trennen von Form und Inhalt:

  • Inhalt: Erst den Text in einen Editor eingeben.
  • Dabei mikrotypographische Feinheiten berücksichtigen.
  • Form: Dann den Text setzen (Formatieren mit: LaTeX, DTP, Textverarbeitung).
  • Export in PS/PDF als Ausgabeformat für den Druck.
  • Drucken: Druckerei oder eigener Drucker.

Regeln Bearbeiten

Welche typographischen Regeln gibt es?

  • Ausgangspunkt: Klassische Regeln des Buchdrucks.
  • Lehren von Schriftgestaltern und Typographen (Tschichold, Forssman, Willberg, Spiekermann… )
  • Hausschreibung und -typographie von Verlagen, Zeitungen, Redaktionen, Wikipedia . . .
  • Problematisch: Duden und DIN-Normen, insbesondere DIN 5008 – „Typographie“?

Fragen:

  • In welchem Verhältnis stehen diese Regeln zueinander?
  • Regelwidrige Erwartungen bei Adressaten „bedienen“?

Detailtypografie Bearbeiten

Definition Bearbeiten

In der Typografie wird zwischen Mikro- und Makrotypografie unterschieden. Makrotypografie umfasst die Fragen des groben Layouts. Angefangen bei den Trägermaterialien über die Druckverfahren bis hin zur Schriftfarbe wird in der Makrotypografie auch über das Gestaltungsraster als wohl wichtigstes Gestaltungselement entschieden. Grundfrage ist die Positionierung von Grafik und Text, wobei bereits Überlegungen zu den einzelnen Schriftarten, genauer, der Auswahl der Schriftfamilien, einfließen.

Die Mikrotypografie befasst sich hingegen nur mit der Schrift selbst. Hierbei werden Schriften im Detail angepasst, um eine optimale Lesbarkeit zu erreichen. Dies umfasst beispielsweise das Sperren oder Kerning von Schriften oder auch die Anpassung der Abstände zwischen Wörtern und Zeilen. Beim Sperren werden Abstände (Spatien) eingefügt, um den Abstand zwischen Buchstaben zu vergrößern. Kerning meint das Gegenteil, also die Verringerung der Weißräume zwischen Buchstaben. [2]

Wortzwischenräume und Abstände Bearbeiten

Auf den richtigen Wortzwischenraum ist vor allem bei Abkürzungen zu achten:

  • Normaler Zwischenraum: z. B. S. 15 ff.
  • Schmaler Zwischenraum, Spatium: z. B. § 157 SGB VII
  • Kein Zwischenraum: z.B.

Es ist jeweils ein geschütztes Leerzeichen einzufügen.

Zahlen und Ziffern Bearbeiten

Kleine Zahlen
ausschreiben: In fünf Minuten fertig.
Nicht exakte Zahlen
ausschreiben: Etwa tausend Zuschauer.
Bis zu vier Ziffern
werden ohne Abstand gesetzt: 9000.
Ab fünf Ziffern
darf man die mit schmalen Zwischenräumen gliedern: 90 000, 100 000, 1 000 000.
Telefonnummern
von hinten in Zweiergruppen gliedern: 0 69/12 34 56 78. Neuerdings: 069/12 34 56 78.
Kontonummern
von hinten in Dreiergruppen gliedern: Konto 123 456 789.
Bankleitzahlen
von vorne in Dreiergruppen gliedern: BLZ 123 123 12.
Postleitzahlen
ohne Gliederung: 63263.

Striche Bearbeiten

Der Gedanken- und der Streckenstrich sind auseinanderzuhalten:

  • Geviertstrich: 3,— Euro
  • Halbgeviertstrich: 1–2 mal
  • Viertelgeviertstrich: Trenn-, Binde-Strich

Häufig zu sehen (DIN 5008): 11 - 12 Uhr

Anführungszeichen Bearbeiten

Bei deutschen Texten sollten „Gänsefüßchen“ bevorzugt werden:

„Innerhalb von Zitaten kann man ‚solche Stellen‘ mit ‚halben Anführungszeichen‘ kennzeichnen.“
In English, use “quoted ‘text’ like this”.

In französischen Texten werden Guillemets verwendet, die mit einem schmalen Zwischenraum umgeben sind:

« On ne voit bien qu’avec le cœr. » (Saint-Exupéry)

Exkurs: Eingabe von Sonderzeichen Bearbeiten

Wie kann man Anführungszeichen, Striche, schmale und geschützte Leerzeichen, diakritische Zeichen usw. eingeben?

  • Mac: Alle relevanten Zeichen sind über die Tastatur direkt zu erreichen. Dreifache Belegung über Alt- und Shift-Taste verwenden. Ggf. die Tastaturübersicht einblenden/Zeichenübersicht zum Einfügen verwenden. Direkte „Unicode Hex-Eingabe“.
  • Linux/Unix: Compose Key + Mehrfachbelegung verwenden („Tottaste“).
  • Microsoft Windows: Alt + Zahlencode über Ziffernblock (abhängig von der Codepage des Systems).

Hervorheben von Text Bearbeiten

Text wird durch kursiven Satz hervorgehoben.

Innerhalb einer Hervorhebung wird auf die Kursive verzichtet, um einen Textteil noch weiter hervorzugeben.

Bei serifenlosen Schriften kann auch fett hervorgehoben werden (bitte sparsam verwenden). Bitte nicht kursive und fette Auszeichnung kombinieren!

Bitte auf Unterstreichungen verzichten.

Tabellen Bearbeiten

Tabellen sollten keine vertikalen Linien enthalten.

Der Trennstrich zwischen den Spalten-Überschriften und der darunterliegenden Tabellenzeile kann weggelassen werden, wenn man an dieser Stelle den Zeilenabstand leicht vergrößert.

Die Ausführung einer Tabelle hängt vor allem von ihrem Inhalt und dem zur Verfügung stehenden Raum ab.

Zeile Bearbeiten

Zeilenabstand: Hängt von Schriftart und Schriftgrad ab.

  • Zeilenabstand: Abstand zwischen zwei Grundlinien.
  • Durchschuß: Abstand zwischen Unter- und Oberlänge.
  • Muß jeweils ermittelt werden. Es gibt keinen festen Zeilenabstand. Vorgaben in Textverarbeitungen („1- oder 11-zeilig“) nehmen keine Rücksicht auf die jeweilige Schrift.

„Ideale“ Zeilenlänge?

  • Lesbarkeitsforschung: Wie liest man? Nicht Wort für Wort: Saccaden.
  • Bei deutschen Texten: 50–70 Zeichen je Zeile.

Absatz Bearbeiten

Blocksatz oder Flattersatz?

Abstellen auf:

  • Kolumnenbreite
  • Laufweite der Schrift
  • Grauwert der Schriftfläche

Je enger die Kolumne und je größer die Laufweite der Schrift, desto schlechter ist der Grauwert beim Blocksatz.

Bei Flattersatz bitte die Silbentrennung aktivieren.

Schusterjungen und Hurenkinder Bearbeiten

 
Links ein „Schusterjunge“, rechts ein „Hurenkind“.

Eine einzelne Zeile die z.B am Anfang einer Seite bzw. Spalte steht, nennt man in der Typografie ein "Hurenkind". Ein Schusterjunge ist das Gegenteil von einem "Hurenkind" und bedeutet, dass am Ende einer Seite bzw einer Spalte eine einzelne Zeile steht.

Symbole Bearbeiten

Bei kleinen Formaten können statt Wörtern auch Symbole verwendet werden,um Platz zu sparen. Beispielsweise wird ✉ leicht als Anschrift erkannt.

Weitere:

  • ☏ = Telefon
  • 📱 = Mobil
  • ♿ = behindertengerecht

Symbole werden z.B. bei Visitenkarten [3] interessant, auf denen ohnehin wenig Platz vorhanden ist, um z.B. auch den Weißraum möglichst groß zu halten.

Seitenlayout Bearbeiten

Einige typographische Grundbegriffe:

  • Seite – Höhe, Breite des typographisch nutzbaren Raums
  • Satzspiegel – Raum zwischen „Seitenrändern“/Stegen, in den der Text gesetzt wird
  • Kolumne – eine Spalte des gesetzten Texts; der Satzspiegel kann mehrere Spalten enthalten
  • Zeile – so breit wie die Kolumne; bei einspaltigem Satz ist die Zeile so breit wie der Satzspiegel
  • Schrift – Schriftarten, Schnitte, Dickten, Schriftgrade, Laufweiten, Schriftfamilien . . .

Satzspiegel und Stege Bearbeiten

 
Satzspiegel und Stege.

Satzspiegelkonstruktion im Überblick Bearbeiten

Wie konstruiert man den Satzspiegel/die Ränder einer Seite?

  • Klassisch: Goldener Schnitt – im Verhältnis 2:3:5:8.
  • Modern: Gestaltungsraster und Grundlinienraster (Satzspiegel und Plazierung von Text und Bildern auf einer Seite).
  • Faustregel für DIN-Formate: 2:3:4:5 bzw. 3:3:3:5.
  • Trivial/Microsoft: Alle Ränder auf 2 od. 2,5 cm einstellen…

Erweiterung: Satzspiegel und Schrift Bearbeiten

Die Schrift soll den Satzspiegel vollständig ausfüllen.

Die Höhe des Satzspiegels hängt ab von:

  • der Satzspiegelkonstruktion,
  • der Schriftgröße (genauer: der „Versalhöhe“ der Schrift),
  • dem Zeilenabstand (bzw. dem „Durchschuß“)

Wie beschreibt man eine Schrift? Bearbeiten

 
Begriffe zur Beschreibung einer Schrift.

Beispiele Bearbeiten

Erneut: Wie beschreibt man eine Schrift? Bearbeiten

  • Schriftart: Garamond, Times, Helvetica . . .
  • Schriftform/-stil: Antiqua (mit normalen Serifen), Serifenlose/Grotesk, Egyptienne (mit betonten Serifen), Schreibschrift, dekorative Schrift, Fraktur.
  • Schriftfamilie: zusammengehörige Schriftarten und Schnitte.
  • Schriftschnitte: konkrete Ausformung, in der eine Schriftart als Font vorliegt (die Schriftart als solche; aber auch: gerade, kursiv, halbfett, fett . . . ).
  • Schriftstärke: mager, normal, halbfett, fett.
  • Schriftbreite/Laufweite: schmal, normal, breit.
  • Schriftlage: gerade, kursiv, ggf. auch: schräg.
  • Schriftgröße/Schriftgrad: 5–9, 10–12, ab 12 pt.

Exkurs: Schriften auf dem eigenen Rechner Bearbeiten

  • Installation von Schriften

Schriften einsetzen Bearbeiten

Wie sollte man Schriften einsetzen?

  • Empfehlungen der „Neuen Typographie“ (Jan Tschichold)
    • Möglichst wenige Schriftarten/Schnitte verwenden.
    • Kursiv und halbfett zur Schriftauszeichnung benutzen.
    • Versalien nur selten gebrauchen; wenn man sie verwendet, immer SPERREN.
  • Empfehlungen der „Schweizer Typographie“ (Max Bill, Adrian Frutiger)
    • Hauptsächlich Verwendung von Groteskschriften.
    • Möglichst wenige Schriftgrade.
    • „Extreme Weißräume“.
    • Gestaltungsraster. Sachliche Anordnung. Keine Schmuckelemente.

Empfehlungen:

  • Mengentext in der Brotschrift setzen. Möglichst eine Antiqua wählen.
  • Überschriften in einem größeren Schriftgrad als den Mengentext; halbfett absetzen; ggf. eine Grotesk.
  • Fußnoten, Marginalien und Bild-/Tabellenunterschriften in einem kleineren Schriftgrad als den Mengentext setzen.
  • Möglichst nur eine Schriftart verwenden.
  • Eher mehr Weißraum lassen. Text und Grafik nicht zu eng setzen.
  • Hervorhebungen kursiv oder halbfett.

Webtypografie Bearbeiten

Digitales Publizieren in Print und Online Bearbeiten

Einheitlichen Workflow vor Beginn des Projekts bedenken:

  • „Content“ eingeben…
  • …für Print…
  • …und weiter verarbeiten für Online…

Der Weg: Konvertieren, parallel verarbeiten…

Problem: Jede Konvertierung ist verlustbehaftet.

Lösung: Export aus Office-Paketen; Zusammenspiel von Anwendungen in der Adobe Creative Suite; HTML/XML-Konverter für LaTeX.

Hinweise zur Webtypographie Bearbeiten

Worauf sollte man vor allem achten?

  • Betriebssysteme und Webbrowser: Verschiedene Clients führen zu einer unterschiedlichen Ausgabe bei Layout, Farben, Auflösung, Fonts, Usability…
  • Detailtypographie auch hier beachten: Geschützte Leerzeichen, Striche, Anführungszeichen, Hervorheben von Text, Zeilenumbrüche . . .
  • Sonderzeichen escapen mithilfe von HTML-Entitäten; wenn möglich, Unicode einsetzen.
  • Auf Lesbarkeit achten: F-Muster beim Lesen im Web.
  • Standardlayouts von CMS vs. eigene Lösungen in CSS/Flash.
  • Möglichst zurückhaltender Einsatz von Schriften.
  • Eher serifenlose Schriftarten auswählen. Akzente bei Überschriften setzen.
  • Auf Usability und Barrierefreiheit achten.
  • Lokale Fonts vs. Webfonts.
  • Mathematische Formeln: Grafik vs. MathJax.

Literatur Bearbeiten

Vorschläge für praktische Übungen und Beispiele Bearbeiten

Aushang Bearbeiten

  • „Verkaufe: Für das Söhne Mannheims Konzert in der Hugenottenhalle am 13. Oktober habe ich 1 Eintrittskarte abzugeben. Bitte anrufen: 06102/123456 oder 0160/123456789.“
  • „Einladung zum öffentlichen Gastvortrag im Rahmen des Wikipedia-Schulprojekts: „Wikipedia im Unterricht – Chancen und Herausforderungen“ – Hans Maier, Wikimedia Deutschland e. V. – Di, 10. Mai 2011, 16 Uhr (s.t.), RW 1.“

Flyer Bearbeiten

  • „Einladung zum öffentlichen Gastvortrag im Rahmen des Wikipedia-Schulprojekts: „Wikipedia im Unterricht – Chancen und Herausforderungen“ – Hans Maier, Wikimedia Deutschland e. V. – Di, 10. Mai 2011, 16 Uhr (s.t.), RW 1.“
  • Kurs:Scribus – Einführung zu dem freien DTP-Programm Scribus; es wird gezeigt, wie man einen Flyer mit Scribus erstellt (2009)

Briefe und Bewerbungen Bearbeiten

Einzelnachweise Bearbeiten

  1. Erklärung zum Digitaldruck und dessen Vorteilen
  2. blog.flyerpilot.de
  3. Mikrotypografie auf Visitenkarten