Update aus dem Maschinenraum

Erst einmal vielen Dank an Erz, der bezüglich der Probleme mit dem automatischen Zurückschalten des Designs auf das blaue Default-Theme von WordPress, auf die Lösung hinwies. Es gab in der Tat noch zwei WordPress-Installationen, die ich völlig vergaß und die anscheinend für das Zurücksetzen sorgten. Warum erst jetzt und nicht bei dem vorigen Design… keine Ahnung.

Wie auch gestern, werden heute die Arbeiten in den nächsten Stunden weitergehen. Also nicht wundern, wenn mal für einige Minuten etwas schräg aussieht.

Ich werde dabei auch die neue Schrift die Safari 3- und Firefox 3.5+-User angezeigt bekamen, wieder rausnehmen.

Vielleicht kurz was zum technischen Hintergrund: beim Webdesign ist man in der Regel auf eine Handvoll von Schriften festgenagelt, die die User auf Windows und Mac installiert sind (Unix-User stellen noch einmal ein Sonderfall dar, der meist ignoriert wird). Im Rahmen des Web2.0- und Ajax-Hypes werden im Webdesign wieder die Grenzen ausgelotet, da einige Browser bereits mit der Implementierung von neuen HTML- und CSS-Features angefangen haben.

In den letzten Wochen bin ich auf die potentielle CSS3-Erweiterung @font-face aufmerksam geworden. Diese erlaubt das Ablegen von Schriften auf dem Webserver, zur Einbindung auf den Webseiten. So können auch User mit kompatiblen Browser die Webseiten in dieser Schrift lesen, obwohl sie sie nicht auf ihrem Rechner installiert haben.

Dabei gibt es im Vorfeld schon einige Probleme. Aktuell wird das Feature nur von Safari 3 und den ersten Betas von Firefox 3.5 (und kompatiblen) unterstützt. Microsoft hat bereits angekündigt dieses CSS3-Feature nicht unterstützen zu wollen, da die Schriften ungeschützt auf dem Server liegen. Auch Adobe hat sich gegen @font-face ausgesprochen. Wer sich für den Hintergrund interessiert, dem empfehle ich das Protokoll der entsprechenden W3C-Sitzung durchzulesen, da sie einiges über die Politik hinter den Kulissen erzählt. Microsoft selber, bietet ein krudes Verfahren auf Basis einer 6 Jahre alten Software an, EOT, bei dem die Schriften fest mit der Website verdongelt wird.

Ein kleineres Problem stellen auch die Schriften dar, denn natürlich dürfen für die offene Einbindung via @font-face nur Schriften verwendet werden, die dies entsprechend in ihren Lizenzen vorsehen. Also Open-Source-Schriften oder einige andere wenige Einzelfälle wie die Graublau Sans – jene Schrift die ich gestern eingebettet hatte.

allesaussersport ist für mich das ideale Testlabor um solche Geschichte wie @font-face auszuprobieren. Experimente können auch scheitern. So wie hier. Verschiedene Punkte haben dazu geführt, dass cih die Einbettung wieder herausnehmen werde.

Nach dem ich einen Tag lang mit der Schrift gelebt habe, habe ich mich schon an der Schrift satt gesehen. Sie ist etwas condensed. Zudem wirkt sie bei gleicher Schriftgröße deutlich kleiner als die Arial oder Helvetica. Dadurch sind größere Textmengen nicht gut zu lesen. Der fette Schriftschnitt neigt in der kleinen Schriftgröße zum Zuschmieren. Sowas passiert, das man irgendeinen Effekt ausprobiert, der einem schnell auf den Geist geht.

Überrascht haben mich aber zwei andere Aspekte: die Wahrnehmung der neuen Schrift als “Bug” und wie schnell es mir auf den Nerv geht, bei ausgeschalteten Cache immer 1-2 Sekunden Verzögerung zu haben, bevor die Schrift erscheint. @font-face wird noch einige Jahre bis zur Etablierung brauchen.

Die Lehren für mich: @font-face bietet sich vorrangig für Headlines an und ist derzeit die eleganteste Methode. Cufón ist clever, aber brachial (Javascript rendert SVG/XML-Pfade. Für Safari wird für jedes Wort ein CANVAS-Element generiert) und sIFR ist auch eher eine umständliche Lösung.

