Logo Araneae-online

Schriften

Aufzaehlung Noch im Jahre 2001 wurden oftmals Formatierungen direkt im Text vorgenommen, was von Webdesignern ein hohes Maß an Disziplin erforderte, sollten doch die Formatierungen der Überschriften, Texte und Aufzählungen etc. auf allen Seiten eines Internetauftritts gleich sein. Abhilfe schafften externe Style Sheets (CSS) Dateien in denen die relevanten Stilinformationen für alle Dokumente gespeichert werden >> weiter zum Thema Formatierung.

Aufzaehlung In der deutschen Sprache haben wir die Besonderheit der Umlaute. In den Anfängen des Internets musste deshalb oftmals ein "ä" in "ae" umgeändert werden, um beim Empfänger nicht als unleserliches Sonderzeichen dargestellt zu werden. Für die korrekte Darstellung von Umlauten muss im Kopfteil (Header) einer HTML-Datei definiert werden, welche Kodierung angewandt werden soll >> weiter zum Thema Codierung.

Aufzaehlung Um etwas ausgefallenere Schrift in HTML-Seiten zu verwenden, blieb bisher nur die Möglichkeit sie als Grafik einzubinden. Inzwischen gibt es Web fonts, das heißt Schriften werden aus dem Internet geladen und können dann unabhängig von den lokal installierten Schriften auf der Webseite dargestellt werden >> weiter zum Thema Web fonts.

Schriften in HTML

Jeder der schon mal in einer Textverarbeitung geschrieben hat, weiß, dass die Eigenschaften der Überschriften und des Textes, wie Schriftgröße, Zeilenabstand, Laufweite der Buchstaben u.s.w., festgelegt werden müssen. Das ist in einem HTML-Dokument nicht anders, allerdings hat man hier die Möglichkeit die Formatierungen in einer gesonderten Datei zu speichern. Diese können dann auf alle Seiten der Homepage angewandt werden. Zusätzlich hat man die Option für verschiedene Ausgabemedien (z.B. drucken) unterschiedliche Darstellungen zu wählen. Während auf dem Bildschirm zumeist serifenlose Schriften wie "Arial" oder "Verdana" bevorzugt werden, können im gedruckten Dokument Serifenschriften wie "Times New Roman" oder "Courier" bevorzugt werden. Diese Trennung von Text und Formatierung hat einerseits den Vorzug, dass bei Schriftänderungen nur ein zentrales Dokument geändert wird, das heißt, Änderungen der Schriftart schnell durchgeführt sind, andererseits der Text für Screenreader besser zu lesen und damit barrierefrei ist.

Cascading Style Sheets

Erreicht wird die Festlegung der Formatierungen durch Cascading Style Sheets (CSS), was soviel heißt wie: wie eine Kaskade weitergegebene Stile. Ein für ein Element geltender Stil kann an ein weiteres übertragen werden.

Prioritäten

Bei der Anwendung von Style Sheets muss auf die Prioritäten geachtet werden. Direkte Formatierungen im Text überschreiben interne Style Sheets. Diese wiederum haben Vorrang vor Regeln in einer externen Style Sheet Datei und externen Style Sheets wird eine Prioritätsstufe im Verhältnis zu anderen zugewiesen. Standardmäßig ersetzt das Style Sheet der Web-Seite die Voreinstellungen des Browsers.

Versionen

Die erste Version der Cascading Style Sheets wurde vom World Wide Web Consortium (W3C) 1996 verabschiedet. In dieser Version konnten in erster Linie Schriftformatierungen, Hintergründe und Rahmen festgelegt werden. Die darauf folgende Version 2 erschien am 12-May-1998 Sie verlassen die Homepage http://www.w3.org/TR/1998/REC-CSS2-19980512/Overview.html und erweiterte das Spektrum um die Möglichkeit das gesamte Seitenlayout mit Cascading Style Sheets zu gestalten. Hier gilt derselbe Vorteil wie bei den reinen Schriftformatierungen, durch die Änderung einer Datei kann das gesamte Seitenlayout verändert werden. Die Version 3 wird zurzeit noch bearbeitet und wird unter anderem auch Elemente für die Sprachausgabe enthalten. Der erste Browser, der die bisher erarbeitete Version 3 vollständig unterstützt, ist Safari 4.

Validierung

CSS Dateien können unter dem Link: Sie verlassen die Homepage http://jigsaw.w3.org/css-validator/validator-uri.html validiert werden. Anders als beim "W3C Markup Validation Service" ist dieser Service in deutscher Sprache verfügbar.

Kodierung

