Fuentes de color: una guía para principiantes
Entonces, ¿qué demonios es una fuente de color? Es un término que sigue apareciendo y está comenzando a ganar tracción, aunque su uso en grandes proyectos de diseño aún está en pañales.
Los proveedores como Typekit de Adobe han comenzado a lanzar algunas opciones de fuente de color con soporte de navegador, por lo que hay un movimiento hacia un uso más amplio. Algunos incluso han llamado a las fuentes de color "la próxima gran novedad en diseño web".
Aquí, veremos la tendencia y le dejaremos decidir qué tan grande, o no, será este concepto.
Explore los elementos de Envato
¿Qué es una fuente de color?
Las fuentes de color son casi exactamente como suenan. Tipos de letra que incluyen múltiples colores, sombras o degradados, texturas o transparencias. Estas opciones originales no solo agregan color a las letras, son tipos de letra específicos con todos los detalles incluidos.
Las fuentes de color pueden incluir formas vectoriales, imágenes de mapa de bits o ambas en los archivos de fuentes, lo que puede hacer que estos tipos de letra sean más pesados que los paquetes de fuentes estándar. Los ejemplos comunes de fuentes de color incluyen un tipo de letra o letra emoji que contiene iconos dentro. Las fuentes de un solo color en este estilo a menudo se llaman fuentes cromáticas, porque solo contienen un tono o gris.
El mayor problema con las fuentes de color en este momento es que no hay un formato estándar verdadero. Y hay un problema con todos esos formatos de archivo: las imágenes vectoriales y SVG se pueden escalar con facilidad, pero las versiones de mapa de bits podrían tener limitaciones de tamaño.
En realidad, hay cinco formatos para tratar:
- SBIX (Apple): versión de mapa de bits con soporte nativo en sistemas Mac e iOS
- CBDT (Google): versión de mapa de bits con soporte nativo en sistemas Android
- COLR (Microsoft): versión vectorial con soporte nativo en sistemas Windows 8.1+
- SVG (W3C): versiones de vectores y mapas de bits
- OpenType SVG (Adobe / Mozilla): versiones de vectores y mapas de bits que colocan formas SVG en fuentes OpenType
Por otro lado, los principales jugadores están comenzando a adoptar pautas de uso. Mozilla (la columna vertebral del navegador web Firefox) y Adobe han acordado que OpenType SVG es el formato preferido; otros todavía están en constante cambio cuando toman una decisión.
Si desea entrar en el meollo de cómo funcionan estas fuentes y todas las especificaciones de formato de archivo, Fontself tiene una cartilla bastante buena.
¿Cómo se usan las fuentes de color?
Uno de los dos pensamientos ocurre cuando ve una fuente de color por primera vez:
- Wow, eso es horrible!
- ¡Frio! ¡Sé exactamente cómo usar eso!
No importa en qué campamento se encuentre, hay aplicaciones que son perfectamente adecuadas para las fuentes de color. Pero necesitas usarlos dentro de lo razonable. (Las fuentes de color son para los usos más moderados).
Prueba una fuente de color:
- Para una técnica que llame la atención por una palabra corta
- Para un ícono o elemento de estilo de logotipo
- Para que un capitulo comience un bloque de texto largo
- Para un tratamiento de titular audaz en un diseño de estilo minimalista
- Para enfocar una palabra o palabras específicas en un gran bloque de texto
- Cuando el resto del diseño es simple
- Cuando la tipografía será tu elemento artístico principal
- Cuando el proyecto exige algo divertido e inusual para captar la atención del usuario
- Con imágenes o encima de imágenes
- Con fondos ocupados
- Por mucho texto
- Con muchas otras técnicas de diseño, como animación o movimiento; el color solo suele ser suficiente para crear impacto visual
- Con otros tipos de letra novedosos o especiales
- Adopción y compatibilidad con navegadores para proyectos de diseño web (en este momento, en la impresión aparecen más diseños de fuentes de color debido a problemas de compatibilidad)
- Técnicas generales de estilo y si las técnicas de diseño más ornamentadas y coloridas son tendencias en general
- Fontself es un complemento de Adobe Illustrator o Photoshop que te ayuda a crear fuentes de color personalizadas
- Puedes dibujar y diseñar todo desde cero con este tutorial de Glifos
- FontLab tiene un video tutorial que explica el proceso paso a paso.
- Escribe con orgullo
- Toalla de playa
- Bungee
- Fuente de acuarela
- Bixa Color
- Juguetes de los niños
- OneLine Bold
- Gurú
- Neón
Cómo no usar fuentes de color
Hay más formas de no usar fuentes de color de las que probablemente pueda contar. No querrá volver al diseño del sitio web a algunas de las locuras de color intermitentes, parpadeantes y abrumadoras de la década de 1990.
No use una fuente de color:
Una tendencia en evolución
La tendencia de la fuente de color está comenzando a ganar tracción en algunos de los principales actores de la tipografía. El formato OpenType SVG adoptado por Adobe y Mozilla podría ser la herramienta y el formato que ayuda a que esta tendencia realmente despegue. Adobe incluso recientemente agregó fuentes de color a Photoshop (es posible que haya notado algunos emojis en la paleta de caracteres).
Así es como Adobe explica OpenType SVG:
“OpenType-SVG es un formato de fuente en el que una fuente OpenType tiene todos o solo algunos de sus glifos representados como ilustraciones SVG (gráficos vectoriales escalables). Esto permite la visualización de múltiples colores y gradientes en un solo glifo. Debido a estas características, también nos referimos a las fuentes OpenType-SVG como 'fuentes de color'.
“Las fuentes OpenType-SVG permiten que el texto se muestre con estas cualidades gráficas, al mismo tiempo que se puede editar, indexar o buscar. También pueden contener características OpenType que permiten la sustitución de glifos o estilos de glifos alternativos.
“Las fuentes de color como Trajan Color Concept y EmojiOne Color aparecerán como las fuentes típicas en los menús de fuentes de sus programas, pero es posible que no muestren todo su potencial, ya que muchos programas aún no tienen soporte completo para los componentes de color. Si su programa de software no admite la ilustración SVG dentro de las fuentes, los glifos volverán a un estilo negro sólido. El color aún se puede aplicar a este estilo alternativo, ya que funcionará como una fuente OpenType típica ".
Además, The State of Web Type tiene una sección dedicada a actualizar el soporte del navegador para las fuentes de color para que pueda determinar cuándo es el momento adecuado para dar el paso.
En términos de la evolución de las fuentes de color y la adopción del uso, dos cosas jugarán un papel importante:
Prueba una fuente de color
Si lo suyo son las fuentes de color, puede descargar una fuente de color para comenzar o crear la suya propia, según el tipo de proyecto de diseño.
Crea tu propio
El tipo de fuente de color que crea realmente depende de sus habilidades de software. Una fuente de color puede incluir desde imágenes de tus fotos favoritas hasta hermosas burbujas y trazos en colores degradados. Puede hacerlo completamente por su cuenta o usar una herramienta para ayudar a diseñar una fuente de color personalizada.
Descargar o incrustar
Hay algunas fuentes de colores geniales que están pidiendo que las uses en un proyecto hoy. Aquí hay algunos para impulsar el flujo creativo de su fuente de color (más enlaces a las otras fuentes de color utilizadas anteriormente):
Conclusión
¿Estás listo para saltar a la tendencia de la fuente de color? ¿Es demasiado o el soporte irregular es un problema real para sus proyectos?
Personalmente, creo que esta tendencia es muy divertida y tiene un uso práctico real en proyectos impresos, como carteles o volantes de eventos. Sin embargo, todavía no estoy muy convencido cuando se trata de proyectos de sitios web. El tiempo solo dirá si esta tendencia realmente se convierte en "la próxima gran novedad en diseño web" u otra moda pasajera.
