Archiv der Kategorie: Werkzeuge

Schriften in die Website einbinden

War es bis vor kurzem nur möglich, Standart-Systemschriften (Arial, Verdana, Times New Roman, Courier etc.) auf seiner Website anzeigen zu lassen, so setzt sich die individuelle Schriftgestaltung auf Seiten immer mehr durch. Nicht nur in Blog-Systemen oder Seiten wie about.me lassen sich individuell Schriften auswählen. Jeder kann auf seiner eigenen Seite für typografische Individualität und, durch die technische Optimierung für die Bildschirmausgabe, für bessere Lesbarkeit sorgen. Dafür stellen die großen und kleinen Schriftenhäuser immer mehr Webfonts her und bieten sie zum Kauf oder kostenlosen Download an. Jedoch nicht jeder Browser zeigt zur Zeit diese Webfonts an.

Grundsätzlich muss man zwischen zwei Varianten der Einbindung individueller Schriften unterscheiden:

1.
Man legt die Schriften in einem Verzeichnis auf dem Server der eigenen Website ab und fügt sie mittels CSS in die Seiten ein.

Diese Schriften liegen bei Schriftenhändlern, z.B. bei FontShop oder Fontspring, im .woff und .eot Format vor. Diese Formate werden von Firefox, Internet Explorer und Chrome unterstützt (Safari leider nicht). Mit der Seite Fontfonter kann man schon mal vorab die Wirkung bestimmter Schriften auf seiner Seite ausprobieren (Achtung! Durch einen Programmiertrick funktioniert dies auch in Safari!).

Alle notwendigen Informationen zum Einsatz von Webfonts und einen kostenlosen Font zum Download bietet FontShop auf einer Themenseite.

«Fontspring» bietet einige seiner Schriften kostenlos oder zum kleinen Lizenz-Preis für die Einbindung in Websites an. Großer Vorteil, man erhält ein Schriftenpaket, das neben den Formaten .woff und .eot auch eine OpenType-Schrift (für die Desktop-Nutzung) enthält. Einen Überblick über die Webfonts, die unterstützten Browser und Formate und die Vorteile gegenüber des Schriftenmietens bei «Typekit» (siehe 2.) gibt es hier.

Fontssquirrel, eine gute Quelle für Free Fonts, bietet mit dem @font-face generator ein Werkzeug, zur Umwandlung von Fonts in das .eot- und .woff- Format

2.
Die Schrift liegt auf einem fremden Server und wird kostenlos oder kostenpflichtig mittels CSS in die Seiten eingebunden. Der Vorteil dieser Technik liegt in der Darstellung der Schriften in nahezu allen Browsern und auf mobilen Geräten.

Google hostet eine Reihe von Webfonts und bietet diese kostenlos zur Einbindung in die eigene Seite an. Eine Anleitung und einen Schriftenüberblick gibt es hier.

Bei «Typekit» mietet man Schriften auf Grundlage von Seitenaufrufen (Page Views) auf seinen Seiten.

Die Nutzung einer Schrift bei bis zu 25.000 Seitenaufrufen ist kostenlos. Für kleine Seiten also durchaus, angesichts der Auswahl an hochwertigen Schriften, eine Alternative zu den Schriften bei google. Die Nutzung ist einfach und auf der Seite von Typekit gut erklärt.

Weitere Informationen bei drweb.de

Benötigte Werkzeuge zum Einbinden der Schriften in die eigene Seite

Um die Stylesheets in seinen Quellcode einzubinden, kann man auf jeden Texteditor zurückgreifen. Einfacher machen diese Arbeit aber spezialisierte Programme, besonders wenn man keine oder wenig Erfahrung mit CSS hat. Einen Überblick über CSS-Editoren gibt es hier.

Ich benutze auf dem Mac das einfach zu bedienende CSSEdit. Sehr nützlich zum analysieren der Seite und ausprobieren von Programmierungen (CSS, HTML, JavaScript) live in der Website ist das Firefox Add-on Firebug.

Für den Transfer der CSS-Dateien vom und zum Server nutze ich den empfehlenswerten FTP-Client Cyberduck (für Mac & Win) der es auch ermöglicht, Dateien direkt auf dem Server zu bearbeiten.

