Advertisement
  1. Design & Illustration
  2. Fonts

Conoce los Diferentes Formatos de Fuentes (OTF, TTF y WOFF)

Scroll to top
Read Time: 9 min

Spanish (Español) translation by Alison Pumapillo (you can also view the original English article)

La diferencia entre un formato de fuente y otro puede ser muy confusa para los diseñadores principiantes. En este artículo, responderemos a todas tus preguntas, como "¿Qué es una fuente TrueType?", "¿Qué es una fuente EOT?", "Cuál es la diferencia entre OTF y TTF?", y mucho más.

Para empezar, hablaremos de los diferentes tipos de formato de fuente para saber cómo se muestran las fuentes en las pantallas. Para continuar, es importante tener una comprensión básica de los diferentes tipos de formato de fuente. Dependiendo del uso, digital o impreso, los formatos de fuentes pueden variar. Una fuente es una representación gráfica del texto que puede contener información como el tamaño del punto, el peso, la anchura y el diseño. Es esencial saber que una familia de fuentes o una tipografía es una colección de fuentes. Por ejemplo, Arial es una tipografía, y Arial Black es una fuente.

También hablaremos de la diferencia entre OTF y TTF, los archivos OTF OpenType y el formato TTF TrueType, así como cuándo y dónde utilizarlos. Las extensiones de los archivos de fuentes pueden resultar intimidantes, pero después de leer este artículo, sabrás cuáles son los mejores formatos de fuentes.

Emerland - Fuente serif, formato de fuenteEmerland - Fuente serif, formato de fuenteEmerland - Fuente serif, formato de fuente
Emerland - Fuente serif

Esta hermosa fuente display vintage viene en formato OTF y en formato de archivos TTF, así como en una versión web optimizada que puede contribuir a que tu sitio web cargue en unos pocos segundos. La fuente es adecuada para la visualización, las etiquetas, los logos y mucho más. Si necesitas un sitio donde conseguir miles de formatos de fuentes en todas las extensiones de archivos de fuentes, visita la enorme biblioteca de fuentes de Envato Elements.

Qué son los formatos de fuentes

Los ordenadores y otros dispositivos digitales pueden mostrar las fuentes de un par de maneras diferentes. Es esencial que los diseñadores conozcan estos tipos de formato de fuente:

  • Fuentes en mapa de bits o rasterizadas: cada carácter está formado por píxeles. Aunque estas fuentes son más rápidas de visualizar para los ordenadores, no son escalables. Esto significa que se necesita una fuente distinta para cada tamaño y estilo.
  • Fuentes vectoriales o escalables: cada carácter está formado por un contorno, lo que permite que la fuente sea escalable. Esto significa que se puede utilizar un único archivo de fuente para cualquier tamaño de punto. Solo se necesita un código adicional para renderizar la fuente al tamaño deseado.

Tipos de formato de fuente

Hay muchos tipos de formato de fuente, y muchos se crean para diferentes sistemas operativos y aplicaciones.

Los formatos de fuentes más utilizados son los formatos de fuente TTF TrueType y los archivos OTF OpenType. Pueden utilizarse tanto en ordenadores Windows como Mac.

Es importante saber qué son los archivos TTF y OTF para utilizar el archivo correcto. Otro tipo de formato de fuente son las tipografías PostScript. Estas fueron desarrolladas por Adobe, pero se volvieron engorrosas debido a que se necesitaban archivos diferentes para PC y Mac.

El formato TTF TrueType no era eficiente porque seguía siendo necesario un formato de fuente diferente para imprimir. Adobe y Microsoft unieron sus fuerzas y crearon los archivos OTF OpenType, que permitía almacenar más información. El formato abierto para la web es eficiente para cargar sitios web gracias a su archivo supercomprimido. Y, por último, las fuentes SVG son el último archivo de formato de fuente en la industria, permitiendo guardar transparencias y efectos en el archivo.

Silvatos, formato de fuenteSilvatos, formato de fuenteSilvatos, formato de fuente
Silvatos

PostScript

