¿Cómo accedo a las características de fuente en CSS?

Question

Tengo una fuente que deseo usar en un sitio web, y necesito acceder a las distintas características de fuentes alternativas (específicamente, las características seleccionadas aquí: http://myfonts.us/uOmsiF).

sé Mozilla tiene la característica -moz-font-feature-settings css, pero necesito dos cosas más:

1. una manera de hacer esto para los navegadores WebKit (si es posible, el apoyo a las últimas versiones de IE);
2. cómo resolver lo que debería poner como el valor de las propiedades -moz-font-feature-settings (¿Hay una herramienta? ¿Una norma?).

Prefiero usar soluciones CSS, pero si hay alguna otra forma basada en JavaScript que probablemente funcione en la mayoría de las plataformas, definitivamente usaría eso.

Editar: acabo de encontrar la especificación OpenType: http://www.fontfont.com/opentype/FF_OT_UserGuide_v2.pdf y también el proyecto de CSS3: http://dev.w3.org/csswg/css3-fonts/#font-variant-alternates-prop Edición 2: Mi solución fue crear el texto en XeLaTeX, a continuación, convertir eso a SVG. Obviamente, esto no sería una solución para una gran cantidad de texto, pero funciona bien para un logotipo de texto.

Answer 1

Actualmente, ningún navegador excepto Firefox 4 admite font-feature-settings (e incluso entonces usa la extensión de proveedor de Mozilla). El CSS3 Fonts module documenta esa propiedad, sin embargo, como es parte de CSS3, otros navegadores deberían soportarlo eventualmente.

No estoy seguro de ninguna solución basada en JavaScript.

Answer 2

La materia--configuración de las funciones de la fuente es ahora realmente soportados en WebKit https://bugs.webkit.org/showdependencytree.cgi?id=63796&hide_resolved=1 aunque todavía no en OSX https://bugs.webkit.org/show_bug.cgi?id=69826#c0

Y ahora en el IE/Trident también (IE10 Platform Preview).

Yay por poder hacer una tipografía real en la Web.

Answer 3

Según lo indicado por sideshowbarker, CSS font-feature-settings ahora son mucho más compatibles. Se pueden hacer con todos los prefijos de proveedores conocidos:

• -webkit- (Google Chrome)
• -moz- (Mozilla Firefox)
• -MS- (IE 10+)
• - o- (Opera)

Desafortunadamente, todavía no son compatibles con Safari. Tampoco son compatibles con IE 9 y versiones anteriores. A partir del 26 de noviembre de 2012, esto haría que los buscadores que no lo soportan alrededor del 34% de acuerdo con StatsCounter. Este es un margen bastante grande, pero está bajando todo el tiempo.

Personalmente, usaría una imagen en lugar de la fuente en este momento. 34% de algo es una cantidad bastante grande. Si estaba comprando y encontré un pastel que no le gustó al 34% de las personas que comieron, no lo compraría.

Sin embargo, si realmente quiere usar font-feature-settings entonces recomiendo este article by Font Deck o this one que realmente las características en acción.

Aunque parece que ya respondió su pregunta, pensé que ampliaría este tema. sideshowbarker tenía algunos puntos importantes, pero pensé que solo necesitaban una aclaración (y si solo tuviera 15 reputación, ¡te votaría, hermano!)