Die Wahl der Schriftart ist ein Teil der Webseitengestaltung über den man im Internet, meiner Meinung nach, noch zu wenig findet. Die Schriftart ist ein zentraler Aspekt, der beeinflusst, wie eine Webseite wahrgenommen wird. Man sollte sich also wenigstens ein paar Gedanken dazu machen.

Was ist also unsere Zielsetzung? Wir wollen eine Schriftart, die auf dem Bildschirm möglichst gut zu lesen ist. Eine Schriftart, die sich dafür eignet ist Verdana. Diese Schriftart wurde speziell dafür entwickelt, um auf Geräten mit niedriger Auflösung, wie z.B. auf einem Bildschirmen, dargestellt zu werden. Diese lässt sich zwar von Microsoft im Core Fonts Paket auch für andere Betriebssysteme als Microsoft Windows herunter laden, aber man kann nicht davon ausgehen, sie auf jedem Rechner vorzufinden.

Eine weitere sehr gut lesbare und auf die Bildschirmausgabe optimierte Schriftart ist Bitstream Vera, die sogar vollständiges Hinting unterstützt. Bistream Vera liegt bei fast Allen Linux Distributionen bei. Sie ist also eine sehr gute Wahl, da außerdem mit Hilfe des Hintings bei geringer Auflösung des Ausgabegeräts Maßnahmen ergriffen werden, um die einzelnen Buchstaben noch besser unterscheiden zu können.

Falls beide Schriftarten nicht vorhanden sind, sollte man natürlich entsprechende weitere Schriftarten angeben. Wir wählen dazu "Helvetica" und "sans-serif". Letztere ist die Schriftart, die jeder Browser darstellen kann, indem er eine beliebige serifenlose Schrift auswählt.

Diese Überlegungen führen uns also zu folgendem CSS-Code.

body {
/* .... */
font-family: "Bitstream Vera Sans", Verdana, Helvetica, sans-serif;
font-style: normal;
/* .... */
}

Technorati Profile

Runde Ecken sind in aller Munde und mittlerweile gibt es auch etliche Anleitungen und Möglichkeiten diese zu realisieren. Ich war nun aber auf der Suche ein horizontales Menü zu basteln, dass einfach nur gewinkelte Ecken/Ränder hat:

Das Ganze sieht auf den ersten Blick nicht so kompliziert aus, aber auf den zweiten Blick ergeben sich doch ein paar Probleme, denn die einzelnen Menüpunkte sollten Hovern können und eine Active-State haben. Wie also vorgehen?

Warum Problem?
Nun ja CSS ist ein BoxenModell in denen die Boxen jeweils 90° haben. Eine Darstellung in dieser Form ist nicht ohne Weiteres möglich. Man könnte nun sagen, dass wir Bilder ziwschen die Einzelnen Elemente setzen und so den Eindruck der Winkel erstellen, dargestellt wie folgt:

Doch wie man ganz rechts sieht würde es sehr viele Bildchen geben, um jeden Fall abzudecken.
Ich habe das ganze also anders lösen müssen.
So kam es dazu, dass ich gif's benutzte. Der Vorteil: Gifs werden auch vom IE richtig in ihrer Transparenz dargsetellt.
Das heißt ich habe jeden Menüpunkt genommen und ihn so wie er ist ausgeschnitten:

Links und rechts habe ich mit Photoshop "weiß" als Tranpsarente Farbe eingerichtet, sodass ich nur noch ein margin-right:-20px als unschöne Eigenschaft benutzen musste und es war getan.

Wie schon gesagt, "schön" ist diese Lösung nicht aber sie funktioniert in allen Browsern ab Version 6, sodass man mit einer unschönen CSS-Eigenschaft leben kann.