RSSMix.com Mix ID 13493

Besseres Font-Rendering unter Windows mit GDI++

Basics

Das Problem der Darstellung von Schriftarten auf einem Bildschirm liegt in der Tatsache begrndet, dass die Zeichen in einem festen Pixelraster dargestellt werden mssen. Beispielsweise stehen fr den ganzen Bildschirm bei einer Auflsung von 1.280 × 1.024 genau 1.310.720 Pixel zur Darstellung des Inhaltes zur Verfgung. Was zunchst beeindruckend klingt, ist es in der Praxis nicht, denn wenn man z.B. das groe A der Schriftart Arial in der Gre 12 auf den Screen bringt, dann stehen dem armen Letter gerade mal 6 × 7 Pixel zur Verfgung. Da kann jeder Drucker nur mde lcheln. Als wre das nicht genug, stellt ein heutiger Bildschirm 96 dpi dar (dots per inch / Punkte pro Zoll), ein Spitzendrucker kommt hier auf Werte von 1.600 dpi. Und schlielich werden im Regelfall zur Darstellung des Buchstaben dann ganze zwei (!) Farben verwendet. Was dabei heraus kommt ist rechts zu sehen. Schlecht zu lesen und sthetisch ein Grauen.

Vergrerte Darstellung des Buchstaben A aus der Schriftfamilie Arial bei Gre 12 ohne Anti-Aliasing.

Ab Windows 95 wurde ein Standard-Anti-Aliasing (siehe unten) angeboten, dass den verpixelten Effekt abmildern sollte, allerdings war der Qualittsgewinn kaum wahrnehmbar. Auch unter Windows XP war dies noch die Grundeinstellung. Allerdings spendierte uns MicroSoft einen technologischen Fortschritt; Font-Smoothing¹ war im Anmarsch.

ClearType

Mit ClearType wurde ab Windows XP eine Technik zur besseren Darstellung von Schriftarten ausgeliefert, die auch in vielen anderen Bereichen der digitalen Grafik zum Einsatz kommt, das sogenannte Anti-Aliasing, eine Art Kantenglttung. Dabei werden nicht nur die reinen Pixel betrachtet, sondern auch die Umgebung derselben ausgewertet (Subpixel-Rendering²). In der Folge werden durch Interpolation besonders krasse Kontraste mit teiltransparenten Pixeln abgeschwcht. Bei einem schwarzen Buchstaben auf weiem Hintergrund also z.B. durch verschiedene Graustufen. Das Ergebnis ist ein wesentlich angenehmeres Schriftbild, ein optischer Gewinn und dankbare Augen.

Der gleiche Buchstabe wie oben, diesmal mit aktiviertem ClearType.

MicroSoft nannte seine Version des Font-Smoothings ClearType, auf einem Apple-Rechner sorgt die Rendering-Engine Quartz fr hbsche Schrift. Beide Varianten knnten unterschiedlicher nicht sein³. ClearType sorgt fr scharfe, auf die Bildschirmdarstellung optimierte Zeichen, Quartz hingegen stellt Buchstaben eher so dar, wie sie auch beim Ausdruck erscheinen, fr einen Windows-User sieht das Ganze viel zu fett und verschwommen aus. Der Aufschrei jedenfalls, der damals bei Erscheinen des Safari fr Windows durchs Netz ging, zeigte deutlich, welch Gewohnheitstier der Mensch ist. Wer damals den Safari – aus diesem Grund – sofort wieder deinstalliert hat, braucht hier nicht weiterlesen.

FreeType / GDI++

Das FreeType-Projekt entwickelt seit einigen Jahren eine freie, leicht portierbare Programmbibliothek zur Darstellung von Schriften im Pixelraster. So ist FreeType z.B. unter Linux die Standard-Software zur Rasterung von TrueType- und OpenType-Schriften. Quasi ein ClearType fr alle, nur dass das Rendering mehr dem Stil von Mac OS entspricht. Dem Windows-User bietet sich damit die Mglichkeit, sich seine bevorzugte Methode des Font-Smoothings auszusuchen. Wie kann man nun aber FreeType unter Windows nutzen?