Las fuentes PostScript fueron creadas por Adobe. Este tipo de archivo de fuente consta de dos partes diferentes, una que contiene la información de impresión y otra para la visualización en pantalla. La ventaja de este formato de archivo de fuente es la alta calidad de la impresión. La desventaja es que hay dos versiones diferentes para PC y Mac, por lo que podrían surgir complicaciones cuando varios diseñadores tengan que trabajar con un archivo. Cuando una fuente de Mac se abre en un ordenador PC, el archivo no tiene el mismo aspecto. Con el paso de los años, el formato de archivos OTF OpenType se popularizó y el uso de PostScript disminuyó.

¿Qué es una fuente TrueType (fuente TTF)?

¿Qué son los archivos TTF? En la década de 1980, Apple desarrolló el formato de fuente TrueType y posteriormente le otorgó una licencia gratuita a Microsoft. Solo se requería un archivo, pero se incluía un archivo separado para los estilos de fuente (normal, cursiva, negrita, etc.). El formato de archivo de fuente TrueType se utilizaba solo para la pantalla, y un archivo PostScript para la impresión.

Nectura, formato de fuenteNectura, formato de fuenteNectura, formato de fuente
Nectura

¿Qué son las fuentes OpenType (formato OTF)?

¿Te preguntas qué es una fuente OTF? El formato de archivos OTF OpenType fue creado conjuntamente por Adobe y Microsoft. Se basa en el formato de fuente TrueType que admite un conjunto de caracteres más amplio (ligaduras, estilos alternativos, glifos, etc.).

Es el formato OTF es el más idóneo para los diseñadores y los programas de autoedición que ofrecen procesamiento de datos de mapa de bits, así como compatibilidad con archivos vectoriales.

Quizá quieras saber qué es mejor: ¿cuál es la diferencia entre OTF y TTF?, ¿cuál es el mejor formato? La verdad, la diferencia entre OTF y TTF no es demasiada, ambos son iguales, sobre todo si hablamos de los archivos TTF y los archivos OTF modernos. Así que puedes utilizar uno u otro formato de fuente, solo tienes que asegurarte de mantener el mismo formato para evitar tener varias fuentes instaladas.

¿Qué es una fuente de formato abierto para la web (archivos WOFF)?

El archivo de formato abierto para la web, o archivos formato WOFF, es una versión comprimida y exclusiva para la web de los formatos anteriores. Esto significa que las fuentes se descargarán más rápidamente cuando se visualicen en un sitio web. Ten en cuenta que las fuentes de formato WOFF no se puede instalar en tu sistema. Los archivos WOFF suelen cargarse desde el dispositivo del usuario con un número limitado de fuentes. Como alternativa, los diseñadores pueden utilizar un host, como Google Fonts o su propio sitio web, para cargar las fuentes.

Hay una nueva versión de formato WOFF llamada WOFF 2.0 que presenta una mayor compresión. Los archivos WOFF 2.0 ofrecen el mejor formato para la web. Estas fuentes funcionan bien en los sitios web, pero no en los software de gráficos. Aprende a utilizar las fuentes web y descubre el mejor formato de fuente para la web en este vídeo explicativo:

¿Qué son las fuentes OpenType incrustadas?

¿Qué es un tipo de fuente EOT? Desarrollado por Microsoft, los formatos de fuentes OpenType incrustadas son archivos web que solo son compatibles con Internet Explorer. Es una forma del archivo de fuentes OpenType, que ya no se utiliza debido a sus problemas de seguridad.

¿Qué es una fuente SVG?

Durante unos años, el mundo de los formatos de archivo de fuentes no cambió hasta que las fuentes SVG entraron en pleno vigor. Esta nueva versión del archivo de fuentes OpenType permite que los caracteres se muestren en múltiples colores y transparencias, y algunos incluso pueden ser animados.

Las fuentes SVG se conocen como fuentes de color, y como contienen mayor información, el tamaño de los archivos SVG puede ser mayor.
Querins - Fuente de pincel formato SVG, formato de fuenteQuerins - Fuente de pincel formato SVG, formato de fuenteQuerins - Fuente de pincel formato SVG, formato de fuente
Querins - Fuente de pincel formato SVG

Cómo elegir el mejor formato de fuente para tus proyectos o requerimientos

