Wie ist es um die typografische Qualität der Haupt­informations­quellen für Nachrichten im Internet bestellt?

Die Frage lautet also: Wie ist es um die typografische Qualität der Haupt­informations­quellen für Nachrichten im Internet bestellt? Meiner Meinung nach sollte sich Qualitätsjournalismus auch in Qualitätstypografie widerspiegeln, und deshalb habe ich mir die Seiten genau unter die Lupe genommen. (Am Ende des Artikels werden die Kriterien erläutert)

Meine Rangliste:

1. Focus Online (Alexa-Rang 52)
   Note 2
   
   • Schriften: Arial/Arial
   • Webfonts: ✗
   • Flattersatz: ✓
   • UTF-8-Kodierung? ✓
   • Korrekte Anführungszeichen: ✓ [„“]
   • Korrekter Gedankenstrich: ✓
   • Eigennamen mit Akzentbuchstaben?
     »Franck Ribéry« (✓) | »Raúl« (✓) | »Srđan Lakić« ✗
   • Note für Makrotypografie/Leseanreiz: 2+

 

2. Welt Online (Alexa-Rang 38)
   Note 2−
   
   • Schriften: Georgia/Arial
   • Webfonts: ✗
   • Flattersatz: ✓
   • UTF-8-Kodierung? ✓
   • Korrekte Anführungszeichen: ✓ [„“]
   • Korrekter Gedankenstrich: ✓
   • Eigennamen mit Akzentbuchstaben?
     »Franck Ribéry« (✓) | »Raúl« (✓) | »Srđan Lakić« ✗
   • Note für Makrotypografie/Leseanreiz: 3+

 

3. Zeit Online (Alexa-Rang 76)
   Note 2−
   
   • Schriften: Arial/Georgia
   • Webfonts: ✗
   • Flattersatz: ✓
   • UTF-8-Kodierung? ✓
   • Korrekte Anführungszeichen: (✓) [»«, aber auch ""]
   • Korrekter Gedankenstrich: ✓
   • Eigennamen mit Akzentbuchstaben?
     »Franck Ribéry« (✓) | »Raúl« (✓) | »Srđan Lakić« ✗
   • Note für Makrotypografie/Leseanreiz: 2−

 

4. FAZ.net (Alexa-Rang 72)
   Note 3+
   
   • Schriften: Verdana/Verdana
   • Webfonts: ✗
   • Flattersatz: ✓
   • UTF-8-Kodierung? ✓
   • Korrekte Anführungszeichen: ✓ [„“]
   • Korrekter Gedankenstrich: ✗
   • Eigennamen mit Akzentbuchstaben?
     »Franck Ribéry« (✓) | »Raúl« (✓) | »Srđan Lakić« ✗
   • Note für Makrotypografie/Leseanreiz: 2−

 

5. Spiegel Online (Alexa-Rang 8)
   Note 3
   
   • Schriften: Verdana/Verdana
   • Webfonts: ✗
   • Flattersatz: ✓
   • UTF-8-Kodierung? ✗ (ISO-8859-1)
   • Korrekte Anführungszeichen: ✗
   • Korrekter Gedankenstrich: ✗
   • Eigennamen mit Akzentbuchstaben?
     »Franck Ribéry« ✓ | »Raúl« ✓ | »Srđan Lakić« ✗
   • Note für Makrotypografie/Leseanreiz: 2+

 

6. sueddeutsche.de (Alexa-Rang 32)
   Note 3
   
   • Schriften: Arial/Arial
   • Webfonts: ✗
   • Flattersatz: ✓
   • UTF-8-Kodierung? ✓
   • Korrekte Anführungszeichen: ✗
   • Korrekter Gedankenstrich: ✗
   • Eigennamen mit Akzentbuchstaben?
     »Franck Ribéry« ✓ | »Raúl« ✓ | »Srđan Lakić« ✗
   • Note für Makrotypografie/Leseanreiz: 2+

 

