Jump to content

Verzögerte Darstellung von Webfonts


Lars Kähler

Empfohlene Beiträge

Lars Kähler

Hallo!

Mir ist an Ralfs Agenturseite eine Verzögerung beim Nachladen des Webfonts aufgefallen. Und das, was ich vorher sehe, ist zwar der richtige Text, auch in Versalien und sogar mit den tatsächlichen Farben, aber der Webfonts tritt wie gesagt erst mit zeitlicher Verzögerung in Erscheinung.Frage: Lässt sich das umgehen? Ist das ein Fehler? Oder muss man damit leben?

Link zum Beitrag
Ralf Herrmann

Das heißt »Flash of unstyled Text« und unter diesem Suchbegriff findest du entsprechende Beschreibungen und »Lösungsansätze« sofern du diese als nötig erachtest.

http://www.webmonkey.com/2010/05/dealing-with-the-dreaded-flash-of-unstyled-text/

http://paulirish.com/2009/fighting-the-font-face-fout/

http://blog.typekit.com/2010/10/29/font-events-controlling-the-fout/

Link zum Beitrag
Lars Kähler

Allerdings halte ich das für notwendig. Ich werde das jedenfalls so lange nicht einsetzen, bis diese nervöse Geflacker nicht endlich verschwunden ist. Gibt es da wirklich keinen allgemein akzeptierten workaround?

Link zum Beitrag
Lars Kähler
nötig

Ja, wirklich. Ich habe mich bei meiner allerersten Homepage, einer Fotogalerie, schon geärgert, dass ich die Schriften nicht festlegen konnte. Als Schriftsetzer. Gewohnt, an sündhaft teuren UNIX-Workstations Seiten aufzubauen. Der auch schon seinerzeit im Fotosatz geahnt hat, dass dieses widerliche grüne Geflimmer der Kommandos und Texte nicht der Weisheit letzter Schluss sein würde. Deshalb habe ich das in Flash gebaut. Und mir dafür, also für die Verwendung eines proprietären Formats, prompt öffentliche Schelte eingehandelt. Dabei hätte ich zu der Zeit gar keine andere Option gehabt, als erstmal auf gewählte und passende Schriften zu verzichten. Es ging schließlich schlicht und ergreifend nicht nur langsam oder unvollkommen, sondern gar nicht.

Das fand ich einfach nur schlecht. Billig. Unfertig. Wie gewollt und nicht gekonnt. Na, Du kleines süßes www, bist Du denn noch zu blöd, mir unsere Jahrtausende alten Schriften darzustellen? Kann ja wohl nicht angehen! Und kaum naht Besserung mit diesen Webfonts, da wird ein derartiges Gedöns darum veranstaltet, dabei geht es doch um die schlichte Nachbesserung eines nur rudimentär entwickelten Mediums. Na gut, das ist vielleicht übertrieben. Aber ich habe mich darüber schon sehr geärgert und auch mit Dir hier darüber gestritten.

Link zum Beitrag
Ralf Herrmann
Allerdings halte ich das für notwendig. Ich werde das jedenfalls so lange nicht einsetzen, bis diese nervöse Geflacker nicht endlich verschwunden ist. Gibt es da wirklich keinen allgemein akzeptierten workaround?

Dieses Verhalten hat ausschließlich Firefox auf diese Weise implementiert. Ich hab das auch damals mit den Entwicklern selbst per E-Mail endlos diskutiert, um zumindest Code-seitig eine Hintertür zu erhalten, dieses Standardverhalten zu unterdrücken. Fakt ist: Es ist ein Feature – kein Bug. Webfonts können mehrere Megabyte groß sein. Ob ein großes Bild erst nach einer Weile fertig geladen ist, stört niemand, aber wenn man auf leere Webseite starrt, bis alle Webfonts geladen sind, dann ist das auch nicht ideal. Daher zeigt Firefox eben erst die Fallback-Fonts an und umbricht dann neu, wenn die Webfonts geladen sind.

