2012-08-22 22 views
16

Normalmente, uso "Helvetica Neue" para las fuentes en algunos sitios web, aunque al buscar en otros sitios, he visto algunos con "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue".Uso de Helvetica Neue en un sitio web

¿Hay alguna razón para hacer referencia a Helvetica Neue de esta manera? ¿O debería seguir con la normalidad que uso?

Respuesta

17

Están adoptando un enfoque "selectivo" para hacer referencia a la fuente. El navegador intentará hacer coincidir cada nombre de fuente con las fuentes instaladas en la máquina del usuario (en el orden en que se han enumerado).

En su ejemplo "HelveticaNeue-Light" se probará primero, si esta variante de fuente no está disponible el navegador intentará "Helvetica Neue Light" y finalmente "Helvetica Neue".

Por lo que sé "Helvetica Neue" no se considera una 'fuente web segura', lo que significa que no podrá confiar en que se instale para toda su base de usuarios. Es bastante común definir "serif" o "sans-serif" como una posición predeterminada final.

Para utilizar fuentes que no son "seguras para la Web", deberá utilizar una técnica conocida como incrustación de fuentes. Las fuentes incrustadas no necesitan instalarse en la computadora de un usuario, sino que se descargan como parte de la página. Tenga en cuenta que esto aumenta la carga útil general (al igual que una imagen) y puede tener un impacto en los tiempos de carga de la página.

Un gran recurso para fuentes gratuitas con licencias de código abierto es Google Fonts. (Todavía debe verificar las licencias individuales antes de usarlas). Cada fuente tiene un enlace de descarga con instrucciones sobre cómo incrustarlas en su sitio web.

+0

Sí, no creo que sea seguro para la Web, pero es una fuente excelente. ¿Hay algún lugar donde pueda descargar la fuente web y un kit de @ font-face? ¿O tienes que tener una licencia? – user1505209

+7

Helvetica Neue no está presente en Linux o en Windows. El enfoque más seguro es usar una pila completa: 'font-family:" Helvetica Neue ", Helvetica, Arial, sans-serif' – depa

+2

@ user1505209 Helvetica Neue es una fuente que necesitaría una licencia. Tenga en cuenta que muchas de las compras de 'fuente web' vienen con restricciones sobre la cantidad de veces que se puede 'ver' una fuente.Esto puede variar mes a mes, o un conteo total. Si tiene un sitio con mucho tráfico, esto puede resultar excepcionalmente costoso: http://www.linotype.com/1266/NeueHelvetica-family.html?site=webfonts&format=ot-cff&branding=pro. Si quieres una alternativa gratuita, puedes probar Liberation Sans: http://graphicdesign.stackexchange.com/a/15464 – haxxxton

0

Suponiendo que ha hecho referencia a su fuente y la ha integrado correctamente en su sitio (presumiblemente utilizando un kit de @ font-face), debería estar bien simplemente hacer referencia a la suya de la forma en que lo hace. Es de suponer que es así, por lo que tienen retrocesos en el caso de que algunos navegadores no procesen correctamente las fuentes.

+0

Bueno no he Agregó Helvetica Neue como un kit de @ font-face. ¿Sería mejor si lo hiciera? – user1505209

+0

Sí, lo necesitará, Helvetica no será una fuente estándar web, lo que significa que no se procesará para muchos navegadores. Debes comprar una licencia para la fuente y generar un kit de @ font-face para ella. Aunque algunas fuentes han sido restringidas por su creador para que no se conviertan en fuentes web –

+0

Nadie lo hace debido al precio de la licencia web de aproximadamente $ 1k. Es mejor usar otra fuente como alternativa o una fuente completamente diferente. A menos que esté trabajando en un sitio realmente grande y digno. – actimel

34

Me gustaría recomendar este artículo sobre trucos CSS por Chris Coyier titulado Mejor Helvetica:

http://css-tricks.com/snippets/css/better-helvetica/

Básicamente recomienda la siguiente declaración para cubrir todas las bases:

body { 
    font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
    font-weight: 300; 
} 
+0

¡Gracias! Sí, noté su artículo y me pregunté por qué hace referencia a Helvetica Neue de esa manera. – user1505209

+1

@BillyMoat, ¿por qué algunos nombres de fuentes están entre comillas y algunos no? ¿Es eso así? –

+0

@ Ĭsααct ի εβöss Eso solo es necesario para aquellos que tienen un espacio en ellos – Julix

Cuestiones relacionadas