2012-09-29 7 views
8

Das könnte ein bisschen voreilige Schlussfolgerung sein, aber meine Frage entstand, als ich feststelle, dass FontSquirrel.com nicht den Smiley (☺) mit their @font-face generator erzeugt.Ist der Smiley (☺) in @ font-face noch relevant?

Statt der üblichen kugelsicher Standard (as laid out by Paul Irish in Bezug auf den Smiley), der @font-face Generators FontSquirrel erzeugt nur das:

@font-face { 
font-family: 'sansationregular'; 
src: url('sansation_regular-webfont.eot'); 
src: url('sansation_regular-webfont.eot?#iefix') format('embedded-opentype'), 
    url('sansation_regular-webfont.woff') format('woff'), 
    url('sansation_regular-webfont.ttf') format('truetype'), 
    url('sansation_regular-webfont.svg#sansationregular') format('svg'); 
font-weight: normal; 
font-style: normal; 
} 

ich es realisieren könnte voreilig sein, dass zu dem Schluss, durch FontSquirrel den Smiley verlassen den Smiley bedeutet ist nicht länger relevant, aber wenn man bedenkt, dass FontSquirrels @font-face Generator der beliebteste und meistgenutzte Generator ist, frage ich mich, warum sie den Smiley nicht mehr aufnehmen. Vor allem, weil sie scheinen, es vorher enthalten zu haben ...

Nur für den Fall, dass jemand nicht mit dem Smiley vertraut ist, gibt es a good explanation here.

+1

Wo ist das 'local()' in der FS-Variante? – Knu

+0

@Knu: genau meine Frage, sie scheinen es nicht mehr zu enthalten. – deathlock

Antwort

5

EDIT - lief in einige weitere Informationen, die Zinsen können: https://stackoverflow.com/a/4520467/1455709

Android 2.2 Geräte aus local() Nutzung, Ihre @font-face nicht funktionieren überhaupt leiden.

Ich kann bestätigen, dass auf Android 2.3.6 (Standardbrowser) local() Ihre @font-face Erklärung brechen wird.

Android 4.0 (Standardbrowser) funktioniert gut mit local().

Unsicher von allem dazwischen. Also noch einmal, ich denke, es hängt von Ihrer Benutzerbasis ab, oder von der Anstrengung, die Sie mit mehreren Stylesheets machen wollen, um sicherzustellen, dass Ihre Schriftart funktioniert überall.


Nun, sie generieren nur den Code, der benötigt wird, um Ihre Schriftart in allen Browsern anzuzeigen. Es ist Ihre Entscheidung, ob Sie das "Risiko" eingehen wollen, ob der Benutzer eine Schriftart mit diesem Namen lokal installiert hat.

Hängt von Ihrem Publikum ich würde sagen.

  • Installiert jemand wirklich Schriftarten auf ihrem lokalen Rechner? Viele Leute auf dieser Seite könnten, Designer trotzig, aber die Öffentlichkeit? Wahrscheinlich nicht.

  • Was ist die Chance, dass die verwendete Schriftart den gleichen Namen wie eine andere Schriftart hat? Klein.

  • Welche Chance hat der Benutzer, dass bestimmte andere Schriftart installiert ist? Sehr klein.

  • Wenn Sie sicherstellen möchten, dass der Benutzer Ihre bestimmte Schriftart herunterlädt und verwendet, verwenden Sie sie.

    Wenn Sie Windows-Schriftarten verwenden möchten (Sie sind wahrscheinlich nicht erlaubt) und wollen sie auf Macs sichtbar, dann möchten Sie nicht das Smiley-Gesicht verwenden, um jeden Windows-Benutzer vom Herunterladen einer Schriftart sie zu speichern habe schon (das ist eigentlich das gleiche).

    Wenn Sie eine benutzerdefinierte Schriftart namens "Verdana" verwenden möchten, werden Sie trotzig ein Smiley verwenden wollen.Das, oder machen Sie die font-family einzigartig ... Ich denke mit einem Smiley-Gesicht ... Aber das würde chaotisch aussehen, also verwenden Sie das lokale Attribut.

    +1

    Kommen Sie nach einem Jahr auf diese Frage zurück, haben Sie das gesehen? http://www.fontspring.com/blog/the-new-bulletproof-font-face-syntax Ist es sicher, dieser Regel zu folgen? – deathlock

    +0

    @deathlock das ist was ich benutze. – Patrick

    +1

    Ist es jetzt die beste Praxis? – deathlock

    0

    Die neueste "kugelsichere" Methode kann immer unter Verwendung von fontsquirrel's WEBFONT GENERATOR gefunden werden.

    So seit dem Schreiben Ihrer Frage wurde .woff2 Unterstützung hinzugefügt.

    Wer möchte klären, was die aktuelle Methode ist, sollten Sie folgendes tun.

    Laden Sie eine tiny font file und das wird eine Zip-Datei mit Ihrer Schriftart in alle Formate konvertiert generieren, aber noch wichtiger, es enthält auch eine CSS-Datei mit der "Bullet Proof" -Methode.

    Das sieht derzeit so aus.

    @font-face { 
        font-family: 'font-name'; 
        src: url('fontawesome-webfont-webfont.eot'); 
        src: url('fontawesome-webfont-webfont.eot?#iefix') format('embedded-opentype'), 
         url('fontawesome-webfont-webfont.woff2') format('woff2'), 
         url('fontawesome-webfont-webfont.woff') format('woff'), 
         url('fontawesome-webfont-webfont.ttf') format('truetype'), 
         url('fontawesome-webfont-webfont.svg#font-name') format('svg'); 
        font-weight: normal; 
        font-style: normal; 
    
    }