Die empfehlenswerteste Methode dagen ist wahrscheinlich die Benutzung des Webfont Loaders von Google. Damit kann man per CSS die Texte ausblenden, solange die Webfonts noch nicht geladen sind:

https://developers.google.com/webfonts/docs/webfont_loader

Persönlich setze ich nichts dergleichen ein. Wer Firefox nutzt, hat diesen Effekt ohnehin auf praktisch jeder Seite mit Webfonts.

Link zum Beitrag
Mach

Das Problem ist doch vor ziemlich genau einem Jahr in Firefox 4 deutlichst verbessert worden und tritt jetzt nur noch bei langen Ladezeiten auf (schlechte Verbindung/riesige Fonts). Vorher trat es auf allen Internetseiten mit @font-face auf, jetzt begegne ich dem Problem praktisch nicht mehr, nicht einmal mehr auf meinen eigenen Testseiten, wo ich absichtlich bis zu sechs verschiedene, unkomprimierte Versionen von einem relativ langsamen Server lade (und wo ich auf Firefox angewiesen bin, weil nur Firefox die OpenType-Intelligenz richtig darstellt): Wie bei einem Bild ist kurz nichts zu sehen, und der Text erscheint – wie in Webkit – erst nach einer kurzen Verzögerung (gleich im richtigen Font).

Link zum Beitrag
Ralf Herrmann

Ah, interessant, dass sie noch umgeschwenkt sind. Hab gerade nochmal nachgelesen. Offenbar gibt es ein 3-Sekunden-Fenster, in dem der Webfont geladen werden kann, bis FF dann entweder selbigen oder doch den Fallback-Font anzeigt.

Link zum Beitrag
RobertMichael

ich wollts gerade schreiben. ich arbeite mit FF täglich und

habe dieses problem schon lange nicht mehr beobachten können.

Link zum Beitrag
Lars Kähler

Vielen Dank für die vielen Antworten! :-D

Firefox benutze ich ja gar nicht. Ich habe hier einen Mac mit Safari und ein Laptop, auf dem Windows 7 läuft. Als Browser verwende ich Opera. Dort habe ich dies Phänomen eben zufällig an Ralfs Seite bemerkt. Bitte sagt mir, was ich beachten muss, um doch noch in den Genuss von webfonts zu gelangen.

BTW: Wieso eigentlich „webfonts“? Für mich sind das „Schriften“.

Link zum Beitrag
Ralf Herrmann

Opera und Webfonts sind auch ein leidiges Thema … :cry:

Es braucht einen eigenen Namen, da es es eine eigene Technologie ist (@font-face im Gegensatz zu Systemfonts, die auf Webseiten angesprochen werden) und da sie in der Regel eine eigene Webfont-Lizenz erfordern.

Link zum Beitrag
Joshua K.

Auch ich nutze Opera und sehe den Text für Bruchteile einer Sekunde in einer Standardschrift. Das stört mich jedoch nicht, weil gleichzeitig Bilder und andere Elemente aufgebaut werden, sodaß sich die Seite sowieso bewegt.

Lars, dauert das Laden der Schriften bei Dir vielleicht länger, weil Du eine eher langsame Verbindung hast?

Link zum Beitrag
Lars Kähler

Nein. Es stört mich einfach. Mir wäre es lieber, wenn während der Ladezeit überhaupt aller Seiten gar nichts zu sehen ist. Ich bin gern bereit, auf einen Browser umzusteigen, der das kann. Meinetwegen auch Konqueror auf Linux.

Link zum Beitrag
Sebastian Nagel

Firefox könnte das vielleicht (müsste ausprobiert werden):

http://www.pcruneasy.com/tutorials/firefox/about/speed-rendering.php

Hier ist eine (englische) Anleitung, wie die Wartezeit, bevor Firefox *irgendwas* anzeigt, verkürzt wird (von standardmäßig 250ms auf 0ms) – dadurch ensteht der Eindruck, die Seite lade schneller.