So, das war nun genug zu Webfonts! Pinsel in die Hand!
Film: Ein großer und ein kleiner Mensch Schreiben das Alphabet.

Ohne Sorgen sich mit Schrift beschäftigen

image-686

Ausstellungen

Zwei Ausstellungen in Berlin, unbedingt empfehlenswert, deren Besuch sich gut verbinden lässt – Schrift in der Bildenden Kunst und Schrift im angewandten Bereich, Claus und Spiekermann:

Carlfriedrich Claus. Geschrieben in Nachtmeer
Ausstellung. 8. April – 5. Juni 2011
Akademie der Künste, Berlin

Eine Überblicksausstellung über das komplexe Werk von Carlfriedrich Claus (1930-1998), dem zu Lebzeiten zurückgezogen Künstler aus Annaberg in Sachsen. Ein philosophischer Schrift, Sprach- und Denkkünstler mit Einfluss auf die Kunst des ausgehenden 20. Jahrhunderts. Erstmalig sind auch seine frühen Fotografien zu sehen.

Anmerkungen zum Künstler, Beispiele und ein Unterrichtsprojekt zu CF Claus finden sich auch in «Kunst+Unterricht Heft 343-344»

—
erik spiekermann. schriftgestalten«
23. März bis zum 6. Juni 2011
Bauhaus-Archiv in Berlin

Die Ausstellung gibt einen Einblick in das vielfältige Werk des Schriftgestalters, Designers und FontShop-Gründers. Anlass der Ausstellung ist die Ehrung des Designers mit dem Deutschen Designpreis 2011 in der Kategorie «Persönlichkeit» für sein bisheriges Lebenswerk. Allen sichtbar ist sein Wirken durch die Präsens seiner Schriften, wie z.B. ITC Officina, FF Meta, FF Info, FF Unit und die Exklusivsschriften für die Deutsche Bahn.

 

Mit bald 128000 Followern bei Twitter (@espiekermann) hat er den Status eines Popstars in der Typoszene – keine Wunder, zwitschert er doch immer nützliche, wichtige Informationen oder einfach nur Sprüche.

Tipps und Anleitungen

Nützliche Hinweise, Tipps und verschiedene Materialien rund um das Thema Schrift und Typografie bietet der Bereich «Education» bei FontShop und natürlich das (kostenlose) Nachschlagewerk «Apfel i» als E-Book (PDF).

—
Nutze das Smartphone als Hilfsmittel und  Werkzeug zum Schriftenerkennen und -kennenlernen.  Zei nützliche FontTools:

Du siehst eine Schrift und möchtest herausbekommen um welche es sich handelt? Mit «WhatTheFont» können Schriften indentifiziert werden. Einfach Schrift fotografieren und hochladen. Noch praktischer ist es in Form einer kostenlosen iPhone App.

Eine gute Inspirationsquelle und «Schriftschule» ist FontShuffle, eine App für iPhone, iPod touch und iPad. Fast 700 Schriftfamilien sind alphabetisch und nach Klassen sortiert. Sie können aber auch spielerisch gefunden und immer wieder neu sortiert werden. Ebenso lassen sich kurze Mustertexte schreiben.

Und zum Schluss noch etwas Unterhaltung

Body Writing: Der Text von Tom Waits Song «Come On Up to the House» von seinem großartigen Album «Mule Variations» (1999) auf einen Körper geschrieben. Der Rhythmus des Stop-Motion-Films geht mit dem Song und Stimme von Tom Waits eine wunderbare Verbindung ein.

Bloggen für den Unterricht

Blogs – die Zukunft des Lernens, Lernen 2.0 … die taz berichtet über die Veränderungen der Lehrerrolle durch die Nutzung von Blogs und Wikis im Unterricht und darüber, wie Lehrer zu diesen Themen sich gegenseitig helfen und Material im Internet finden.

Schreib selbst: Starte einen Blog
• WordPress in Deutsch
• ausführliche englischsprachige WordPressseite
• edublogs – Bloggen für Lehrer, Schüler und Studenten leicht gemacht