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 Webdesignern und basiert in Deutschland auf der DIN 5008.
 

Auszeichnungsarten

Wie auch in anderen Medien, gibt es auch im Web mehrere Möglichkeiten der Texthervorhebung, die als Auszeich-nungsarten bezeichnet werden. Man unterscheidet im Web zwischen logischen und physischen Auszeichnungsarten.
Auch wenn Elemente dafür existieren, hat physische Textauszeichnung in Auszeichnungssprachen 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 Aus- zeichnungsarten in HTML aufgelistet:

 

  • Abkürzungen werden mittels abbr-Element ausgezeichnet.
  • Akronyme werden mittels acronym-Element ausgezeichnet (ab XHTML 2.0 ersetzt durch das abbr-Element).
  • Beispiele werden mittels samp-Element ausgezeichnet.
  • Definitionen des umgebenden Elements werden mittels dfn-Element ausgezeichnet.
  • Betonung wird mittels em-Element ausgezeichnet.
  • Starke Betonung wird mittels strong-Element ausgezeichnet.
  • Quelltext wird mittels code-Element ausgezeichnet (ab XHTML 2.0 längere Quelltextabschnitte auch mit dem blockcode-Element).
  • Tastatureingaben werden mittels kbd-Element ausgezeichnet.
  • Variablen werden mittels var-Element ausgezeichnet.
  • Zitate werden mittels q-Element ausgezeichnet (ab XHTML 2.0 ersetzt durch das quote-Element).
  • Längere Zitate werden mittels blockquote-Element ausgezeichnet.
  • Quellenangaben werden mittels cite-Element ausgezeichnet. 
 
Zum Thema Zitate siehe auch Abschnitt Anführungszeichen.

 

Darüber hinaus gibt es weitere Elemente. Je nach Benutzer-einstellungen, 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

Üblicherweise werden Anführungszeichen in zwei Fällen angewendet:
  1. Zur Darstellung wörtlicher Rede.
  2. Zur Hervorhebung von Ironie.
Unüblich hingegen ist es, Betonungen oder Titel von Büchern, Liedern etc. durch Anführungszeichen darzustellen. Hierfür sollte vielmehr eine betonte Darstellung verwendet werden
(s. o.). Bei der Anwendung von Anführungszeichen werden häufig Fehler gemacht.
 
Der deutsche Gedankenstrich (Halbgeviertstrich) lässt sich –
bei Verwendung der richtigen Kodierung – unter Windows auch bei gedrückter Alt-Taste und Eingabe der Tastenfolge „0, 1, 5, 0“ auf dem Nummernblock (!) erzeugen, unter Mac OS X durch gleichzeitiges Drücken der Alt-Taste und der Bindestrich-Taste. Bei vielen MS-Windows-Programmen funktioniert auch die Kombination Strg-Taste und das „–“ aus dem Nummernblock.
Bei nicht-proportionalen Schriftarten, zum Beispiel Courier oder bei alten Schreibmaschinen, empfehlen Typografen um den Bindestrich (Mittelstrich) Leerzeichen zu setzen.
 

Leerzeichen

Häufig will man einen Umbruch durch ein Leerzeichen ver-meiden. Jedoch sieht es meist nicht gut aus, wenn z.B. in mehrteiligen Abkürzungen ein Zeilenumbruch erfolgt. Daher verwendet man hier das geschützte Leerzeichen.
Anstelle des normalen geschützten Leerzeichens ( )
wäre in den folgenden Beispielen teilweise ein schmales geschütztes Leerzeichen ( ) treffender, dies wird 
jedoch von vielen Browsern noch nicht unterstützt. Auch mit dem − (−) haben manche Browser Probleme, so dass hierfür zumeist der Bindestrich verwendet wird.
 
Für mehrteilige Abkürzungen eignen sich jedoch auch Formatierungen mit CSS, die einen direkten Einfluss auf den Zeilenumbruch von Abkürzungen und die Breite des Leer-zeichens haben. Beispielsweise lässt sich das abbr-Element global formatieren. Im aktuellen Internet Explorer funktioniert dies zwar nicht, wird dort jedoch anders als die Verwendung von   nicht als störend empfunden. Zudem lässt sich so die Bedeutung einer Abkürzung über das title-Attribut hinter-legen und ggf. formatieren.
Beispiel: <abbr title="zum Beispiel" style="white-space:nowrap; word-spacing:-0.1em;">z. B.</abbr>.
Einen vergleichbaren Effekt kann man auch für Maßangaben in Verbindung mit span erzielen.
 

Auslassungspunkte/Ellipse

Auslassungspunkte werden üblicherweise mit der Ellipse (…) dargestellt. Diese wird mit der Entitätenreferenz &hellip; (&#8230;) dargestellt. Vor ihr steht ein Leerzeichen, wenn das vorhergehende Wort beendet wurde. Wird nur ein Teilwort (z. B. „Teilw…“) abgetrennt, so steht davor hingegen kein Leerzeichen.
 
http://www.typolexikon.de
 

[ zurück ] []    



Produktinformation
Alle Informationen zu
Produkten, Schulung
und Terminen.

 

News
  • 01.10.2011
    Die elat Version 11.4. ist offiziell verfügbar

    Wenig sichtbares, aber viele strukturelle Änderungen sind im neuen elat umgesetzt. » mehr
  • 15.09.2011
    Vortrag auf der 11. Jahrestagung der AAL am 23.9. in Rostock

    Die mediaface stellt sich und die QM-Software vor. » mehr
  • 01.07.2011
    Die elat Version 11.3. ist verfügbar

    Mit der Auslieferung der Arztsystem-Updates steht die Q3-Version von elat zur Verfügung. » mehr
  • 28.06.2011
    Das bessere Facebook: Google+ ist online

    Nur ein weiteres Soziales Netzwerk? Mit "Circles" und anderen neuen Funktionen zeigt Google, dass die Entwicklung von "social media" erst am Anfang steht. » mehr
« zurück vor »
Kontakt
mediaface GmbH
Oberhafenstraße 1
20097 Hamburg

Tel: 040 - 72 73 93 0
Fax: 040 - 72 73 93 33
info@mediaface.de