Fuente Typekit en icono SVG

Estoy tratando de lograr que mi logotipo se muestre correctamente en mi sitio web. He creado un icono SVG en Illustrator con una fuente de Adobe Typekit, es Proxima Nova. El icono SVG con texto se muestra correctamente en Chrome, no en Firefox ni en ningún navegador móvil.

¿Alguien tuvo problemas similares antes?

Respuestas (2)

Es una buena práctica convertir todas las fuentes en contornos al exportar a SVG; de lo contrario, la fuente debe instalarse en el sistema operativo de los usuarios. Como Proxima Nova no está incluida en ninguna biblioteca de fuentes del sistema operativo, el navegador utiliza una familia de fuentes estándar diferente. Solo unos pocos navegadores admiten fuentes SVG (consulte aquí ), por eso mostrará una fuente diferente incluso si tiene instalado Proxima Nova en su sistema operativo.

Para convertir la fuente, seleccione convert to outlineen el cuadro de diálogo de guardar (ver imagen; sry para alemán).

De esta manera, su logotipo debería mostrarse correctamente en todos los navegadores.

ingrese la descripción de la imagen aquí

Su enlace 'caniuse' se refiere a fuentes SVG, no a texto dentro de SVG.
@ Code 3 esto hizo el trabajo, ¡gracias por su respuesta!

Al convertir el texto en un esquema, dejará de ser texto y los motores de búsqueda no podrán indexar su contenido (hasta que puedan interpretar los esquemas, lo que probablemente vendrá). Aunque SVG admitirá fuentes web a través de CSS, actualmente no es una opción con Typekit, que depende de un fragmento de JavaScript incrustado en una página web. Esto parece un desafío programático por ahora; parece que hay un complemento de jQuery que te permitirá hacer la mayor parte del camino, si no todo: https://github.com/willemvb/svg-typekit

Buen punto sobre el SEO. Si hay espacio, ¿hay algún inconveniente en tener por separado un segundo conjunto de texto convertido a la ONU en exactamente el mismo color que el fondo (por lo tanto, sería legible por máquina, pero no por humanos)?
Fuente Typekit en icono SVG
RespuestasAquíPolítica de privacidad1y, 0v