(Mehr) Typografie in WordPress

Je nach gewählter Vorlage bietet WordPress meist nur begrenzte Möglichkeiten, beispielsweise Schriften an die persönlichen Vorlieben anzupassen. Falls überhaupt! Es gibt jedoch Werkzeuge, die die Grundeinstellungen für die Typografie in WordPress beträchtlich erweitern.

WordpressWordPress ist nach eigenen Angaben das am meisten verbreitete Content-Management-System (CMS). Dieser Aussage darf man durchaus Glauben schenken, wenn man sich einmal in die Welt der Blogosphäre begibt.

Standardmäßig bietet die Blog-Software, die sich übrigens keineswegs nur für reine Weblogs eignet, nur wenig bis keine Möglichkeiten, um die Typografie in WordPress an die persönlichen Vorlieben anzupassen. Schlecht typografierte Texte sind jedoch einer der häufigsten Gründe für den Ausstieg aus einer Website, während hingegen die Leserschaft bei einladenden, gut formatierten und typografisch aufbereiteten Texten länger verweilt.

Die typografische Optimierung fängt bei der Wahl der richtigen Schriftart und der Schriftgrößen an und hört bei Auszeichnungsschriften, Gliederungen, farblichen Hinterlegungen bis hin zu detaillierten Formen der Mikrotypografie, so z. B. bei Zeichenabständen, Leerräumen und Satzzeichen, oft nicht auf. Je nach gewähltem Theme (Layout-Vorlage) ist oft nur eine Schriftart möglich, von fehlenden Einstellungen der Feintypografie ganz zu schweigen. Es gibt jedoch eine Reihe von Plug-ins (Erweiterungen), mit denen sich die Typografie in WordPress beträchtlich erweitern lässt.

Die Typografie in WordPress anpassen

Eines der umfangreichsten Tools (Werkzeuge) auf diesem Gebiet ist WP Edit. Hiermit lässt sich die Bearbeitungsleiste des zum Schreiben von Beiträgen üblichen „Editor“ um zusätzliche Buttons (Schaltflächen) für typografische Funktionen erweitern.

Nach der Installation und der Aktivierung wechseln Sie dann zu Settings (Einstellungen), ziehen die gewünschten Schaltflächen einfach mit der Maus in die Bearbeitungsleiste und speichern abschließend Ihre Änderungen ab. Sobald Sie in den Editor wechseln, stehen Ihnen die neuen Funktionen zur Verfügung. Und diese lassen sich sehen: Schriftarten und -größen lassen sich nun frei wählen, Symbole in den Text einfügen und vieles mehr.

Farbliche Unterlegung, Zitate, Tabellen und Textbausteine

So können Sie eine bestimmte Textpassage als Zitat auszeichnen, für die Auszeichnung eine deutlich größere Schriftart wählen, den Text einrücken (was WordPress bei Zitaten allerdings sowieso automatisch ausführt) und farblich unterlegen. Eine weitere nützliche Funktion ist das Anlegen von Tabellen, wofür mit WP Edit ein Mausklick genügt. Wählen Sie einfach die Anzahl der Spalten und Zeilen, die Ihre Tabelle haben soll, und klicken auf „Einfügen“. So lassen sich auch (bestimmte Abschnitte der) Beiträge 2- oder mehrzeilig gestalten sowie farblich unterlegen.

Darüber hinaus bietet die Erweiterung unter „Extra Options“ die Möglichkeit, Textbausteine anzulegen, mittels derer Sie ganze Abschnitte inklusive einer individuellen typografischen Gestaltung anlegen können. Bei Bedarf sind diese schnell und einfach über die gewählte Tastenkombination in Ihre Beiträge eingefügt.

Sie sind mit der üblichen Darstellung von Zitaten weder in der WordPress-üblichen Art noch mit der durch WP Edit zufrieden? Nach der Installation und Aktivierung von Simple Pull Quote finden Sie einen zusätzlichen Button in der Bearbeitungsleiste Ihres Editors, mit dem Sie ausgewählte Textpassagen per Mausklick in ein grafisch aufbereitetes Zitat umwandeln können.

Mehr Schriften für WordPress

Vielen sind die mit der Layout-Vorlage des CMS ausgelieferten Schriften zu wenig und zu wenig anpassbar. Oft genug bringt das Theme nämlich nur eine mit und die lässt sich auch überhaupt nicht ändern! Mit der Erweiterung Google Typography lassen sich beispielsweise eine individuelle Überschriften-Schrift definieren und die CSS-Einstellungen des Themes dahingehend automatisch abändern.

Wesentlich umfangreicher und komfortabler als Google Typography ist jedoch Font Customizer. Nach der Installation und Aktivierung steht Ihnen ein Menü zur Verfügung, über das Sie praktisch alle verwendeten Textarten Ihres Themes individuell definieren können: (Unter-)Überschriften, Fließtexte, Links und ihre alternativen Darstellungen für Mouse-over-Effekte und mehr.

Feintypografie für WordPress

