Webtypografie

Die Webtypografie bezeichnet die bei der Webgestaltung relevanten Teile der Typografie und ihre spezielle Anwendung im Web, insbesondere die zu beachtenden Regeln bei der Verwendung einzelner Zeichen in HTML-Dokumenten. Sie gehört zu den Grundkenntnissen von Webgestaltern.

Auszeichnungsarten

Wie auch in anderen Medien, gibt es auch im Web mehrere Möglichkeiten der Texthervorhebung, die als Auszeichnungsarten bezeichnet werden. Man unterscheidet im Web zwischen logischen und physischen Auszeichnungsarten. Auch wenn Elemente dafür existieren, hat physische Textauszeichnung in Textauszeichnungssprachen spätestens seit der Einführung von CSS keinen Platz mehr (insbesondere sollten statt des i- das em-Element und statt b besser strong verwendet werden). Nachfolgend sind daher nur die logischen Auszeichnungsarten in HTML aufgelistet:

• Abkürzungen werden mittels abbr-Element ausgezeichnet.
• Akronyme werden mittels acronym-Element ausgezeichnet.
• Beispiele werden mittels samp-Element ausgezeichnet.
• Definitionen werden mittels dfn-Element ausgezeichnet.
• Betonung wird mittels em-Element ausgezeichnet.
• Starke Betonung wird mittels strong-Element ausgezeichnet.
• Quelltext wird mittels code-Element ausgezeichnet.
• Tastatureingaben werden mittels kbd-Element ausgezeichnet.
• Variablen werden mittels var-Element ausgezeichnet.
• Zitate werden mittels q-Element ausgezeichnet.
• Längere Zitate werden mittels blockquote-Element ausgezeichnet.
• Quellenangaben werden mittels cite-Element ausgezeichnet.

zum Thema Zitate s. a. Abschnitt Anführungszeichen

Darüber hinaus gibt es weitere Elemente. Je nach Benutzereinstellungen, Plattform, Webbrowser, Schriftarten usw. werden ausgezeichnete Bereiche unterschiedlich dargestellt. Während HTML nicht dafür missbraucht werden sollte, darauf Einfluss zu nehmen (insbesondere veraltete Elemente aus der Zeit vor Cascading Style Sheets (CSS) wie font sollten nicht mehr verwendet werden), besteht die Möglichkeit, eine Veränderung der Gestalt mittels CSS herbeizuführen.

Anführungszeichen

Besonders bei den Anführungszeichen werden häufig Fehler gemacht. Hier eine Auflistung zur korrekten Verwendung verschiedener Anführungszeichen, wobei beliebte Fehlerquellen hervorgehoben sind. Leerzeichen sind im Ergebnis der Übersicht halber mit einem Unterstrich hervorgehoben:

Einfache Anführungszeichen werden normalerweise nur innerhalb bereits in Anführungszeichen stehender Bereiche verwendet.

Anführungszeichen werden für Zitate verwendet oder um einzelne Wörter als ironisch zu markieren. Sie werden jedoch nicht zur Betonung verwendet. Auch dies wird oft falsch gemacht. Zur Betonung eignen sich stattdessen die Elemente em und strong.

Die korrekte Verwendung von Anführungszeichen wird von CSS2 durch die quotes-Eigenschaft unterstützt, welche aber nur von aktuellen Browsern ausgewertet wird: W3C Recommendation CSS2, quotes.

Striche

Auch Striche werden oft verwechselt. Insbesondere wird der Bindestrich, der sich auf der Tastatur neben der rechten Umschalttaste befindet, für alle möglichen Striche missbraucht.

Sonstiges

Statt der Entität   wäre in den folgenden Beispielen wohl   treffender, weil schmaler, doch leider wird dies von den meisten Browsern nicht korrekt dargestellt. Daher hat sich in der Webtypografie   durchgesetzt. Leider haben auch manche Browser mit − noch Probleme, sodass dafür häufig der Bindestrich verwendet wird.

Siehe auch: Plenk

Weblinks

• typemotion: Typo-Basics, diverse PDF-Anleitungen zum Thema
• Duden: Regeln für die Textverarbeitung (PDF)
• Typographie für Webautoren
• Typolexikon.de
• W3C Recommendation CSS2