Reaktionen

  1. Wo kann man Kommentare eingeben?

    Nach elf Jahren habe ich die Kommentare im Blog mangels Zeit für Kommentarverwaltung geschlossen. Es kann noch kommentiert werden. Es ist aber etwas umständlicher geworden.

    1. Das Kommentarblog http://allesausseraas.de/, aufgezogen von den Lesern @sternburgexport und @jimmi2times
    2. Sogenannte „Webmentions“ mit einem eigenen Blog. Siehe IndieWebCamp
  2. Auch wenn “geschmäcklerische Diskussionen” bei Dir auf taube Ohren stoßen, muss ich sagen, das mich die neue Schrift beim lesen angestrengt hat. Die aktuelle ist für meine Augen deutlich angenehmer.

  3. Ich weiß nicht, ob das jetzt so interessant für dich ist, aber unter Firefox 3.0.10 kann man
    – nicht in den Beginn der ersten Zeile seines gerade entstehenden Kommentars klicken und muss den Cursor mit den Pfeiltasten hinbewegen
    – der Doppelklick etwa in die Namens- und email-Zeile, der normalerweise die “gespeicherten Formulardaten” erscheinen lässt, funktioniert nicht, was eine (zumindest rudimentäre) manuelle Eingabe erforderlich macht

    Alles natürlich keine großen Sachen, dachte aber es interessiert dich vielleicht.

  4. Ist es wirklich ideal, mit “Helvetica Neue” eine Schrift als Standard, vorzugeben, die man – für andere Systeme als OS X – erst kaufen muss? Der Fallback Arial sieht jedenfalls zum Weglaufen aus: http://imagebin.org/50424 :(

  5. Wenn du die Arial zum “Weglaufen” empfindest, wirst du mit einem Großteil der Webaufritte auf dieser Welt Probleme haben. Die Alternativen Franklin Gothic, Lucida Sans, MS Sans Serif, Verdana, Trebuchet und Tahoma sind von der Neuen Helvetica um Lichtjahre noch weiter entfernt, als die Arial.

    Im übrigen empfehle ich Antialiasing.

  6. Arial zum Weglaufen, halt wegen des fehlenden Antialiasing. Und Antialising ist leider unter Linux noch keine wirkliche Alternative. Ich habe es jetzt mal testweise aktiviert, damit sieht deine Seite schon deutlich besser aus, aber mehr als die Hälfte des Restes, insbesondere z.b. meine Tahoma 8pt GUI-Schrift, will man nicht wirklich so haben. Ich, weiß, nicht dein Problem.

  7. Mit der vom MacBook rüberkopierten Helvetica Neue noch einen Schritt besser, auch wenn ich persönlich die Antialis-Schrift irgendwie als unsauber/matschig empfinde.

  8. Mwaha, die können sich ja noch nichtmal über ein freundliches American Typewriter in den Blockquotes freuen. Da würde mich Courier doch deutlich mehr stören. Lucida schockt allerdings, redet mir die nicht schlecht! Überhaupt muss eine Serifenlose ja nicht unbedingt die Helvetica sein. Und Arial ist im Netz mittlerweile fast schon wieder hip.

    @dogfood Da nich’ für! Die Tweaks von heute machen übrigens enorm viel aus. Aber du könntest die Kontraste noch ein wenig schärfen und deine Graus ein wenig nachdunkeln oder anreichern. So muss ich schon häufig die Augen zusammenkneifen (ich hoffe, das fällt nicht unter unerwünschte Stylekritik).

  9. Die Typewriter-Schrift für die Zitate ist allerdings schon eine seltsame auswahl. Warum gerade dafür eine Fixschrift?

  10. Mach einen Gegenvorschlag für eine Typewriter-Schrift die unter Windows besser funktioniert.

  11. Ich stoße mich nicht an der Schrift selbst, ich finde nur die Entscheidung für eine Fixschrift an dieser Stelle interessant.

  12. Ich habe mich nicht für eine Fixschrift bzw. Monospaced Schrift entschieden, sondern für eine Typewriter-Schrift. Unter Windows gibt es — im Gegensatz zu OS X — keine Proportionalschrift die diesen US-amerikanisch angehauchten Schreibmaschinen-Gestus hat. Die beiden angegebenen Monospaced-Schriften sind die beste Entsprechung.

  13. Ich glaube die “Bug”-Wahrnehmung lag weniger daran, dass eine andere als die gewöhnlichen Standard-Schriften verwendet wurde, sondern vielmehr am schlechten Schriftbild der verwendeten Schrift (wie du es auch gut beschrieben hast). An einigen Stellen war die Schrift wirklich schlecht lesbar und sag deshalb eher nach ungewollt, also “Bug” aus.
    So habe ich jedenfalls den Schluss gezogen, dass es sich um einen Bug handelt.

  14. Natürlich viel zu spät, aber so ist das Leben. Unter der Kontextschmiede habe ich versucht, ein komplett fluides Design, das mit vertikalem Rhythmus arbeitet, zu erstellen. Dummerweise scheint Firefox der einzige Browser, der komplett die Seite so rendert, wie sie nach meinem Empfinden der Standards funktionieren müsste. Bei den anderen sind halt nicht immer alle Zeilen parallel.

    Ach ja, wir schreiben auch über Sport und sind seit gestern online.

  15. *Facepalm: Parallel sind sie natürlich schon. Nur nicht immer auf gleicher Höhe. Egal. Wird schon passen.