Die Lsung heit GDI++.DLL und wurde von Dr. Watson entwickelt. Auch wenn der Name eher einen angelschsischen Ursprung vermuten lt, kommt er aus Japan, was die wenigen englischsprachigen Infos zur Software erklrt.

gdi++.dll is a replacement for the Windows default font rasteriser, which gives you a better font smoothing capability, just like Mac OS X. It hacks one of the most important core dlls for graphics, gdi32.dll.

Durch GDI++ werden also Funktionen der System-Bibliothek GDI32.DLL verndert, die u.a. fr das Rendern der Schriftarten zustndig ist. GDI++ verwendet dabei andere Methoden zur Kantenglttung (die der FreeType-Bibliothek) und somit sieht auch das Ergebnis anders aus. Je nach Setup vergleichbar dem Erscheinungsbild unter Mac OS X.

Installation

Die Rendering-Methoden im Vergleich. Wer soll Dein Herzblatt sein?

Dr. Watson hat seine Aktivitten bezglich GDI++ zwar eingestellt, allerdings wird die Software trotzdem weiter entwickelt und so gibt es relativ viele verschiedene Pakete zum Download. Die von seiner Website sind mittlerweile bald drei Jahre alt, wrde ich also nicht unbedingt empfehlen. Ich persnlich verwende die Downloads dieser japanischen Seite und mein Favorit ist dabei das Paket gdi0870.zip. Nach dem Entpacken wird der Ordner einfach an eine beliebige Stelle auf der Festplatte kopiert (z.B. C:\GDI) und die darin enthaltene Datei gditray.exe gestartet. Mit einem Rechtsklick auf das neue Symbol im Systray und Auswahl des Menpunktes Enable wird das neue Font-Rendering aktiviert. ber Use Preferences kann man verschiedene Einstellungen testen und sich die Beste fr seinen Bildschirm aussuchen.

Fein-Tuning

Wem die mitgelieferten INI-Dateien nicht ausreichen und wer Spa am Experimentieren hat, der findet hier einige Erluterungen zu den einzelnen Parametern. Dazu spter mal ein eigener Artikel. In der jeweiligen INI-Datei kann man auch bestimmte Schriftarten oder Programme vom neuen Font-Rendering ausschlieen. Bei ausgewhlter Software soll es hier und da zu merkwrdigen Anzeigen kommen. Ich habe GDI++ seit ca. einem halben Jahr im Einsatz und habe bisher nur bei Elster Formular eine Macke festgestellt: Die Buchstaben werden alle vertikal gespiegelt dargestellt. Um also Schriftarten vom Rendering auszuschlieen, gengt in der entsprechenden INI-Datei folgender Eintrag:

[Exclude]GeorgiaTimes New Roman

Damit wrden diese Schriftarten mit dem klassischen ClearType dargestellt. Genauso kann man Programme ausschlieen:

[DenyModule]itunes.exeelfo2008.exeelfostarter2008.exe

Hier z.B. iTunes und besagtes Elster Formular. Ansonsten konnte ich bisher keinerlei Probleme beim Einsatz von GDI++ feststellen. Unterm Strich sollte man GDI++ einfach mal probieren. Ich mchte es jedenfalls nicht mehr missen.

1 Krzysztof Szafranek, Font smoothing explained

2 Gibson Research Corporation, Sub-Pixel Font Rendering Technology

3 Joel Spolsky, Font smoothing, anti-aliasing and sub-pixel rendering

45 x Design-Freeware

Snap2Objects hat die 45 besten kostenlosen Programme rund ums Thema digitales Design in einer bersicht zusammen gestellt.

Neben Klassikern wie GIMP oder IrfanView, gibt es doch noch das ein oder andere Schmankerl zu entdecken, das zumindest mir noch nicht gelufig war.

Viel Spa beim Stbern!

Firefox-Extension: Page Saver

Das Firefox-AddOn Page Saver von Pearl Crescent ermglicht es, Screenshots von Webseiten zu erstellen und diese als PNG- oder JPEG-Grafik zu sichern. Dabei kann entweder die komplette Webseite oder nur der sichtbare Ausschnitt gespeichert werden.

Natrlich gibt es schon seit langem die ScreenGrab Extension, allerdings hat diese zumindest ein Manko: Sie reagiert ziemlich trge, selbst in der Canvas-Version. Page Saver ist hingegen rasend schnell und bietet darber hinaus noch verschiedene Optionen zum Speichern der Screenshots an.

Page Saver ist schnell und bietet mehr Optionen als ScreenGrab.

So kann man z.B. mit bestimmten Platzhaltern in den Dateinamen die Uhrzeit der Aufnahme einbauen und die prozentuale Gre des Bildes angeben. PNG-Grafiken knnen mit Alphatransparenz gesichert und fr JPEG-Bilder die Qualitt eingestellt werden.

Bei mir lst Page Saver jedenfalls mit sofortiger Wirkung die ScreenGrab-Extension ab.

Webstandards in der Krise?

Molly Holzschlag meint ja. Jeffrey Zeldman meint nein.

Jedenfalls entspannt sich in den Kommentaren zu diesen Artikeln eine recht lebhafte Diskussion zwischen Croft, Diaz, Meyer & Co.

6 Pownce Invites

Hab ich zu verschenken.

Wer will auch pofnzen?

Edit: Prima, weg und zu.

GoogleGuide - Besser suchen

Die Google-Suche bietet mehr als nur die Angabe von Schlagwrtern die mit Leerzeichen getrennt werden. Um auch die weniger bekannten Mglichkeiten zur Optimierung der Suche kennen zu lernen, gibt es jetzt den GoogleGuide, eine Zusammenstellung der Optionen um die Standardsuche, aber auch Froogle, Groups und News effektiv zu gestalten.

Als Online-Version oder als PDF.

Noch mehr Tips rund um Google gibt es direkt unter GoogleGuide.com.

Design Float - Digg fr Designer

Mit Design Float geht ein neuer Digg-hnlicher Service an den Start, allerdings mit Spezialisierung auf Print-, Web- und allgemeines Design.

Design Float is a community driven news website dedicated to design.

Es gibt bereits einige Tools zur Browser- und Webseiten-Integration von Design Float, Feeds knnen komplett oder nur fr bestimmte Kategorien abonniert werden und vor allem soll krftig diskutiert werden. Die Registrierung ist natrlich kostenlos.

Mal schauen wie sich das Ganze so anlt, aber zumindest ein Abonnement der Kategorien CSS & Webstandards und Programming kann sicherlich nicht schaden.

Habari - Next Generation Blogging

Habari. Spread the news.

Einige haben schon davon gehrt, andere mal die Webseite besucht, wenige haben ihren WordPress-Boliden angeworfen und darber berichtet und eine verschwindend geringe Zahl an (deutschen) Bloggern hat Habri im Einsatz. Dieser Artikel wird wohl der erste einer ganzen Reihe von Postings ber Habari werden: Es gibt viel zu berichten, Vorzge zu nennen und zu zeigen, warum Habri momentan wohl die fortschrittlichste Blogging-/CMS-Plattform ist. Andererseits will ich niemanden berzeugen oder andere Scripte schlecht reden… die Vielfalt der freien Software auf diesem Sektor ist ein Segen und so soll es bleiben.

Background

Once upon a time… gegen Ende des Jahres 2006, verlieen einige altgediente WordPress-Entwickler das Team und legten den Grundstein fr eine neue Blogging-Software. Die Grnde warum sie WordPress den Rcken kehrten sind vielschichtig und haben mit persnlichen Differenzen gegenber den Machern von Automattic zu tun, mit der Entwicklung die WordPress nahm aber auch mit dem Wunsch eine neue, moderne Blogging-Plattform zu kreieren, die den Vernderungen des Netzes Rechnung trgt. Ihnen gefiel z.B. nicht, dass die Entwicklung der freien Software WordPress mittlerweile fast ausschlielich in den Hnden von Matt Mullenweg und seiner Firma Automattic liegt und kaum noch in echter Open-Source-Manier von einer Community betreut wird.

Ehemalige WordPress-Entwickler starteten das Projekt Ende 2006.

