Inhaltsverzeichnis (überspringen)

Typographie für Webautoren

Ich fand das einfache Schreibmaschinen-Anführungszeichen (") schon immer hässlich und gerademal für Programmiersprachen und Festbreitenschriften akzeptabel. Deswegen habe ich mich mal eingehender mit den entsprechenden Typographie-Regeln befasst und sie hier zusammengetragen. Und mal ehrlich, unterschiedliche Zeichen am Beginn und Ende einer wörtlichen Rede sehen besser aus und erleichtern außerdem das Lesen – nicht ohne Grund lernt man in der Schule Gänsefüßchen unten () und oben () kennen.

Nichtsdestotrotz bin ich auf dem Gebiet lediglich interessierter Laie; wem Fehler auffallen, möge mir das also bitte mitteilen, ich beiße nicht. Dass einige Zeichen nicht, als Fragezeichen oder leerer Kasten dargestellt werden, liegt i. d. R. nicht an mir, sondern entweder am Browser oder der verwendeten Schriftart.

Ich beschränke mich trotz gelegentlicher Bemerkungen zu anderen Ländern und Sprachen auf die in Deutschland übliche deutsche Typographie. Inwiefern unsere Nachbarn in den Alpen davon abweichen bleibt größtenteils noch nachzuforschen.

Es ist wirklich nicht viel Aufwand, die wichtigsten der seit vielen Jahren im Printbereich gängigen Zeichenregeln auch im Web anzuwenden. Bitte helft, das WWW lesbarer zu gestalten!

Anführungszeichen und Apostroph

Übersicht existierender Unicode-Zeichen
Name Unicode Dezimal Hexa­dezimal benannt
deutschenglisch
Manche Editoren und vor allem Textverarbeitungen stellen zusätzliche Tastenkombinationen zur einfacheren Eingabe zur Verfügung, dazu verweise ich allerdings auf die jeweilige Dokumentation.
Anführungszeichenquotation mark U+0022" "" "" ""
Apostrophapostrophe U+0027' '' '' ' nur in X[HT]ML
Gravis (Accent grace)grave accent (spacing grave) U+0060` `` ``
Akut (Accent aigu)acute accent (spacing acute) U+00B4´ ´´ ´´ ´´
einfaches linkes Anführungszeichenleft single quotation mark U+2018' ‘ ‘ ‘
einfaches rechtes Anführungszeichenright single quotation mark U+2019' ’ ’ ’
einfaches Anführungszeichen untensingle low-9 quotation mark U+201A, ‚ ‚ ‚
einfaches umgekehrtes Anführungszeichen oben U+201B' ‛ ‛
doppeltes linkes Anführungszeichenleft double quotation mark U+201C" “ “ “
doppeltes rechtes Anführungszeichenright double quotation mark U+201D" ” ” ”
doppeltes Anführungszeichen untendouble low-9 quotation mark U+201E" „ „ „
einfaches gerades Anführungszeichen U+2032' ′ ′
doppeltes gerades Anführungszeichen U+2033' ″ ″
einfaches spitzes Anführungszeichen nach linkssingle left-pointing angle quotation mark U+2039< &#8249; &#x2039; &lsaquo;
einfaches spitzes Anführungszeichen nach rechtssingle right-pointing angle quotation mark U+203A> &#8250; &#x203A; &rsaquo;
doppeltes spitzes Anführungszeichen nach linksleft-pointing double angle quotation mark (left pointing guillemotleft) U+00AB« &#171;« &#x00AB;« &laquo;«
doppeltes spitzes Anführungszeichen nach rechtsright-pointing double angle quotation mark (right pointing guillemet) U+00BB» &#187;» &#x00BB;» &raquo;»

Grundlagen

In der deutschen Typographie gibt es zwei Varianten von doppelten Anführungszeichen: normale (Zitat) und spitze (»Zitat«). Erstere werden auch Gänsefüßchen, Gänseäuglein oder Hasenöhrchen, letztere Guillemets oder französische Anführungszeichen genannt. Beide existieren auch in einer kürzeren Version, den halben Anführungszeichen: Zitat und Zitat. Diese einfachen Anführungszeichen werden bei Eigennamen oder Begriffsdefinitionen und in verschachtelten Zitaten eingesetzt, d. h. wenn bereits ein doppeltes Zeichen vorausging; die beiden Typen sollten dabei nicht vermischt werden: Zitat: Zitat‘“ und »Zitat: Zitat‹«.

Vorschau: » «, › ‹, „ “, ‚ ‘.

Die sehen ja alle gleich aus!

Bei den normalen Anführungszeichen gibt es eine Eselsbrücke, die richtigen auszuwählen: 99-66 bzw. 9-6 – Besonders in großen Schriftgraden von Serifenschriften zeigen die Anführungszeichen die charakteristischen Formen eben jener beiden Ziffern. Im angelsächsischen Raum ist es genau andersrum, nämlich 66-99 bzw. 6-9 (Quote: Quote’”), allerdings ist hier bekanntlich das einleitende Zeichen nicht unten, sondern oben. Daraus resultiert auch die Merkwürdigkeit bei benannten Entities: &raquo; und &rsaquo; stehen anders als das r vermuten ließe immer links, während &laquo;, &lsaquo;, &ldquo; und &lsquo; trotz des ls immer rechts stehen; die links stehenden &bdquo; und &sbquo; werden im Englischen ja nicht benötigt, deswegen heißt es wohl auch nicht &bsquo;, wie man vielleicht erwarten würde.

Andere Länder bzw. Sprachen mit römischem oder kyrillischem Basisalphabet haben wiederum andere Konventionen für Guillemets. Die beste mir bekannte Übersicht dazu liefert die Wikipedia, insbesondere die englische Version.

Mir muss ja nicht alles gefallen

Leider gibt es einige Schriften – darunter ausgerechnet einige ziemlich populäre von Microsoft: Comic Sans MS, Tahoma, Verdana und Courier New sowie ältere Versionen von Trebuchet MS – bei denen das schließende Anführungszeichen – auch das halbe – falsch herum ist. Es zeigt nicht von links-unten nach rechts-oben, sondern von links-oben nach rechts-unten, liegt also nicht in einer Diagonalen mit dem öffnenden Anführungszeichen, wie es für ein ruhiges Schriftbild wünschenswert ist. Das gewünschte Ergebnis ergäbe sich mit diesen Schriften bei Verwendung von 99-Oben, also wie im Niederländischen.

„Comic Sans MS“ „Comic Sans MS”, „Tahoma“ „Tahoma”, „Verdana“ „Verdana” und „Courier New“ „Courier New”. „Trebuchet MS“ „Trebuchet MS”. „Times“ „Times”, „Arial“ „Arial”.

Von Schweizern und anderen Franzosen

Gelegentlich kommt die Frage auf, in welcher Reihenfolge die Guillemets zu verwenden sind, logisch sei ja die umgekehrte Reihenfolge als die hier bisher gezeigte, zumindest, wenn man die Zeichen mit Klammern vergleicht. Die Franzosen, die Schweizer u. a. sehen das genau so und schreiben daher «Citation: Citation›». Die Deutschen und Österreicher haben sich aber für die entgegengesetzte Variante entschieden. Ich denke, an diese Konvention kann man sich ruhigen Gewissens halten, Verstöße dagegen wiegen angesichts dessen, was einige Verlags- und Zeitungshäuser im WWW abliefern nicht gar so schwer.

Gänsefüße oder Klammern?

Soll man nun aber lieber spitze oder normale Anführungszeichen verwenden? Nun, das muss jeder für sich selbst entscheiden; im deutschen Sprachraum sind beide Varianten verbreitet, obgleich die Klammern in der handgeschriebenen Schrift fast nie vorkommen, sondern nur in der gedruckten. Die spitzen Klammern haben den Vorteil, dass sie zwar nicht im ASCII-Zeichensatz wohl aber in einigen seiner auf 8 Bit und damit 256 Zeichen vergrößerten Nachfahren, etwa ISO-8859-X, Windows-125X und Mac-Latin, vorkommen. Einer Verwendung z. B. im Usenet und in E-Mails steht somit auch wenig entgegen, die richtige Codierung des Body vorausgesetzt.

Irgendwo habe ich auch mal aufgeschnappt, dass die Gänsefüßchen vor allem im Zeitungswesen, die spitzen hingegen eher im Buchdruck eine Vormachtstellung genießen. Verifiziert habe ich das nicht, subjektiv betrachtet scheint da aber tatsächlich etwas dran zu sein. duden.de benutzt übrigens die spitze Variante.

Falsche Freunde

Das gemeine Anführungszeichen (") und der Apostroph (') sind im Deutschen unnötig, bzw. ersteres i. d. R. sogar falsch. Sie werden in der Hauptsache für Quelltexte gebraucht, da sie in praktisch jeder Computersprache zur Auszeichnung von Strings benutzt werden.

Es werden oft Zeichen mit anderen verwechselt. Zum einen geschieht dies aus Bequemlichkeit, weil es einfacher ist, ein mit eigener beschrifteten Taste versehendes Zeichen einzugeben als Tastenkombinationen auswendig zu lernen oder sich durch verschiedene Menüs oder Programme zu kämpfen. Zum anderen wird dies dadurch gefördert, dass in Texteditoren üblicherweise Festbreitenschriftarten zum Einsatz kommen, bei denen in der Tat teilweise keine optischen Unterschiede vorhanden sind. So sieht das Komma (,) genauso aus wie das einfache Anführungszeichen unten (), die Akzente (` und ´) sind aber eigentlich deutlich von den ähnlichen einfachen Anführungszeichen oben (‘ und ’) unterscheidbar. Gleiches gilt für die spitzen Klammern, bzw. Kleiner-Als- und Größer-Als-Zeichen (< und >), die schon mal fälschlicherweise als Anführungszeichen herhalten müssen, sogar verdoppelt und natürlich auch invertiert: >>Zitat<<, >Zitat<, <<Zitat>>, <Zitat>. Ganz falsch ist natürlich die aus TEX, Shell-Scripts und man-Pages stammende Methode mit Accent Grave und Apostroph (sowohl doppelt als auch einfach kommen vor): ``Zitat'' bzw. `Zitat'.

Automatische Anführungszeichen

Das Eintippen von Entities oder nummerischen Zeichenreferenzen ist auf die Dauer recht aufwändig, glücklicherweise ist es in HTML meist gar nicht nötig, da mit q und blockquote bereits zwei Elemente für die Auszeichnung von Zitaten existieren. Manch einer will vielleicht auch Definitionen in Anführungszeichen setzen, dafür ist dfn vorgesehen. Auch Eigennamen, die man meist gut mit cite auszeichnen kann, verdienen u. U. Anführungszeichen, wann genau, erklärt der Duden bzw. im Regelwerk §94(1).

Leider unterstützt der zurzeit am häufigsten eingesetzte Browser, der Internet Explorer von Microsoft, weder das q-Element direkt noch die nachfolgend vorgestellten CSS-Techniken zur Anpassung der automatisch gesetzten Anführungszeichen, weshalb es empfehlenswert ist, q zusätzlich eine bestimmte Farbkombination oder einen besonderen Schriftschnitt zuzuteilen.

Dem W3C zufolge wäre folgende Methode korrekt:

:lang(de)>q      {quotes: "»" "«" "" ""}
:lang(de-de)>q   {quotes: "" "" "" ""}
:lang(en)>q      {quotes: "" "" "" ""}
:lang(fr)>q      {quotes: "«" "»" "" ""}

Die Zeichen werden dabei als Werte der quotes-Eigenschaft jeweils in Zweierpaaren von links nach rechts angegeben; das zweite Paar soll in der zweiten Verschachtelungsebene benutzt werden usw. Leider wird :lang() bisher nicht von den Browsern unterstützt, weshalb etwas Bastelarbeit von Nöten ist:

[lang|="de"]>*   {quotes: "»" "«" "" ""}
[lang="de-de"]>* {quotes: "" "" "" ""}
[lang|="en"]>*   {quotes: "" "" "" ""}
[lang|="fr"]>*   {quotes: "«" "»" "" ""}

Bei Verwendung von UTF-8, sollte man das CSS mit @charset "UTF-8" und möglichst ohne BOM beginnen. Wer seine CSS-Dateien nicht als UTF-8 abspeichert, sollte die Zeichen escapen, was mit dem Backslash \ plus Hex-Wert geschieht: "" schreibt sich also bspw. als "\203A".

Es bleibt nur noch das Problem, dass Opera sich ab einer gewissen Tiefe verschluckt und das Abführungszeichen falsch wählt. Mozilla/Netscape benutzt nur die Quotes der ersten Ebene, falls jemand einen funktionierenden Workaround gefunden hat, möge er mir das bitte mitteilen.

Schlussendlich müssen die Zeichen noch den gewünschten Elementen mittles der Pseudo-Elemente :before und :after und der content-Eigenschaft zugewiesen werden:

q:before, blockquote:before {content:  open-quote}
q:after,  blockquote:after  {content: close-quote}

Will man, wie teilweise üblich, die Quotes in einer anderen Farbe als den sonstigen Fließtext habe, so geht das natürlich ganz einfach durch wie sonst auch durch Einfügen einer color-Regel: q:before, q:after {color: maroon}

Für mehrzeilige Zitate mit blockquote gibt es in verschiedenen Sprachen auch extra Regeln, welche spezielle Behandlung erfordern.

Browser sollen die korrekten Anführungszeichen nach der Textsprache auswählen, welche mit dem lang- bzw. xml:lang-Attribut angegeben wird. Dabei ist ein Verschachteln ausdrücklich erlaubt.

Der Deutsche: Europäische Union und Wilhelm der Eroberer, aber der Engländer: European Union and William the Conqueror, but the French: l’Union européenne et Guillaume le Conquérant.

Apostroph

Das Zeichen U+0027 (') heißt zwar apostrophe bzw. Apostroph, typographisch gesehen ist er das aber eigentlich nicht, denn der Apostroph alias Hochkomma, sollte gebogen sein. Der Fall liegt also ähnlich wie beim »Shift-2«-Anführungszeichen. U+2019; bzw. &rsquo; () trifft es da schon eher. Im Deutschen ist dessen Einsatz ja auch problemlos möglich, da das Zeichen nicht als Anführungszeichen gebraucht wird.

Leider hat der Einsatz des Apostrophs in deutschen Medien, auf Schildern und sogar in handschriftlichen Texten inflationäre Ausmaße angenommen. Eine regelrechte Seuche, mindestens ebenso schlimm wie »Standart«, »Packet«, »Author« und »garnicht«. Fast alle Verwendungen sind allerdings grundlegend falsch, viele nicht mal im Englischen, das hier wohl wieder mal als schlechtes Vorbild dient, erlaubt.

Vor dem Genitiv-S steht im Deutschen traditionell kein Apostroph, allerdings würden ganz ohne Doppeldeutigkeiten vorkommen: Andreas Bruder heißt Andreas – Andreas’ Schwester heißt Andrea. Nach Genitiven von auf einen S-Laut (-s, , -x, -z, -ce, egal ob im Nominativ auch als »s« ausgesprochen) endenden Wörtern steht ein Apostroph statt eines s. Neuerdings wird leider – bei Ambiguitäten – auch die umgekehrte Version hingenommen: Andrea’s Bruder heißt Andreas.

Das Plural-S hingegen wird nie mit einem Hochkomma abgetrennt, auch nicht bei Akronymen: CDs.

Werden einzelne Buchstaben ausgelassen oder Wörter zusammengezogen (vor allem in der Umgangssprache üblich), kann ein Apostroph diese ersetzen, vor allem um die Lesbarkeit und Verständlichkeit zu verbessern: Ich find’s aber nich’ gut. So ists doch auch lesbar. In der Lyrik entfällt manchmal das Präterium-E, wodurch es zu zum Präsens identischen Verbformen kommen kann, dann ist eine entsprechende Kennzeichnung unerlässlich: Er sucht’ und fand. Beim Auslassen ganzer Wortbestandteile hingegen muss er dabei sein: K’lautern. Das »Adjektivierungssuffix« sche bzw. scher darf ebenfalls solcherart abgetrennt werden: Euler’sche Zahl ℇ

In der Schweiz ist der Apostroph das übliche Tausendertrennzeichen bei Zahlen: 400’000.00 CHF.

Es regt sich glücklicherweise Widerstand gegen die falsche, oft einfach dumme Verwendung des Apostrophs. Hoffen wir, dass er mittelfristig bei den Toren nicht auf taube Ohren stößt:

Übrigens: Es heißt »das Apostroph«, jedoch gehe ich davon aus, dass in absehbarer Zeit auch »der Apostroph« offiziell akzeptiert wird, da das Wort maskulin meinen Beobachtungen zufolge mindestens genauso geläufig ist wie neutral.

Waagerechte Striche

Übersicht existierender Unicode-Zeichen
Name Unicode Dezimal Hexadezimal benannt
deutschenglisch
Manche Editoren und vor allem Textverarbeitungen stellen Tastenkombinationen zur einfacheren Eingabe zur Verfügung, dazu verweise ich allerdings auf die jeweilige Dokumentation.
Bindestrich-Minus U+002D- &#45;- &#x002D;-
Weicher Bindestrichsoft hyphen = discretionary hyphen U+00AD­ &#173;­ &#x00AD;­ &shy;­
Bindestrich, Viertelgeviertstrichhyphen U+2010- &#8208; &#x2010;
geschützter Bindestrich (kein Zeilenumbruch)non-breaking hyphen U+2011- &#8209; &#x2011;
figure dash U+2012-- &#8210; &#x2012;
Gedankenstrich, Bindestrich, Halbgeviertstrichen dash U+2013-- &#8211; &#x2013; &ndash;
Gedankenstrich, Geviertstrichem dash U+2014--- &#8212; &#x2014; &mdash;
Horizontale Liniehorizontal bar, quotation dash U+2015- &#8213; &#x2015;
Bindestrich-Aufzählungszeichen U+2043- &#8259; &#x2043;
Minuszeichenminus sign U+2212- &#8722; &#x2212; &minus;
Macron[spacing] macron = overline = APL overbar U+00AF¯ &#175;¯ &#x00AF;¯ &macr;¯
Überstrichoverline = spacing overscore U+203E¯ &#8254; &#x203E; &oline;
Unterstrichunderscore U+005F_ &#95;_ &#x005F;_

Geviert

Ein Geviert ist ein gedachtes Quadrat, das so breit ist wie zwei (Tabellen-)Nullen nebeneinander. Ein solches Geviert ist hier zu sehen, die unterschiedlichen Striche sind eingezeichnet:

'—', '–', '-', '−'.

Ein Geviert (englisch: quad oder em) wird allerdings manchmal auch als Breite des großen Ms oder einfach – wie die Einheit em in CSS – als die Schrifthöhe definiert.

Die ursprünglichste Definition leitet sich wohl aus der vertikalen Höhe des Bleiletters im Buchdruck ab. Das ist aufgrund des Fleisches immer mehr als selbst der größte Buchstabe einnimmt, aber das interessiert einen Webdesigner wohl nicht.

Letztlich brauchen sich wohl nur die Entwerfer von Schriften darum tiefer gehende Gedanken machen.

Bindestrich

Der Bindestrich, bzw. Bindestrich-Minus (-), verbindet Wörter und andere Zeichen zu Komposita. Es ist der Strich, der gleich zweimal auf der Tastatur zu finden ist, nämlich neben der rechten Umschalt-Taste und im Num-Block. Weitere Beispiele: 2-achsiger Wagen, 486er-Prozessor, €-Symbol, Frau Däubler-Gmelin. Die nicht unkomplexen Regeln zur Verwendung erläutert der Duden.

Auslassungsstrich, Ergänzungsstrich

Bei Auzählungen, wie Binde-, Trenn- und Gedankenstrich, mit einem identischem Wortbestandteil wird dieser oft durch einen Strich abgekürzt und nur im letzten bzw. ersten, Web-Designer und -Autor, Wort aufgeführt. Die Groß- / Kleinschreibung bleibt dabei die selbe wie beim zusammen geschriebenen Wort. Die genauen Regeln stehen im Duden.

Das Zeichen ist auch hier das Bindestrich-Minus. Richtiger wäre allerdings der geschützte Bindestrich (), der das Abtrennen eines führenden Bindestrichs am Zeilenende verhindert; er ist aber in kaum einer Schriftart vorhanden und wird auch durch keine benannte Entity bezeichnet.

Trennungsstrich

Der Trennungs- oder genauer: bedingte Trennungsstrich sieht genauso aus wie der Bindestrich, allerdings nur, wenn er überhaupt sichtbar ist. Er erscheint nämlich ausschließlich bei Silbentrennung am Zeilenende.

Da bisher kein Browser eine automatische Silbentrennung durchführt, kann man in HTML »Sollbruchstellen« durch ein explizites Einfügen dieses Zeichens, z. B. durch &shy;, erzeugen. Das sollte man allerdings nur in begrenztem Umfang, etwa in Tabellenzellen mit sehr langen Wörtern, tun, da einerseits manche Browser den Strich doch immer anzeigen und andererseits der Code ansonsten unnötig aufgebläht werden würde.

Gedankenstrich

Anders als im Englischen gibt es im Deutschen nur eine Art Gedankenstrich (, Verwendung laut Duden). Es ist der kürzere der beiden mit der Breite eines großen Ns, der längere wäre M breit. Aus dieser Dimensionierung ergibt sich auch die englische und HTML Bezeichnung (en dash und em dash bzw. &ndash; und &mdash;).

Im Deutschen stehen links und rechts neben einem Gedankenstrich Leerzeichen. In der Drucktypographie können sie auch kleiner als die normalen Wortzwischenräume sein, aber das ist im Web nicht praktikabel.

Es ist empfehlenswert, den Gedankenstrich mit einem Dauerleerzeichen an das vorhergehende Wort zu binden, damit er nicht am Zeilenanfang zu stehen kommt. Wird ein Gedanke – so einer hier &ndash von zwei Gedankenstrichen umklammert, kann man sich auch dafür entscheiden, ein festes Leerzeichen rechts neben den ersten und eines links neben den zweiten Strich zu setzen.

»bis«-Strich

Um Zahlenbereiche, z. B. bei Buchseiten, anzugeben, steht zwischen Anfangs- und Endwert oft ein waagerechter Strich mit der Bedeutung »bis«. Auch hier kommt der »en dash« allerdings ohne umschließende Leerzeichen zum Einsatz (1–17).

Bei Entfernungsangaben kommt der gleiche Strich zum Einsatz, allerdings flankiert von Leerzeichen: Hamburg – Berlin.

»gegen«-Strich

Genauso wie der »bis«-Strich wird auch der vor allem im Sportbereich gebräuchliche »gegen«-Strich durch einen leerzeichenfreien Halbgeviertstrich geschrieben (Deutschland–Ungarn 3:2).

Datumstrennstrich

Das internationale Standardformat für Datumsangaben (ISO 8601:2000, DIN EN 28601, DIN 5008) ist JJJJ-MM-TT, JJJJ-WWW-T bzw. JJJJ-TTT, wobei die Datumstrennstriche optional sind, sie aber vor allem dann stehen sollten, wenn einer oder zwei der Datumsbestandteile wegfallen.

Bisher habe ich noch keine genaue Angabe über das zu verwendende Strichzeichen gefunden. Vermutlich ist zwar der einfache Bindestrich korrekt (2002-06-22), aber um Zeilenumbrüche innerhalb des Datums zu vermeiden, empfiehlt sich eher der genauso aussehende geschützte Bindestrich U+2011 -: 2003‑01‑23, der zwar nicht in allen Schriftarten vorhanden ist, aber ggf. von den meisten Browsern wenigstens durch das Bindestrich-Minus ersetzt wird.

Das DIN erlaubt übrigens zusätzlich die Schreibweise mit ausgeschriebenem (23. Mai 1949), oder abgekürztem Monatsnamen (11. Sept. 2001) und neuerdings (5008:2001-11) auch wieder – allerdings nur wenn eine Verwechslung ausgeschlossen ist – die klassisch-deutsche Version 24.12.2002.

Telefonnummern etc.

Nach DIN 5008:2001-11 gehört zwischen die Amtsnummer und die Durchwahl – und nur da – ein Bindestrich: ++49 40 555123-0, 0190 8 666666, 555-55. Leider weiß ich nicht, welcher Art er sein soll. In einem solchen Fall gehe ich immer vom Bindestrich-Minus aus.

»00«-Strich bei Währungsangaben

Wenn hinter dem Dezimaltrennzeichen (Komma) von Währungsangaben nur Nullen stehen (€ 3,00), werden diese oft durch einen Strich ersetzt: € 3,–.

Nach der Geviertdefinition mit Nullen sollte man den M-breiten Gedankenstrich erwarten und tatsächlich wird dieser auch benutzt, allerdings nur in Tabellen und (Preis-)Listen, ansonsten wird auch hier der kürzere &ndash; verwendet.

WareMengeEinheitEinzel­preis [€]Gesamt­preis [€]
Apfel2kg1,—2,—
Birne4kg1,255,—
Milch5l0,502,50
Pfand3−0,50−1,50
Summe8,—

Minus

Das Zeichen oben rechts im Num-Block (-) ist kein Minuszeichen! Man sieht das deutlich, wenn man es mit dem Pluszeichen (+) vergleicht, dessen horizontale Linie bei den meisten Schriftarten auf einer anderen Ebene liegt als die des Bindestrich-Minus; das Minus () ist aber gerade ein verlängertes Pluszeichen ohne vertikalen Anteil. Der Bindestrich ist außerdem deutlich kürzer als das Minus und Plus. In manchen Schriften ist allerdings leider das Pluszeichen an das Bindestrich-Minus angepasst worden. Es wird das gleiche Zeichen als Operator und als Vorzeichen gebraucht (1 − 2 = −1).

In HTML schreibt man es am einfachsten mit der benannten Entität &minus;.

Auch »Mal«- und »Geteilt«-Zeichen im Numblock sind nicht die korrekten, sie erzeugen ja auch andere Zeichen als auf den Tasten aufgedruckt sind. Statt des Slashs (/) schreibt man für das Divisionszeichen besser ÷ (&divide;, &#247;, &#x00F7;), (&#x2215;, &#8725;) oder den Bruchstrich (&frasl;, &#8260;, &#x2044;). Statt des Sternchens (Asterisk *) schreibt man das Multiplikationszeichen entweder als × (&times; &#215; &#x00D7;) oder als Punkt-Operator (&sdot;, &#8901;, &#x22C5;) bzw. als Mittelpunkt · (&middot;, &#183;, &#x00B7;).

Wer unter Windows eine Möglichkeit kennt, den Tasten im Numblock bei gedrückter Umschalttaste ein zweites Zeichen zuzuweisen, teile mir das doch bitte, bitte mit. So sollte das Komma per Shift zum Punkt werden.

Aufzählungsstrich

Für Aufzählungen mit Strich als Aufzählungszeichen gibt es zwar einen eigenen Unicode-Character U+2043, da das aber nur in wenigen Schriften vorhanden ist, empfiehlt sich der einfache Bindestrich -. Das Vorkommen dürfte bei gutem HTML allerdings selten sein, da man für solche Aufzählungen natürlich ungeordnete Listen (<ul>) verwendet. CSS erlaubt bisher, d. h. in Level 2, noch nicht die Definition eines eigenen Zeichen, nur Bilder und (neben diversen Nummerierungen) die Schlüsselwörter disc, circle und square und sind erlaubt.

Leerzeichen

Übersicht existierender Unicode-Zeichen
Name Unicode Dezimal Hexadezimal benannt
deutschenglisch
Manche Editoren und vor allem Textverarbeitungen stellen Tastenkombinationen zur einfacheren Eingabe zur Verfügung, dazu verweise ich allerdings auf die jeweilige Dokumentation.
Leerzeichenspace U+0020 &#32; &#x0020;
Dauerleerzeichennon-breaking space U+00A0  &#160;  &#x00A0;  &nbsp; 
en space U+2002 &#8194; &#x2002; &ensp;
em space U+2003 &#8195; &#x2003; &emsp;
thin space U+2009 &#8201; &#x2009; &thinsp;

Sonstiges

Auslassungspunkte

Auslassungen und Fortsetzungen werden oft mit drei aufeinander folgenden Punkten gekennzeichnet, dafür hält HTML eine eigene Entity bereit: &hellip; (Horizontale Ellipse. Der Duden gibt Hinweise, wann ein Leerzeichen davor zu stehen oder ein Punkt zu folgen hat. Kurz gesagt, steht der Punkt nie, andere Satzzeichen schon, und ein Leerzeichen immer, es sei denn die Punkte ersetzen Buchstaben des vorhergehenden Wortes: F… dich selber, du …! Sonst …

Doppelpunkt, Uhrzeit, Verhältnis

Für den Doppelpunkt gibt es drei Anwendungfälle, wobei das Zeichen immer gleich ist, nicht aber die Setzung von Leerzeichen:

Im normalen Texfluss wird der Doppelpunkt wie jedes andere Satzzeichen behandelt: kein Leerzeichen davor, eines danach. Bei Uhrzeiten stehen keine Leerzeichen (05:03 Uhr), aber immer die führenden Nullen. Bei Verhältnissen schreibt man hingegen beiderseits des Kolons Leerzeichen: Maßstab: 1 : 10.000, »1 : 1«-Kopie.

Dauerleerzeichen (&nbsp;) vor »Uhr« und um den Maßstab-Doppelpunkt sind empfehlenswert.

Zahlen

In Deutschland – mindestens die Schweiz unterscheidet sich davon – ist das Dezimaltrennzeichen immer das Komma (,), auch wenn der angelsächsische Punkt sich stärker zu verbreiten scheint. Zum Gruppieren hingegen wird vor allem im Finanzwesen der Punkt (.) verwendet: 123.456,78 €. In der Wissenschaft wird hingegen bevorzugt ein (auch in der entsprechenden ISO-Norm vorgeschriebenes) Leerzeichen benutzt: Π = 3,141 592 653 589 793 2…, 82 143 547 Einwohner.

Bei einheitenbehafteten Zahlen steht zwischen dem Wert und der Einheit ein Leerzeichen (im Web vorzugsweise &nbsp;, aber eigentlich halbbreit): 0 K = −273,15 C = −459,67 °F. Das gilt auf für Prozent und Promille. 5 % von 1 % sind 2 ‰ des ganzen. Im Gegensatz zu Temperaturangaben steht das Gradzeichen bei Winkeln direkt an der Zahl; ebenso die Zeichen für Winkelminute und -sekunde, die auch für Fuß respektive Zoll benutzt werden. 90°, 17″-Monitor.

Notfalls kann man im Web meiner Meinung nach insbesondere bei Nichtbuchstabeneinheiten wie dem Prozent auch auf das Wert und Einheit trennende Leerzeichen verzichten. 0K = −273,15°C = -459,67°F; 5%

Alternativ könnte man wie bei Abkürzungen den Wortabstand per CSS verringern:

.data {word-spacing: -0.5ex}
<span class="data">77 kg</span>

77 kg vs. 77 kg Das führt allerdings u. U. zu sehr hohem zusätzlichen Markup-Aufwand.

Spezielle Zeichen für geläufige Einheiten
Name Unicode Dezimal Hexadezimal benannt
deutschenglisch
Prozentper cent U+0025% &#37;% &#x25;%
Promilleper mille U+2030o/oo &#8240; &#x2030; &permil;
Graddegree U+00B0° &#176;° &#xB0;° &deg;°
Minute, Fußminute, foot (prime) U+2032' &#8242; &#x2032; &prime;
Sekunde, Zollsecond, inch (double prime) U+2033" &#8243; &#x2033;
Ohm (Omega)ohm U+03A9Ohm &#937;Ω &#x3A9;Ω &Omega;Ω
Ångströmangstrom U+00C5Å &#197;Å &#xC5;Å &Aring;Å
Mikro-Präfix (my)micro sign (mu) U+00B5µ &#181;µ &#xB5;µ &micro;µ
Nummernzeichennumero U+2116No. &#8470; &#x2116;
Schätzungszeichenestimated U+212Ee &#8494; &#x212E;

Währung

Mit der Einführung des Euro hat sich auch die Schreibung von Preisangaben geändert, vor allem daran zu erkennen, dass es für die neue Währung ein spezielles Symbol (€, &euro;, &#8364;, &#x20AC;) gibt. Prinzipiell ist es egal, ob man das Zeichen vor oder hinter den Betrag schreibt, solange ein (nicht trennendes) Leerzeichen dazwischen steht, im Fließtext allerdings ist die Nachstellung von »EUR«, »Euro« oder »€« vozuziehen, da es der Lesegewohnheit eher entspricht.

Der Betrag darf dabei keinesfalls auseinandergerissen werden; 3€50, wie man es vielleicht aussprechen würde, ist also nicht erlaubt.

Alle anderen Währungen werden – anderslautenden Gewohnheiten aus den Herkunftsländern zum Trotz – genauso behandelt: 500 $.

Währungssymbole
Name Unicode Dezimal Hexadezimal benannt
deutschenglisch
DollarDollar U+0024$ &#36;$ &#x0024;$
CentCent U+00A2¢ &#162;¢ &#x00A2;¢ &cent;¢
MillMill U+20A5m &#8357; &#x20A5;
PfundPound U+00A3£ &#163;£ &#x00A3;£ &pound;£
generisches Währungssymbol U+00A4¤ &#164;¤ &#x00A4;¤ &curren;¤
YenYen U+00A5¥ &#165;¥ &#x00A5;¥ &yen;¥
BahtBaht U+0E3FB &#3647;฿ &#x0E3F;฿
ColonColon U+20A1¢ &#8353; &#x20A1;
CruzeiroCruzeiro U+20A2Cr &#8354; &#x20A2;
NairaNaira U+20A6N &#8358; &#x20A6;
RupieRupee U+20A8Rs &#8360; &#x20A8;
Won U+20A9W &#8361; &#x20A9;
Schekel (neu)Sheqel (new) U+20AANIS &#8362; &#x20AA;
Dong U+20ABd &#8363; &#x20AB;
EuroEuro U+20ACEUR &#8364; &#x20AC; &euro;

Post Scriptum

Mir ist bewusst, dass man nach neuer deutscher Rechtschreibung, die ich eigentlich verwende, auch »Typografie« schreiben darf (wie »Fotografie«), ich den Artikel also auch Typografie für Webautoren hätte nennen können, aber irgendwie mag ich das »ph« – könnte eventuell mit meinem Namen zusammen hängen. Ehrlich gesagt war dieser Absatz auch nur dafür gut, um auch mit dieser Schreibweise bei Google & Co. gefunden zu werden. ☺ Inzwischen ist Google ziemlich rechtschreibtolerant.

Wen es interessiert: für die Darstellung dieses Dokumentes sind zurzeit diese vier Stylesheets verantwortlich:

screen.css
Für die Darstellung am Bildschirm (screen) inkl. Operas Vollbildmodus (projection). Prinzipiell sollten die enthaltenden Angaben auch mit handheld und tv funktionieren, da es aber so weit ich weiß noch keinen Browser mit entsprechender Unterstützung gibt (außer Opera 7 im Small-Screen-Mode), habe ich es noch nicht getestet und verzichte daher vorerst auf eine entsprechende Angabe.
projection.css
Einige Ergänzungen für Präsentationen (projection), vor allem größere Schrift und Seitenumbrüche.
print.css
Druckausgabe (print), ist zurzeit recht primitiv und sollte mal optimiert werden.
counter.css
Nummeriert die Überschriften, Tabellen und Bilder. Funktioniert vollständig nur in Opera und teilweise in Mozilla samt Verwandtschaft, eventuell auch in den Brüdern Safari und Konqueror.

Adresse im WWW: webdesign.crissov.de/Typographie. Letzte Änderung: 2005-06-16T13:15