Für diejenigen, die im Hinblick auf die Mikrotypografie schon fortgeschrittener und ambitionierter sind, gibt es Web Typography Standards. Hiermit lassen sich Spationierung, Wort-, Wortabstands-Kerning, Laufweiten, Satzzeichen, Sonderzeichen und vieles mehr anpassen. Das Plug-In eröffnet ein weites Spektrum an detailtypografischen Möglichkeiten, sodass Ihre WordPress-Beiträge typografisch auch mit bibliophilen Druckausgaben mithalten können – vorausgesetzt, dass Sie über entsprechende Inhalte verfügen!

Code(-Schnipsel) einfügen

Manches Theme bietet eine integrierte Möglichkeit, Code(-Schnipsel) einzufügen, beispielsweise mittels der tags code und schließend /code, jeweils in eckigen Klammern gesetzt. Mittels pre und /pre lassen sich zwar auch längere Code-Abschnitte wiedergeben, eine farbliche Syntax-Auszeichnung ist jedoch nicht möglich (siehe im übernächsten Abschnitt). Hier hilft der Crayon Syntax Highlighter. Neben C/C#/C++, CoffeeScript, CSS, HTML (XML/XHTML), Java, JavaScript, PHP, Python und Ruby lassen sich noch weitere Syntaxen darstellen.

Schriften im Administratorenbereich

Gefällt Ihnen die Schrift im sogenannten Dashboard, dem Administratorenbereich, aus dem heraus Sie Ihre Installation inklusive aller Beiträge, Medien, Erweiterungen usw. verwalten, nicht? Nun, seit einer gewissen Version des CMS richtet sich diese nach der in Ihrem Browser eingestellten Standardschrift. Wenn Sie diese ändern wollen, müssen Sie das also in den Browser-Einstellungen ändern: In Mozilla Firefox Einstellungen öffnen und über den Unterpunkt „Inhalt“ bei „Schriftarten & Farben“, gegebenenfalls auch unter „Erweitert“, die Schrift anpassen.

Für Fortgeschrittene: style.css bearbeiten

Wenn Sie über eine selbst gehostete WordPress-Installation verfügen, haben Sie über den Administratorenbereich Zugriff auf die Datei style.css des gewählten Themes. Dort sind u. alle verwendeten Schriften aufgeführt. Bei einer Suche nach „font“ findet sich dort etwa

/* Base */
body {
	color: #333;
	font-family: 'Lora', serif;
	font-size: 17px;
	line-height: 1.6;
	word-wrap: break-word;
}

Die Schriftfamilie „Lora“ ist hier also die Standardschrift für das body-Element, also die Grundschrift. In der style.css finden sich im Weiteren natürlich auch alle anderen verwendeten Schriftarten, so für alle Überschriften usw.

Doch hier gilt äußerste Vorsicht: Anfänger sollten in der style.css keineswegs ohne zu wissen, was sie tun, herumschreiben!

Abschließende Hinweise für die Typografie in WordPress

Verfallen Sie ob der nun zahlreichen erweiterten Möglichkeiten nicht darauf, zu viele Schriftarten und -größen zu mischen und anderen typografischen Unfug anzustellen! Die Grundregeln sollten sein:

  1. Nie mehr als zwei Schriftarten!
  2. Nicht zwei Schriften gleichen Typs mischen, also zwei verschiedene serifenlose Schriften oder zwei Serifenschriften!
  3. Nie mehr als drei oder höchstens vier Schriftgrößen!
  4. Bleiben Sie lesbar, also beispielsweise keine zu kleine Schrift wählen oder
  5. keine Negativschriften verwenden, also etwa weiße Schrift auf schwarzem Grund!
  6. Wählen Sie bei dieser Gelegenheit auch keinen zu dunklen Hintergrund!
  7. Seien Sie sehr (!) vorsichtig mit Comic Sans, falls Sie sie überhaupt verwenden wollen!
  8. Überladen Sie Ihr Weblog nicht, weder mit zu vielen Bildern noch mit zu viel Text, es sei denn Sie sind Fotograf oder Fachautor!
  9. Achten Sie auf Weißräume, also auf genügend Flächen, die nicht mit Bildern oder Text beladen sind!
  10. Bei Zweifeln und Fragen: Lassen Sie sich beraten! Und eine
  11. Regel findet sich sicherlich leicht. Schreiben Sie in einem Kommentar, welche Sie noch aufstellen würden oder welche Erweiterung für die Typografie in WordPress Sie hier vermissen, aber empfehlen möchten!

Und nun viel Spaß beim Bloggen. Auf die Frage, wie Sie gute Inhalte schreiben, haben Sie hoffentlich auch Antworten (im WWW gefunden), denn gute Inhalte sind mindestens ebenso wichtig wie die Typografie in WordPress!

Weitere Verweise

Ronald M. Filkas
Gelernter Schriftsetzer im Handsatz, Studium der Germanistik, zertifiziert abgeschlossene Fortbildungen „Web-Publishing Schwerpunkt DTP“ und Online-Redaktion, langjährige Erfahrungen als Schriftsetzer/ DTP-Fachkraft und als Korrektor und Lektor in Druckereien, Redaktionen und Verlagen. Mehr? Seite „Über mich“!

Hinterlasse einen Kommentar.

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.