Egal. Die Grnde Habari aus der Taufe zu heben sind nach knapp drei Jahren auch nicht mehr sonderlich wichtig. Obwohl… die Grndungsvter zu denen u.a. Owen Ringmaster Winkler, Scott Skippy Merill, Michael C. Harris und Michael Heilemann gehren, legen bei Habari grten Wert darauf, da die komplette Community am Projekt beteiligt ist und bleibt. Wer also Ahnung von PHP, SQL und objekt-orientierter Programmierung hat, kann direkt mitentwickeln. Oder sich anders einbringen: mit bersetzungen, Hilfe bei der Projekt-Homepage, dem Schreiben von Plugins usw. Die Gemeinschaft ist der Motor und zumindest bislang stehen dahinter keine monetren oder andere Interessen.

Voraussetzungen

Der zweite und wichtigere Grund, warum Habari vllig from scratch startete, sind die Mglichkeiten die sich dadurch bieten. Man konnte ohne auf Abwrtskompatibilitt zu achten, auf aktuelle Software setzen, neueste Programmiertechniken verwenden und Erfahrungen im Kampf gegen Spam einbringen. Das Problem lterer Blog-Scripte ist heute, da sie zu einer Zeit entwickelt wurden, als PHP 3 oder 4 und MySQL 3 aktuell waren. Objekt-orientierte Programmierung wurde damals selten bis gar nicht verwendet. Deutlich wird dies am Beispiel von WordPress: Bis heute sind Fragmente des Vorlufers b2/cafelog vorhanden, der Code ist im Laufe der Jahre aufgeblht und Kompatibilitt zu frheren Versionen schrnkt zumindest die konsequente Nutzung moderner Standards ein.

Habari blickt nicht zurck und nutzt die Mglichkeiten der Zeit. Ein Blick auf die Systemanforderungen macht dies deutlich:

PHP 5.2 oder hher
PHP-Untersttzung fr PDO (PHP Data Objects)
mod_rewrite (konsequente URL-Umschreibung)
MySQL 4.1 oder hher (bei Verwendung von MySQL)

Das klingt schlimmer als es ist. Gute Webhoster wie all-inkl, Host Europe usw. bieten das sowieso und auch sonst ist PHP 5 heute Standard. Bei Schnppchen-Hostern knnte es u.U. Probleme mit dem Zugriff auf mod_rewrite geben. Im Habari-Wiki gibt es einen Requirements-Checker, einfach auf den Webspace laden und aufrufen.

Vorsprung durch Technik

Habari untersttzt verschiedene Datenbanken. Momentan MySQL, SQLite, PostgreSQL.

Einer der grten Unterschiede zu den bekannten Blog-Systemen ist die Nutzung von PDOs. Durch die vllige Abstrahierung des Datenbankzugriffs, kann Habari quasi mit jeder mglichen Datenbank betrieben werden. Momentan existieren Klassen fr die Untersttzung von MySQL, SQLite und PostgreSQL. Insbesondere die SQLite-Untersttzung ist fr Blogger mit einer durchschnittlichen Inhaltsmenge sehr interessant, da SQLite nur eine Datei bentigt, die direkt auf dem Webspace liegen kann. Eine echte Datenbank ist in dem Fall nicht notwendig. Durch sogenannte prepared statements werden wirksam SQL-Injections verhindert.

Auf Grund des modularen Aufbaus und der Objekt-Orientierung lt sich Habari einfach und beliebig ausbauen (Stichwort: class und extends). Auf diese Weise lassen sich ohne Aufwand Plugins schreiben, Theme-Funktionen erweitern oder hinzufgen und die Core-Dateien bleiben davon unberhrt. Gleiches gilt fr die sogenannten Media-Silos. Silos gewhrleisten einen direkten Zugriff auf Medien-Dateien, wie z.B. Flickr, Viddler und eigene Dateien auf dem Webspace. Weitere sind einfach hinzuzufgen.

Auch ein Schmankerl: Mit einer Habari-Installation lassen sich mehrere Weblogs/-seiten auf verschiedenen Domains gleichzeitig betreiben. Ein Unterordner im User-Verzeichnis und das wars schon im Wesentlichen.