7. tagesschau.de (Alexa-Rang 66)
   Note 3−
   
   • Schriften: Verdana/Verdana
   • Webfonts: ✗
   • Flattersatz: ✓
   • UTF-8-Kodierung? ✓
   • Korrekte Anführungszeichen: ✗
   • Korrekter Gedankenstrich: ✗
   • Eigennamen mit Akzentbuchstaben?
     »Franck Ribéry« ✓ | »Raúl« ✓ | »Srđan Lakić« ✗
   • Note für Makrotypografie/Leseanreiz: 2−

 

8. n-tv.de (Alexa-Rang 84)
   Note 3−
   
   • Schriften: Arial/Arial
   • Webfonts: ✗
   • Flattersatz: ✓
   • UTF-8-Kodierung? ✓
   • Korrekte Anführungszeichen: ✗
   • Korrekter Gedankenstrich: (✓)
   • Eigennamen mit Akzentbuchstaben?
     »Franck Ribéry« (✓) | »Raúl« (✓) | »Srđan Lakić« ✗
   • Note für Makrotypografie/Leseanreiz: 3+

 

9. Bild.de (Alexa-Rang 10)
   Note 4+
   
   • Schriften: Arial/Arial
   • Webfonts: ✗
   • Flattersatz: ✓
   • UTF-8-Kodierung? ✓
   • Korrekte Anführungszeichen: ✓ [„“]
   • Korrekter Gedankenstrich: (✓)
   • Eigennamen mit Akzentbuchstaben?
     »Franck Ribéry« (✓) | »Raúl« ✗ | »Srđan Lakić« ✗
   • Note für Makrotypografie/Leseanreiz: 5

 

10. stern.de (Alexa-Rang 47)
    Note 4+
    
    • Schriften: Georgia/Arial
    • Webfonts: ✗
    • Flattersatz: ✓
    • UTF-8-Kodierung? ✗ (ISO-8859-1)
    • Korrekte Anführungszeichen: ✗
    • Korrekter Gedankenstrich: ✗
    • Eigennamen mit Akzentbuchstaben?
      »Franck Ribéry« (✓) | »Raúl« ✗ | »Srđan Lakić« ✗
    • Note für Makrotypografie/Leseanreiz: 3+

Fazit

Es liegt noch einiges brach auf den deutschen Top-News-Sites! Keine einzige Seite nutzt die Webfonts-Technologie, um ihr Print-Erscheinungsbild ins Netz zu übertragen. Es gibt keine Seite, die sowohl mikrotypografisch überzeugt als auch konsequent sorgsam mit fremdsprachlichen Eigennamen umgeht. Immerhin ist der Blocksatz nirgends zu finden und fast alle können mit ordentlicher Makrotypografie punkten. Trotzdem: Ein Besuch bei Typefacts sollte für alle Seitenbetreiber lohnen.

Kriterien

• Schriften: Welche Schriftarten kommen zum Einsatz in Überschriften/Fließtext?
• Webfonts: Finden andere Schriften als Systemschriften Verwendung?
• Flattersatz: Blocksatz ist im Internet ein No-Go.
• UTF-8-Kodierung? Eine Voraussetzung für barrierefreie, gute Mikrotypografie ist die UTF-8-Zeichenkodierung.
• Korrekte Anführungszeichen: Werden korrekte Anführungszeichen („“ oder »«) verwendet statt der unsäglichen "doppelten Strichlein"? → Anführungszeichen
• Korrekter Gedankenstrich: Wird der Gedankenstrich verwendet oder der olle Bindestrich? → Binde- & Gedankenstrich
• Eigennamen mit Akzentbuchstaben? In drei Stufen wird getestet, ob der Website die korrekte Schreibung von fremdsprachlichen Eigennamen wichtig ist. Das é kennt aus Café und co fast jeder und bekommt es auch hin, das ú ist schon etwas exotischer, aber dennoch ebenso einfach über die Tastatur erreichbar. Die außergewöhnlichen Zeichen đ und ć können über die deutsche Tastatur nicht direkt erreicht werden. → Tastaturkürzel | Workshop: Sonderzeichen einfügen
• Note für Makrotypografie/Leseanreiz: Hier vergebe ich rein subjektiv ein Note, wie sehr mich die Seite anlacht und zum Lesen einlädt.
• Bei einem (✓) wurden sowohl richtige als auch falsche Schreibweisen gefunden.

