Bezüglich der Textformatierung auf unseren Webseiten waren wir lange daran gewöhnt, die Auswahl auf Standardschriften wie Arial, Times New Roman, Verdana, Georgia und wenige andere zu beschränken. Denn nur bei diesen Universalschriften konnte davon ausgegangen werden, dass sie auf allen PCs installiert sind und somit unseren Website-Besuchern korrekt angezeigt werden.

Glücklicherweise entwickelt sich das Web konstant weiter und so ist es inzwischen möglich, dank Webfonts Texte mit bestimmten anderen Schriften zu formatieren, und dabei die Gewissheit zu haben, dass diese auch auf Computern korrekt angezeigt werden, auf denen die Fonts nicht installiert sind.

Sehen wir uns daher an, wie wir die in der Sammlung „65 moderne Webfonts“ von SoftMaker enthaltenen Schriften einsetzen können, um die Texte unserer mit WebSite X5 (Version 9) erstellten Projekte zu formatieren.

Die Schriftensammlung „65 moderne Webfonts“

Um die Schriften der Sammlung „65 moderne Webfonts“ nutzen zu können, muss zunächst das ZIP-Archiv über den erhaltenen Link heruntergeladen und anschließend entpackt werden. Die Dateien sind in folgenden Verzeichnissen enthalten:

• Das Verzeichnis WebFonts beinhaltet die Schriften, die im Web verwendet werden können. Um die Kompatibilität mit allen verbreiteten Web-Browsern zu gewährleisten, stehen die Webfonts in den 4 Formaten EOT, WOFF, TIF und SVG zur Verfügung.
• Das Verzeichnis Sample enthält Beispielseiten, auf denen gezeigt wird, wie die Webfonts mit unterschiedlichen Bildschirmauflösungen dargestellt werden.
• Das Verzeichnis DesktopFonts enthält die TrueType-Schriften für die lokale Installation auf dem PC. Diese Schriften dürfen NICHT im Web veröffentlicht werden. Sie sind ausschließlich für die lokale Installation bestimmt, um offline Dokumente und Bilder bearbeiten zu können.

Installation der Schriften auf dem Computer

Um die 65 Schriften der Sammlung nutzen zu können, zum Beispiel, um Texte zu formatieren oder mit dem programminternen Editor von WebSite X5 Bilder zu erstellen, müssen die entsprechenden TrueType-Versionen auf dem PC installiert werden, mit dem Sie arbeiten möchten.

Installation der TrueType-Schriften auf dem PC:

• Öffnen Sie das Verzeichnis DesktopFonts und markieren Sie die zu installierenden Fonts.
• Öffnen Sie per Rechtsklick das Kontextmenü und wählen Sie dort die Option Installieren.

Verwendung der Webfonts in WebSite X5

Nach der Installation der in der Sammlung enthaltenen TrueType-Schriften erscheinen diese in den Font-Listen überall dort, wo mit WebSite X5 Texte bearbeitet werden können, und stehen somit zur Nutzung bereit.

Damit die in einem Projekt verwendeten Webfonts nicht nur auf dem PC, an dem Sie arbeiten, sondern auch auf allen Computern, mit denen die Benutzer durch Ihre Website surfen, korrekt angezeigt werden, gehen Sie in WebSite X5 bitte vor wie nachstehend beschrieben:

• In Schritt 1 – Allgemeine Einstellungen, Tab Erweitert, in das Feld Individueller Code für den Bereich HEAD folgenden Code einfügen:

<link href="files/sm_65modernwebfonts.css" type="text/css" rel="stylesheet">

Dieser String verlinkt alle Seiten der Website mit dem Stylesheet (CSS-Datei), in dem die Stile für die Verwendung der Webfonts definiert sind.

• In Schritt 3 – Erstellen der Seiten in die Homepage (oder eine beliebige andere Seite) einObjekt HTML und Widgets einfügen: Dieses Objekt hat keinen konkreten Inhalt und beeinflusst daher nicht das grafische Layout der entsprechenden Seite.
• Auf das eingefügte Objekt HTML und Widgets doppelklicken, sodass sich der Editor öffnet, und dort den Tab Erweitertanklicken.
• Die Schaltfläche Hinzufügen… anklicken und alle Webfont-Dateien importieren, die im Projekt verwendet werden sollen. Auf diese Weise werden sie an den Code angehängt und automatisch auf dem Server veröffentlicht. Für jeden verwendeten Webfont müssen die entsprechenden EOT-, WOFF-, TIF- und SVG-Dateien importiert werden, die im Verzeichnis WebFonts der Schriftensammlung enthalten sind. Im Fenster Verlinkte Datei hochladen im Feld Serverpfad das Zielverzeichnis files unverändert lassen.

• Auf die gleiche Weise im Feld Mit dem HTML-Code verlinkte Dateien auch die CSS-Datei importieren (ebenfalls in das Verzeichnis files, also an den gleichen Ort wie die Dateien kopieren), die über folgenden Link heruntergeladen werden kann: http://bit.ly/zMrUTi

Um die Vorgehensweise noch besser zu veranschaulichen, haben wir eine kleine Projektdatei erstellt und dort einen Text mit der in der Sammlung enthaltenen Schrift Comix formatiert. Dieses Beispielprojekt können Sie über folgenden Link herunterladen: http://bit.ly/wej1JH

HINWEISE

65 moderne Webfonts ist ein Produkt von SoftMaker (http://www.softmaker.net ) und kann unabhängig von WebSite X5 genutzt werden.

Weitere Informationen über die Schriftensammlung 65 moderne Webfonts, die Nutzungslizenz und die Verwendung mit anderen Programmen als WebSite X5 finden Sie in dem offiziellen Handbuch, das in englischer und deutscher Sprache verfügbar ist. Die entsprechenden PDF-Dateien sind sowohl im Installationsverzeichnis der Schriftensammlung enthalten als auch online über folgende Links abrufbar:

• Version in englischer Sprache: http://www.softmaker.net/down/65webfonts_en.pdf
• Version in deutscher Sprache: http://www.softmaker.net/down/65webfonts_de.pdf

Sollten Sie spezifische technische Assistenz für die Schriftensammlung 65 moderne Webfonts benötigen, wenden Sie sich über folgende E-Mail-Adresse bitte direkt an den Hersteller: ***.