Auch die Entwicklung von Themes geht leicht von der Hand. Habari arbeitet diesbezglich mit reinen PHP-Dateien (hnlich wie WordPress). Ich bevorzuge diese Variante deutlich gegenber anderen Mglichkeiten wie Smarty (Serendipity), Tags (Expression Engine) oder gar der Speicherung des Templates in der Datenbank (TextPattern). So hat man die grte und direkteste Kontrolle ber den Output. Es gibt bereits etliche fertige Themes und selbstredend auch ein Verzeichnis mit sinnvollen Plugins.

In Habari gibt es Eintrge und Seiten, aber auch vllig andere Inhaltstypen sind mglich.

Natrlich wurde auch an die – heute unumgnglichen – CMS-Funktionen gedacht: neben klassischen Blogeintrgen, knnen pages erstellt und statische Frontseiten verwendet werden. Habari geht jedoch weiter und legt sich nicht auf diese beiden Inhalts-Arten fest. Der Anwender kann mit entsprechendem Know-How oder unter Nutzung bestehender Plugins eigene content-types definieren, erstellen und verwalten. So gibt es bereits einen PodCast-Content-Type, einen fr Link-Blogs, aber auch Dinge wie ein Photoblog sind damit zu realisieren. Gerade hier steckt groes Potential in Habari.

Und schlielich (nicht als abschlieend gemeint) gibt es Import-Plugins fr WordPress und Serendipity. Wer fngt schon gern bei Null an. ;-)

Conclusio

So weit ein erster berblick. Bedenkt man, da die Plattform dieser Tage in Version 0.6.2 erschien und somit noch vieles im Flu ist, mu man vor den Entwicklern den Hut ziehen. Die Software ist stabil, produktionstauglich und die Entwicklung schreitet rasant voran. Ich kann jedem Interessierten nur empfehlen, sich die neueste Version in die Sandbox zu legen und ausgiebig zu testen, es macht regelrecht Spa. Da alle Informationen zu Habari den Rahmen eines Artikels gesprengt htten, folgen hier in Krze weitere Eintrge zum Thema. Dann werden Schwerpunkte wie die Installation, das Admin-Interface (Monolith, ein Meisterwerk von Michael Heilemann!), Plugins und Themes nher beleuchtet.

Frischt verliebt... in Expression Engine

Das Ende von WordPress als CMS auf dieser Seite naht.

Im Zuge der Arbeiten an cssNeustart und der Entscheidung dort auf Expression Engine zu setzen, bin ich recht schnell dem Charme dieses Bloggers Darling, wie Florian es nannte, verfallen.

Dabei war es keine Liebe auf den ersten Blick. Ich hatte die kostenlose Core-Version von EE schon mehrfach auf dem Rechner und bin dann doch durch Dinge wie die URL-Struktur, die Templates, vllig andere Tags usw. wieder davon abgekommen. Als wir beim cssNeustart berlegten, auf WordPress zu setzen, bekamen wir von verschiedenen Seiten, den Hinweis, doch lieber auf EE zu setzen, da die Member-Verwaltung ausgereifter ist und das System generell besser mit groen Datenmengen und – strukturen umgehen kann.

Mittlerweile knnen wir uns zu diesem Schritt nur selbst gratulieren, aber die ersten Schritte mit einem neuen System sind immer schwierig und das war auch einer der Hauptgrnde, warum wir den cssNeustart vom 01.07. auf den 01.08. verschieben muten.

Nach dem nun aber das Verstndnis fr EE da ist, war mir recht schnell klar, da ich den Nachfolger der bekannten pMachine von EllisLab auch hier auf meinen privaten Seiten einsetzen werde.

Allein schon die Template-Verwaltung lt einen mit der Zunge schnalzen. Der effiziente und flexible Einbau von Tags und Conditionals macht alles mglich.

Nach einigen aktiven Jahren des Bloggens oder allgemein des Produzierens von Inhalt im Web, sammelt sich aber in Datenbank ganz schn was an und so fragte ich mich zu allererst, wie ich den die 242 Postings und 2.100 Kommentare von WP zu EE bertrage. Es gibt zwar einige WordPress-Plugins und auch im Core integrierte Export-Funktionen, aber fr EE war natrlich schon mal nichts dabei. Nchster Gedanke war das Exportieren ins MovableType-Format, denn damit kann EE etwas anfangen. Ums kurz zu machen: alles was es an Plugins u.. so gibt hat nicht richtig funktioniert und am Ende half mir das Script WordPress to MovableType. Erst mal im EE Format, lieen sich die Daten dann prima einlesen.

