¿Sigue siendo relevante el uso del emoticón (☺) en @ font-face?

Question

Esto podría ser un poco de conclusión precipitada, pero mi pregunta surgió cuando encuentro que FontSquirrel.com no genera el smiley (☺) con their @font-face generator.

En lugar de la estándar de prueba de balas habitual (as laid out by Paul Irish con respecto a la sonriente), el generador del FontSquirrel @font-face genera sólo esto:

@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; 
} 

Soy consciente de que podría ser demasiado precipitado concluir que por FontSquirrel abandonar la sonrisa significa la sonrisa ya no es relevante, pero teniendo en cuenta que el generador de FontSquirrel @font-face parece ser el generador más popular y más utilizado, me pregunto por qué ya no incluyen el emoticono. Especialmente porque parecen haberlo incluido antes ...

Por si alguien no está familiarizado con el emoticono, hay a good explanation here.

Answer 1

EDITAR - se topó con algo más de información que puede interesar: https://stackoverflow.com/a/4520467/1455709

dispositivos Android 2.2 sufrirán de local() uso, su @font-face no funcionará en absoluto.

Puedo confirmar que en Android 2.3.6 (navegador predeterminado) local() se romperá su declaración @font-face.

Android 4.0 (navegador por defecto) funciona bien con local().

No estoy seguro de todo lo demás. Así que de nuevo, creo que depende de su base de usuarios o del esfuerzo que desea realizar con varias hojas de estilo para asegurarse de que su fuente funcione en todas partes.

---

Bueno, solo están generando el código necesario para mostrar su fuente en todos los navegadores. Es su decisión si desea tomar el "riesgo" de si el usuario tiene una fuente con ese nombre instalado localmente.

depende de su audiencia, diría.

• ¿Alguien realmente instala las fuentes en su máquina local más? Mucha gente en este sitio podría, los diseñadores desafiante, ¿pero el público en general? Probablemente no.

• ¿Cuál es la probabilidad de que la fuente que utiliza tenga el mismo nombre que otra fuente diferente? Pequeña.

• ¿Cuál es la probabilidad de que el usuario ha determinado que otra fuente instalada? Muy pequeña.

Si desea asegurarse de que el usuario descarga y utiliza su fuente en particular, úselo.

Si desea utilizar fuentes de Windows (probablemente no esté permitido) y quiere que estén visibles en Mac, entonces no querrá usar la carita sonriente, para evitar que cada usuario de Windows descargue una fuente ya tengo (que en realidad es lo mismo).

Si desea utilizar una fuente personalizada llamada 'Verdana' definitivamente querrá usar una carita sonriente.Eso, o haga que el font-family sea único ... supongo que con una cara sonriente ... Pero eso sería desordenado, así que use el atributo local.

Answer 2

El método más nuevo "a prueba de balas" siempre se puede encontrar utilizando fontsquirrel's WEBFONT GENERATOR.

De modo que desde que escribimos su pregunta, se ha agregado el soporte .woff2.

Cualquiera que desee aclarar cuál es el método actualizado, debe hacer lo siguiente.

Cargue un archivo tiny font file y esto generará un archivo zip con su fuente convertida en todos los formatos pero, lo que es más importante, también contiene un archivo CSS con el método "prueba de bala".

que actualmente tiene este aspecto.

@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; 

}