Anzeige:
Ergebnis 1 bis 8 von 8

Thema: CSS, downloadable fonts

Hybrid-Darstellung

Vorheriger Beitrag Vorheriger Beitrag   Nächster Beitrag Nächster Beitrag
  1. #1
    Registrierter Benutzer Avatar von BlueJay
    Registriert seit
    27.08.2004
    Beiträge
    825

    CSS, downloadable fonts

    Hallo Leute,

    diesmal brauche ich ein paar Informationen zu downloadable fonts.

    Ich habe den Font folgendermaßen eingebunden:

    Code:
    <style type="text/css">
    @font-face {
      font-family:sprockytown;
      src: url(sprockytown.ttf);
    }
    </style>
    
    ...
    <p style="font-family:sprockytown"> blabla</p>
    Problem:
    lokal funktioniert alles mit Mozilla, Chrome und Opera,
    online nur Mozilla (und wenn man die Alternativschrift weglässt).

    Bei Chrome und Opera ist es so, dass die korrekte Schrift kurz erscheint, dann aber auf die Alternativschrift gesprungen wird. IE stellt sich ganz taub, auch offline.

    sprockytown.ttf ist ein normaler .ttf
    Es spielt auch keine Rolle, ob ich den Font online mit http://www.unsere_seite.de/sprockytown.ttf einbinde.


    Was läuft da schief?

    Gruß,
    Ulrike

    p.s. zu sehen hier

    p.p.s: IE zeigt nach Umwandeln des Fonts in .eot ebenfalls den Font an, aber nur lokal. Online blitzt der richtige Font kurz auf, wird dann von einem Alternativ-Font wieder überschrieben.
    Geändert von BlueJay (09-12-2011 um 10:02 Uhr)
    Eigentlich ganz einfach, wenn man's weiss!

  2. #2
    Registrierter Benutzer Avatar von undefined
    Registriert seit
    01.03.2004
    Beiträge
    1.255
    Das muss ich dich Enttäuschen.
    Das laden von Fonts ist bei w3c schon seit CSS 2.1 nicht mehr verfügbar, wird daher auch von dem meisten Browsern in der Entwicklung nicht weiter verfolgt.

    Diese Funktionen wurden von vielen Browsern komplett unterschiedlich verwendet.
    Code:
    <style type="text/css">
     @font-face { font-family:Kino; src:local(Kino MT), url(kino.ttf) format(TrueType); }
     @font-face { font-family:MeineArt; url(http://www.example.org/cgi-bin/myfont.pl) format(intellifont) }
     @font-face { font-family:Alabama; url(alab.fon); panose-1: 2 4 5 2 5 4 5 9 3 3; }
    </style>
    Noch schlimmer war der IE hier konnte man nur mit einem Speziellen Generator einen abstrusen MimeType angeben.
    Irgendwo habe ich noch ein Tool dafür herumliegen.
    Geändert von undefined (09-12-2011 um 15:17 Uhr)
    mfg undefined
    --
    Undefined Behavior (undefiniertes Verhalten) bedeutet meistens etwas ungültiges.
    xhtml Debugger

  3. #3
    Registrierter Benutzer Avatar von BlueJay
    Registriert seit
    27.08.2004
    Beiträge
    825
    Stimmt schon, aber bei CSS3 sind sie wieder dabei. Den Font für den IEÄh habe ich auch brav mit WEFT nach eot konvertiert, lokal wurde er dann angezeigt.

    Da der korrekte Font im Netz bei den Browsern kurz erscheint, bevor er wieder überschrieben wird (sieht man, wenn die Ladezeiten etwas länger sind), tippte ich zunächst auf Lizenzprobleme, aber es sind frei downloadbare Fonts. Die Sache passiert auch mit den Squirrel-Fonts.

    Gruß,
    Ulrike
    Eigentlich ganz einfach, wenn man's weiss!

  4. #4
    Registrierter Benutzer Avatar von undefined
    Registriert seit
    01.03.2004
    Beiträge
    1.255
    Das ist mal Interessant .
    OK - Paar Tips.
    1) font-face wird nicht beim Content Cache Control berücksichtigt! Das heißt Änderung ist gleich Cache leeren Browser neu starten.
    2) Dein Font heißt "Premiere Free Style DB" und nicht Dateiname Guckts du hier Am besten mit einem Fontviewer wie KfontView oder gleichen erst mal ansehen!
    3) Tip - erst local setzen dann src url
    4) und zuletzt siehe meine Pfad definitionen

    PS: Wird nicht von Konqueror und Webkit1 unterstützt.

    Edit: Opera 11.11 unterstützt es.
    Geändert von undefined (09-12-2011 um 19:43 Uhr)
    mfg undefined
    --
    Undefined Behavior (undefiniertes Verhalten) bedeutet meistens etwas ungültiges.
    xhtml Debugger

  5. #5
    Registrierter Benutzer Avatar von BlueJay
    Registriert seit
    27.08.2004
    Beiträge
    825
    Ja, so hieß er, als wir ihn gekauft hatten, ist schon ein paar Jährchen her (fast C-64-Zeiten).
    W3C sagt, dass der Name egal ist, und so läuft es auch bei Mozilla und den anderen Browsern (lokal).
    Der IE-Teil bekommt den Premier, weil/wie er vom WEFT angegeben wurde, und lokal läuft der. Nur online halt nicht.

    Dann habe ich einen anderen freien Font downgeloaded, mit einem online-Tool in otf konvertiert, und da ist es wieder dasselbe.

    Heisst local nicht: siehe nach, ob der schon auf Platte ist? Die findet er natürlich auf Anhieb.
    Wäre zum Testen nicht sinnvoll! Deshalb habe ich es ja auch mit den Squirrel-Fonts probiert, die nie meine Platte gesehen haben.

    Was dein Beispiel angeht: in Mozilla sehe ich den Font, im IE 9.0.8 nicht.

    Gruß,
    Ulrike

    p.s. beim Opera und Chrome war es wirklich der Cache. Da hatte er wohl bei mir auf Platte den P. kurz gefunden und erst mal genommen.
    Heisst, dass ich mit meiner Syntax nicht so ganz falsch liege.
    Als ich den Trick beim IE9 probierte, sah ich die (lokale) Schrift so lange, bis er mit dem Laden fertig war, dann war wieder sense (Arial). Also klappt da der Download wohl nicht.
    Geändert von BlueJay (10-12-2011 um 10:36 Uhr)
    Eigentlich ganz einfach, wenn man's weiss!

  6. #6
    Registrierter Benutzer Avatar von undefined
    Registriert seit
    01.03.2004
    Beiträge
    1.255
    Klar liegst du mit der Syntax richtig
    Ich musste Gestern auch erst mal nachlesen was sich geändert hat weil ich dieses Thema schon vor Jahren abgelegt hatte.

    Zum Thema Caching und das verhalten zu local().
    Firefox/Opera und andere Browser die auf Freetype2 zurückgreifen ist der Dateiname nicht relevant. Freetype Interessiert es nicht wie die Datei heißt, sie werden immer in einem abgesicherten Modus gespeichert. Siehe unter linux die Manpages zu fc-cache oder FcFreeTypeQuery.

    Hierdurch ergibt sich folgende Arbeitsweise:
    1. Download der Datei
    2. Verarbeitungs Anfrage an font-config oder Freetype2
    3. Rückmeldung


    Als Rückgabe Wert kommt der im Cache ermittelte Name.
    Aus dem Grunde habe ich local() vor src stehen.
    Code:
    src: local('Name'), /* aus dem  cache zeigt auf */
    url('Quelle');
    Der erste Name ist ja nur ein Alias.
    Der Browser Verarbeitet/Liest diese Anfrage zweimal. (Im Webkit oder meinem xhtmldbg kannst du das gut sehen wenn der Timeline/Renderer aktiviert ist.)

    Beim IE wird der Syntax nicht so behandelt.
    Er erkennt zwar den @font-face src wird aber Komplett Ignoriert.
    Mir fällt nur nicht mehr ein welchen Font IE an nimmt. TTF auf jeden fall nicht.

    Edit Link: http://stackoverflow.com/questions/4...e8-but-not-ie9
    Geändert von undefined (10-12-2011 um 13:07 Uhr)
    mfg undefined
    --
    Undefined Behavior (undefiniertes Verhalten) bedeutet meistens etwas ungültiges.
    xhtml Debugger

  7. #7
    Registrierter Benutzer
    Registriert seit
    07.07.2012
    Beiträge
    2
    Stimmt schon, aber bei CSS3 sind sie wieder dabei. Den Font für den IEÄh habe ich auch brav mit WEFT nach eot konvertiert, lokal wurde er dann angezeigt.

    Da der korrekte Font im Netz bei den Browsern kurz erscheint, bevor er wieder überschrieben wird (sieht man, wenn die Ladezeiten etwas länger sind), tippte ich zunächst auf Lizenzprobleme, aber es sind frei downloadbare Fonts. Die Sache passiert auch mit den Squirrel-Fonts.

    _________________

    Gafas Armani 2012

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •