mit Typografie im Netz dank css3
1Einen Blog hat er schon, nun hat Fritz aus Tokyo auch einen professionellen Webauftritt. Wer mit einem halbwegs aktuellen Browser unterwegs ist, wird die neuen CSS3 Techniken zur Schrifteneinbettung genießen können. Auch XHTML in Verbindung mit dem blitzschnellen JQuery sorgen für eine überraschende aber eingängige Entdeckungsreise durch seine Fotowelt.
XHTML und CSS3 jetzt auch mit Deiner Schrift
Die verbreitete und sehr beliebte Schrift Yanone Kaffeesatz hat hier den nötigen Freiraum um zu wirken. Im Fließtext sollte man sie allerdings sparsam einsetzen, da das Hinting und Kerning von aktuellen Browsern noch sehr zu wünschen übrig lässt. Hinting ist eine Technik, um vektorbasierte Schriften in kleinen Schriftgrößen am Bildschirm optimal anzeigen zu können. Kerning (Unterschneiden) bezeichnet die Variation von Buchstabenabständen zur besseren Lesbarkeit von Proportionalschriften.
Es ist noch kein sehr weit verbreitetes Wissen, dass endlich auch alle Arten von Schriftarten im Web eingesetzt werden können. Lediglich auf die Lizenz sollte man achten, viele Schriftschmieden wissen ebenfalls noch nichts von den neuen Möglichkeiten und haben in ihren Lizenzen keine Schriftveröffentlichung im Web vorgesehen.
Die Voraussetzungen hierfür sind in allen modernen Browsern gegeben, sogar ganz ohne Plugins wie Flash. Nur beim Internet Explorer muss zur Zeit noch auf einen Kniff zurückgegriffen werden, der Manchem aus den Tagen bekannt vorkommen dürfte, als der Internet Explorer 6 noch verbreitet war und keine PNG-Transparenz unterstützt hat. Sonst werden die Schriften aufgrund fehlerhaftem Einsatz des Subpixelrendering namens Clear-Type sehr unschön dargestellt. Dieser Trick behebt auch ein Problem bei der Darstellung von sehr dünnen Schriftschnitten.
Für die Umwandlung von Truetype und Opentype Schriftarten in die für den Microsoft Browser nötige EOT-Variante kann ich folgende zwei Tools empfehlen.
Einen weiteren Kniff, den ich noch nirgends beschrieben fand, muss man im Firefox einsetzen. Für sehr leichte Schriftschnitte stellt der Firefox die Schrift zu dick dar. Dies kann man mit der Definition von
font-weight: lighter;
korrigieren. Soviel zum Thema Typografie mit CSS3.
jQuery für sinnvollen Einsatz von Javascript
Früher lief es unter dem Pseudonym DHTML, gemeint war der Einsatz von clientseitigem Javascript zur Animation von HTML-Elementen. Die Technik war lange Zeit verpönt, war sie doch weder standardisiert noch barrierearm. Heute ist das anders.
Es existieren diverse mächtige Javascript-Frameworks, mit deren Hilfe sich sehr schnell und vor allem unter Berücksichtigung von Usability-Gesetzen sehr intelligente Webanwendungen erstellen lassen. Aber auch um eine innovative, charmante Navigation umzusetzen wird beispielsweise das Framework jQuery gerne genutzt. Bei Fritz sorgt jQuery dafür, dass beim Anklicken der Miniansichten ein automatisches Scrollen von Rahmen und Browser stattfindet.
Natürlich geht das auch ohne Javascript, dann muss der Nutzer eben manuell zum Bild scrollen. Sofern also solche Techniken sparsam und degradierbar genutzt werden, ist das kein Grund mehr es nicht zu tun. Die Verbreitung von Javascript ist – außer in sicherheitskritischen Bereichen und bei einigen sehr sicherheitsbewussten Nutzern – ein Standard.
« Älterer Artikel Neuerer Artikel »
Würde mich freuen, wenn CSS3 endlich offiziell als Standard verabschiedet wird, den genutzt werden einige Komponenten schon länger und die anderen sind weiter auf dem Vormarsch. Selbst habe ich die Meinung gefasst, wo auch immer es möglich und sinnvoll ist direkt auf CSS3 zu bauen, auch wenn es derzeit noch einiges Gefriemel bedeutet.
JavaScript (egal auf welchem Framework basierend) gehört für mich auch schön länger zum Standard und User die das nicht akzeptieren, müssen sich eben andere Seiten suchen, auf denen sie ihre Zeit verbringen. Selbst bei sicherheitskritischen Bereichen ist es oft kein Problem, mit etwas Nachdenken keine Lücken entstehen zu lassen. Den für jeden JS-Einsatz ein Fallback zu bauen schluckt einfach zu viel Zeit und für viele Kunden damit auch zu viel Geld.
Greetz.