Heute habe ich schon die Hlfte des Designs bertragen und mu sagen, es geht schnell, viel schneller als ich dachte und die Templates sind nur noch ein Drittel so gro. Das ganze Gefrickel mit PHP und zig MySQL-Queries entfllt, denn in EE steht das alles als Template-Tag zur Verfgung. ber die Unterschiede der beiden Systeme aber demnchst mal mehr.

Hier mal eine Gegenberstellung der Journal-Seite: Vorher (powered by WordPress) und Nachher (powered by Expression Engine). Wie man sieht, sieht man nichts. Also zumindest keine Unterschiede und so soll es sein. :)

Jetzt freue ich mich erst mal ber diese Entdeckung und komme vorlufig zu dem Schlu: Es gibt (fast) nichts was man mit WordPress nicht auch umsetzen knnte, aber mit Expression Engine geht es um ein Vielfaches einfacher, schneller, effektiver. :wub:

Es lebt!

Ich gebe mal kurz durch, da hier wieder Zeichen, Stze, Abstze, ja ganze Artikel erscheinen.

Groes Aufheben braucht man in der heutigen Zeit darum auch nicht mehr machen… Blogs kommen und gehen, die Schreiber machen Pause, andere hren ganz auf, wieder andere machen weiter, wenn auch oft schleppender. Entweder fehlt die Zeit oder der Elan lt nach, weil die Grnderjahre vorbei sind. Oder man hat keine Lust mehr Beitrag x aus Blog y – den man beim Kollegen z im Feedreader gelesen hat – wiederzukuen. Oder es gibt einfach nichts weltbewegend Neues. Bei mir war es von allem etwas, ist aber letzten Endes auch egal.

Jedenfalls sind knapp zwei Jahre Inaktivitt dann doch schnell vergangen und ich htte die Seiten hier bestimmt frher entstaubt, wenn ich nicht ber Habri gestolpert wre und sich das Redesign der Seite nicht ber Monate gezogen htte (fehlende Zeit, as usual).

Relaxation (2005). Der Klassiker.

Aprops Design: die neue Variante ist jetzt intern mit Version 5 angesetzt. Zwei Versionen sind in der Sandbox verschwunden, Version 3 recht zgig, die 4. Fassung, weil sie zu sehr an eine Kopie von Jon Tans grandiosem Weblog erinnerte. Relaxation (2005) schau ich mir heute noch gerne an, Snap! (2006) lief bis vor ein paar Tagen hier, V3 und V4 entwickelte ich irgendwann 2007 und an V5 sitze ich seit ziemlich genau einem Jahr. Nun bin ich im Wesentlichen fertig, einige Pages fehlen noch, aber ansonsten luft es recht rund. Photos und Artworks wurden endlich einmal dem generellen Design unterworfen.

Unglaublich brigens, wie viele Macken in Design und Funktion einem erst auffallen, wenn das Theme hochgeladen ist. Da spielt man ber Tage und Wochen alle erdenklichen Situationen im localhost durch und kaum ist das Zeug im echten Netz gelandet, springen einen die Fehler nachgerade an. Murphy in Hchstform. Falls Euch also grobe und kleine Schnitzer auffallen… bitte mailen oder kommentieren.

Version 3 schaffte es nur bis zum Header.

Als Motor – zumindest fr das Journal – brummt jetzt Habri unter der Haube und wird – aktiviertes JavaScript unterstellt – von MooTools untersttzt. Getreu dem Motto: Was interessiert mich mein Geschwtz von gestern hab ich also Expression Engine links lassen, WordPress sowieso und auch einen Flickr-Account nenne ich wieder mein eigen. Warum und wieso, dazu spter mehr. Immerhin kann ich jetzt sagen: Joa… ist ja zwei Jahre her.. ;-)

Ansonsten will ich mal nicht das ganze Pulver im ersten Post verblasen und wnsche dem geneigten Feed-Abonnenten oder Google-Gestrandeten viel Freude beim Vermehren der knftig hier zu gewinnenden Einsichten.