Ginge man in die entgegengesetzte Richtung (1000ms, 2000ms?), wäre vielleicht genug Zeit, CSS, Fonts etc. zu laden, bevor der Versuch einer Darstellung beginnt.

Link zum Beitrag
Lars Kähler

Seltsam, dass Euch alle so etwas nicht zu stören scheint. :-( Ich würde auch ganz gern Opera oder Safari benutzen. Ich warte auf den Tag, wo ich den Browser begrüßen darf, der 99 % aller Seiten korrekt darstellt.

Stellt Euch das doch mal im Printbereich vor: Für jede Magazinseite muss erstmal 10 Sekunden gewartet werden, bevor sich die Bilder und Schriften nachgeladen haben!

Link zum Beitrag
Ralf Herrmann
Nein. Es stört mich einfach. Mir wäre es lieber, wenn während der Ladezeit überhaupt aller Seiten gar nichts zu sehen ist.

Das hatten wir bei Flash-Seiten früher. Diese unsäglichen Counter von 1 bis 100%. Und auch heute könnte man das JavaScript für normale Webseiten umsetzen – es will aber keiner, oder andersherum gesagt: die Leute würden es hassen, Webseiten so betrachten zu müssen.

Eine Webseite ist, im Gegensatz zu Druckseiten, in der Regel länger als der Bereich, den wir auf einmal erfassen können. Warum sollte man warten müssen, bis Inhalte geladen sind, die wir überhaupt nicht sehen können!? Das macht keine Sinn.

Link zum Beitrag
Mach

Eine bekannte Seite, die einen solchen Counter einsetzt, ist gmail.

Mich selber hat der Flash of Unstyled Text auch sehr gestört. In Firefox, Safari oder Chrome/Chromium tritt das Problem aber nicht mehr auf. Ich hatte nicht gewusst, dass es in Opera noch immer nicht behoben worden ist. Mein Tipp wäre Umsteigen auf Firefox. Da tritt nicht nur der Flash of Unstyled Text nicht mehr auf*, sondern darüber hinaus sind auch die SmartFont-Features des OpenType Layout zuverlässig umgesetzt (im Gegensatz zu Webkit und Trident, wo je nach Kombination von OS und Feature und Mondphase ein anderes Resultat entsteht) (ausserdem wird SIL Graphite umgesetzt). Für typografisch Interessierte ist also Firefox der Browser der Wahl.

*Es sei denn – wie Ralf gesagt hat–, die Ladezeit übersteige 3 Sekunden. Das ist aber sowieso eine inakzeptable, übermässige Wartezeit, die wohl nur bei sehr schlechter Internetverbindung, miserablem Server oder abartigen Schriftgrössen auftritt, m.a.W., praktisch nie.

Link zum Beitrag
Joshua K.

Typographie ist allerdings nicht alles. Nur wegen Graphite-Unterstützung auf einen aufgeblähten, speicherfressenden, langsameren Browser umsteigen würde ich nur, wenn ich diese Funktion unbedingt bräuchte.

Nachtrag: Falls gewünscht, können wir einen Browser-Flamewar gerne in einem neuen Thema durchführen. ;-)

Link zum Beitrag
Mach

Wegen Graphite sollte man nicht auf Firefox umsteigen, ausser man verwendet eine der ganz wenigen Schriften mit Graphite. Aber wegen dem OpenType Layout ist es schon eine Erwägung wert, denn wenn irgendeine Smarfont-Technologie verwendet wird, dann am ehesten das OpenType Layout. Auf jeden Fall ist der Flash of Unstyled Text kein Argument mehr gegen Firefox, sondern offenbar nur noch gegen Opera.

Link zum Beitrag
Sebastian Nagel

Unter Windows Vista/7 übrigens auch wegen des Fontrenderings – IE und Firefox nutzen das neuere, doch deutlich schönere Directwrite, Opera und Chrome momentan noch das alte GDI+.

(sofern man geglätteten Text generell mag und nicht True-Oldschool seine Pixel zählen können will).