Nein,

es gibt hier nicht nur noch Top-Ten-Listen.

Bindestrich (-)

-Bindestrichdirekt: -direkt: -–Gedankenstrichalt+0150⌥+-—Geviertstrichalt+0151⇧+⌥+-−Minus——————

Er war einst die dünnste Linie, die die Breitfeder hergab und demnach ursprünglich in einem Winkel von 20–45° nach oben gerichtet (Daher kommt auch die alte Unart des Verdoppelns, um ihn vom Komma zu unterscheiden). Heute kennen wir ihn meist als kurze, waagerechte Linie; in Serifenschriften teilweise auch mit kleinen angedeuteten Endstrichen.

Der Bindestrich steht nie zwischen zwei Leerzeichen!

Im Gegensatz zur Bedeutung seines Fachbegriffs »divis« (von lat. dividere – teilen) soll er die Zusammengehörigkeit von Wortteilen und zusammengesetzten Begriffen stärken.

• Bindestrich als Trennstrich
  
• Bindestrich zur standardisierten Schreibweise des Datums
  
• Bindestrich als Ergänzungsstrich
  
• Bindestrich bei Zusammensetzungen mit Buchstaben und Ziffern
  
• Bindestrich als Koppelungsstrich: »Fritz Walter«, aber:
  
• Bindestrich zur Verdeutlichung von Zusammensetzungen
  

Gedankenstrich (–)

-Bindestrichdirekt: -direkt: -–Gedankenstrichalt+0150⌥+-—Geviertstrichalt+0151⇧+⌥+-−Minus——————

Der Gedankenstrich (auch »Streckenstrich« oder »Halbgeviertstrich«) besteht auch in Serifenschriften meist aus einer schnörkellosen horizontalen Linie, die etwas länger ist als der Bindestrich. Er hat eher trennende Funktion und kann als Ersatz für das Minuszeichen (das nicht per Tastatur erreicht werden kann) benutzt werden.

Da er (zumindest auf Windows) schwieriger zu erreichen ist, wird fälschlicherweise schnell auf den Bindestrich zurückgegriffen. In Notfällen (Monospaced-Satz, SMS, E-Mails …) darf statt des Gedankenstrichs auch ein doppelter Bindestrich benutzt werden.

• Gedankenstrich
  
• Gedankenstrich als Strecken- und Bis-Strich
  
• Gedankenstrich in Wortgruppen
  
• Gedankenstrich bei Gegenüberstellungen
  
• Gedankenstrich zur Kennzeichnung von Pausen
  
• Gedankenstrich als Spiegelstrich in Listen
  

  Der Abstand zwischen Spiegelstrich und Wort sollte etwas größer als ein Leerzeichen sein.

• Gedankenstrich als Minuszeichen
  
• Gedankenstrich als Auslassungsstrich
  
• Gedankenstrich zwischen Interpret und Titel
  

Geviertstrich (—)

-Bindestrichdirekt: -direkt: -–Gedankenstrichalt+0150⌥+-—Geviertstrichalt+0151⇧+⌥+-−Minus——————

Der längere Geviertstrich (—) kann meist – mit geringeren Abständen – alternativ zum Gedankenstrich benutzt werden. Indra Kupferschmidt schreibt ihm klassische literarische Wirkung zu, wohingegen ihn Robert Bringhurst als »zu lang für gute Typografie« bezeichnet.