Schrift besteht aus Buchstaben und diese müssen dem Browser verständlich beschrieben (kodiert) werden. Den Beginn nahm das World Wide Web im englischsprachigen Raum, wo es keine Sonderzeichen gibt, und breitete sich von dort aus. Im ASCII (American Standard Code) gibt es deshalb nur 128 Zeichen, die deutschen Umlaute gehören nicht dazu. In der ISO 8859-1 gibt es die doppelte Anzahl an Zeichen (256, 8-Bit). Mit dieser Kodierung können die meisten westlichen und mitteleuropäischen Sprachen gut dargestellt werden. Für die richtige Umsetzung der Zeichen wurde im Kopf einer HTML-Seite die betreffende Kodierung definiert:

<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">

Allerdings musste im Quelltext aus einem "ä" "&auml;" werden, um im Browser richtig dargestellt zu werden. Waren die Zeichen nicht definiert wurden in Firefox nur noch Fragezeichen, bzw. im Internetexplorer Vierecke gezeigt.

Browserfenster von Firefox mit Sonderzeichen

Diese Einschränkungen werden in Unicode beseitigt. Unicode (dt. etwa: "Einheitsschlüssel") ist eine Form der Kodierung von Zeichensätzen für das Internet mit dem alle weltweit verfügbaren Textzeichen, wie Buchstaben, Silbenzeichen, Satzzeichen, Sonderzeichen und Ziffern, darstellbar gemacht werden sollen. Verantwortlich für den Unicode Standard ist das in Kalifornien ansässige "Unicode Consortium". Unicode wurde vom World Wide Web Consortium" (W3C) in den Standard von HTML 4.0 aufgenommen. Unicode hat mit seinen 100 000 Zeichen den Anspruch alle bekannten Schriftsysteme darstellen zu können. Die wichtigsten Unicode Kodierungen zurzeit sind UTF-16 (16 Bit) und UTF-8, die die Unicode Zeichen in 8 Bit darstellt. Die betreffende Zeile im Header sieht wie folgt aus:

<meta http-equiv="content-type" content="text/html;charset=utf-8">

In einem XHTML Dokument sieht der betreffende Kopfteil so aus:

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8"/>
<title>Unbenannte Seite</title>
</head>

Bei dieser Kodierung werden auch im Quelltext die Umlaute dargestellt eine Umschreibung ist nicht mehr nötig. Aber auch Unicode löst nicht das Problem eines auf dem Computer nicht vorhandenen Zeichensatzes, der die kodierten Textzeichen auch umfasst und darstellen kann. Es wird an Technologien gearbeitet, die es möglich macht bei Bedarf fehlende Schriftarten vom Browser online laden zu lassen. "Lucida Sans Serif", ein auf der Windows Plattform verbreiteter Zeichensatz, verfügt immerhin über 1.300 Zeichen. "Arial Unicode MS" ist ein nicht frei verfügbarer Font, der alle Unicode-Zeichen der Unicode-Version 2 darstellen kann, also auch die Zeichen vieler asiatischer Schriften.

Web fonts

Google ist eine Plattform, die kostenlos Web fonts anbietet. Unter Sie verlassen die Homepage http://www.google.com/webfonts stehen knapp 300 Schriftfamilien zur Verfügung. Nachdem man sich eine oder mehrere Schriftfamilien ausgesucht hat, können sie der eigenen Kollektion hinzufügt werden. Anschließend muss man nur noch entscheiden, wie die betreffenden Schriften eingebunden werden sollen, per CSS-Link, @import oder Javascript. Zu jeder Möglichkeit wird der Code eingeblendet, der mit kopieren / einfügen in die eigene Seite übertragen werden kann. Dieser Abschnitt ist in „Marck Script“ formatiert.

Wie auch dieser in „Buda“ formatierte Abschnitt zeigt, muss man bei der Wahl der Schriften den Zweck berücksichtigen, für den sie eingesetzt werden sollen. Ausgefallene Schriften eignen sich beispielsweise nur für Überschriften, weil sonst das Lesen eines Textes leicht anstrengend wird. Nichtsdestotrotz bringen Web Fonts Abwechslung ist das Schrifteneinerlei von Verdana, Arial und Times. Beim Ausdrucken werden, falls die Schriften lokal auf dem Computer nicht installiert sind, ähnliche Schriften verwendet.

Links zum Thema

Sie verlassen die Homepage http://unicode.e-workers.de/about_unicode.php
Sie verlassen die Homepage http://www.sql-und-xml.de/xml-lernen/internationalisierung-unicode-sonderzeichen.html
Sie verlassen die Homepage http://de.wikipedia.org/wiki/UTF-8
Sie verlassen die Homepage W3C CSS Fonts Module Level 3


Letzte Aktualisierung: Mittwoch, 28.12.2011