Link zum Beitrag
Lars Kähler

Ich habe ja mal Software- und Hardwareentwicklung erleben dürfen im Produktmanagement von Linotype-Hell (Produktentwicklung). Von daher nehme ich grundsätzlich rein gar nichts als gegeben hin. Wenn mir also mein alter Trabbi nicht gefällt, kaufe ich mir stattdessen einen Porsche Carrera 911 Cabriolet. Har har!

Ich kann mich wirklich nur wiederholen: Wenn wir im Printbereich noch derartig unfertige Werkzeuge benutzen müssten wie im Web, würden Millionenschäden entstehen. Es hat ~ 50 Jahre gebraucht, bis von der ersten diatype zum heutigen InDesign die tools immer weiter optimiert wurden. Ich bin persönlich von der Adobe-Software sehr angetan bis begeistert, aber das Web befindet sich immer noch in den Kinderschuhen. IMNSHO.

Ich schmolle jetzt auf der grünen Wiese, lasse meinen Computer zu Hause und lese einen schönen Playboy!

Link zum Beitrag
Sebastian Nagel

Kühne Theorie: Das Web hat andere Eigenschaften und Vorzüge – wenn es wie Print sein sollte, könnten wir bei Print bleiben.

Link zum Beitrag
Lars Kähler

Werden wir doch auch. Schon vor 20 Jahren wurde über neue Distributionsformen im Nachrichtensektor nachgedacht. Eine Idee war es gewesen, spezielle Drucker zu entwickeln, die in Hotels oder an Bahnhöfen o.ä. aufgestellt werden, um Zeitungen und ähnliches auszugeben. Wenn ich es wünsche, kann ich ja auch heute meine Inhalte drucken und ausgeben. Ich glaube aber nicht, dass das heutzutage noch groß Sinn macht. Jedenfalls bin ich nicht bereit, beim Stand der heutigen Telekommunikation mehr als 30,- € für Telefon und Internet auszugeben.

Aber da eine ausgewachsene Rollenrotation, sei es nun Heatset, Zeitung oder Triefdruck, etwas kostenspieliger ist als irgendsoein Tintenpisser oder Laser, wird man sich in Sachen Ausgabequalität wohl mit 72 oder 96 dpi begnügen müssen und auf Extras wie Hochglanz, Metalliceffekte und Spotlackierung für's Erste verzichten müssen. Stattdessen bepatzen wir unser "HighTech equipment" weiterhin mit unseren Fingern.

Link zum Beitrag

Diskutiere mit …

Du kannst jetzt schreiben und dich später registrieren. Wenn du bereits einen Account hast, melde dich an, um von deinem Account aus zu schreiben.
Hinweis: Dein Beitrag muss von einem Moderator zunächst freigeschaltet werden.

Gast
Auf dieses Thema antworten ...

×   Du hast formatierten Text eingefügt.   Restore formatting

  Only 75 emoji are allowed.

×   Dein Link wurde automatisch eingebettet.   Einbetten rückgängig machen und als Link darstellen

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

<p>Typography.Guru—Lehrreiche Typografie-Videos auf YouTube …</p>
<p>Typography.Guru—Lehrreiche Typografie-Videos auf YouTube …</p>
<p>Typography.Guru—Lehrreiche Typografie-Videos auf YouTube …</p>
<p>Typography.Guru—Lehrreiche Typografie-Videos auf YouTube …</p>
<p>Typography.Guru—Lehrreiche Typografie-Videos auf YouTube …</p>
<p>Typography.Guru—Lehrreiche Typografie-Videos auf YouTube …</p>
×
×
  • Neu erstellen...

Hinweis

Wie die meisten Websites, legt auch Typografie.info Cookies im Browser ab, um die Bedienung der Seite zu verbessern. Sie können die Cookie-Einstellungen des Browsers anpassen. Anderenfalls akzeptieren Sie bitte die Speicherung von Cookies. Weitere Details in der Datenschutzerklärung