Hay muchos archivos de fuentes que existen hoy en día, y muchos que todavía están en desarrollo, por lo que puede ser confuso saber cuándo utilizar cada uno. Con la incorporación de los navegadores web y los navegadores móviles, estar informado sobre qué archivos son los mejores puede ayudarte a optimizar tus proyectos. Aquí tienes una hoja con consejos sobre cuándo utilizar cada archivo de fuentes:

  • Elige una fuente TTF/OTF: Si quieres una compatibilidad total entre navegadores y sistemas operativos. Los formatos de fuente TTF de la vieja escuela y las modernas fuentes TTF y OTF pueden ser útiles para ampliar la compatibilidad en los navegadores de Internet más antiguos, especialmente en los dispositivos móviles.
  • Elige el formato WOFF: Si utilizas un navegador moderno, el formato WOFF engloba tanto el formato TTF como el formato OTF en un único archivo comprimido. ¡Es más ligero a la hora de cargar!
  • Elige los archivos WOFF 2.0: La versión más reciente desarrollada por Google. Los archivos WOFF 2.0 son los mejores por su reducido tamaño y por su mayor rendimiento de carga en navegadores modernos.
  • Elige el formato SVG: Para trabajos gráficos que requieran efectos especiales como animación, profundidad de color y múltiples transparencias. En ocasiones, este formato también puede utilizarse para en sitios web, pero algunos navegadores han eliminado por completo el soporte del formato, como Chrome.
Gentala, formato de fuenteGentala, formato de fuenteGentala, formato de fuente
Gentala

Los mejores vídeos sobre los formatos de archivos de fuentes

Ahora que ya sabes más sobre las extensiones de archivos de fuentes y te hemos explicado los diferentes formatos de fuentes, aquí tienes unos cuantos vídeos útiles del canal de YouTube de Envato Tuts+:

Cómo instalar una fuente en Windows 10

Si tienes curiosidad por saber cómo instalar fuentes en Windows, échale un vistazo al vídeo Cómo instalar una fuente en Windows 10. Este vídeo también te enseñará cómo desinstalar en caso de que no sepas cómo eliminar fuentes.

Cómo instalar una fuente en una Mac

Este vídeo es una excelente guía sobre Cómo instalar una fuente en una Mac. También aprenderás a desinstalar y eliminar una fuente, a desactivar y habilitar fuentes para sistemas Mac utilizando FontBook.

Cómo añadir fuentes a Photoshop (Mac y Windows)

Aprende a utilizar Adobe Fonts para instalar fácilmente fuentes para Adobe Photoshop, así como otras formas de instalar fuentes tanto para Windows como para Mac.

Cómo subir fuentes a Cricut Design Space

Si eres un fan de Cricut, este sencillo y práctico tutorial puede ayudarte a subir fuentes a Cricut. Explora nuevas fuentes y crea novedosas manualidades aprendiendo a instalar fuentes correctamente.

¡Aprende todo sobre los formatos de fuentes!

En este artículo, hemos hablado sobre los formatos de archivo de fuentes más populares que hay que conocer, archivos TTF, fuentes TTF, formatos OTF, formatos TTF, etc., además de que aprendimos cómo y cuándo usarlos. Respondimos a tus preguntas sobre qué es son las fuentes de formato TTF TrueType, la diferencia entre OTF y TTF, las fuentes OpenType y TrueType, además de que descubrimos cuál es el mejor formato. Por último, también hablamos del mejor formato de fuente para la web y en qué casos se debe utilizar cada uno.

Asegúrate de ver los vídeos para aprender a instalar los diferentes tipos de formato de fuente y aprender más sobre las fuentes web.

Si estás interesado en conocer más formatos de fuentes, no te olvides de consultar estos artículos:

Advertisement
Did you find this post useful?
Want a weekly email summary?
Subscribe below and we’ll send you a weekly email summary of all new Design & Illustration tutorials. Never miss out on learning about the next big thing.
Advertisement
Start your 7-day free trial*
Start free trial
*All Individual plans include a 7-day free trial for new customers; then chosen plan price applies. Cancel any time.