DGPC Cátedra Díaz Cortez Clase 5
Introducción a la Tipografía WEB
🔓 Fuentes con Licencia Permisiva
🔓 Las fuentes libres u open source son tipografías que garantizan a cualquier usuaria/o la libertad de descargarlas, usarlas, estudiarlas, modificarlas y redistribuirlas, sin depender del lucro. Ejemplo principal: licencias como la SIL Open Font License (OFL).
Uso libre y gratuito: Pueden usarse, estudiarse, modificarse y redistribuirse sin costo, incluso con fines comerciales
Modificación permitida: Se permite alterar los archivos fuente, crear variantes o derivadas
Redistribución flexible: Pueden incluirse en software, documentos, aplicaciones o paquetes, siempre que se mantenga la licencia original
Sin restricciones de plataforma: Funcionan en desktop, web, apps, impresión, streaming, etc., sin licencias adicionales
Atribución opcional: Aunque se valora el reconocimiento al autor, generalmente no es obligatorio para usar la fuente
Condición clave: Las versiones de fuentes de licencia permisiva modificadas no pueden venderse como producto independiente, y deben mantenerse bajo la misma licencia OFL
Link a ka licencia sil:
https://openfontlicense.org/documents/OFL.txt
Fuente:
🔒 Fuentes con Licencia Propietaria / Comercial
🔒 Acceso bajo pago o acuerdo: Requieren compra de licencia o suscripción para uso legal. Ejemplo principal: License EULA
Restricciones de uso específicas: La licencia define claramente:
Número de usuarios/dispositivos permitidos
Plataformas autorizadas (desktop, web, app, broadcast)
Ámbito personal o comercial
Duración perpetua o temporal
Prohibición de modificación: No se permite alterar los archivos fuente ni crear derivadas sin autorización expresa
Protección de identidad: Los nombres de fuente suelen estar reservados; no pueden usarse para identificar versiones modificadas
Condición clave: Las versiones de fuentes de licencia propietaria modificadas no pueden venderse como producto independiente, y deben mantenerse bajo la misma licencia EULA
⚠️ No está permitido utilizar fuentes propietarias en este Práctico
Usar una fuente propietaria sin licencia adecuada puede derivar en reclamos por derechos de autor, multas o daños reputacionales
Algunas licencias web ahora son temporarias y no perpetuas.
Ciertas fundiciones cobran tarifas adicionales según alcance (views, followers, tráfico), lo que exige lectura atenta de los términos
🌐 Formato de fuente tipografica woff y woff2
Ⓜ️ Tipografía web WOFF1.0
Woff 1.0, o simplemente "WOFF" (Web Open Font Format) se convirtió en un estándar oficial del W3C el 13 de diciembre de 2012. Su período de mayor uso y dominio absoluto como estándar web abarcó desde finales de 2012 hasta aproximadamente 2018, cuando el formato WOFF 2.0 comenzó a reemplazarlo como la opción optimizada moderna.
Ⓜ️ Tipografía web WOFF2.0
Cuál es el estándar actual de archivo de fuente tipográfica web? En 2026, el estándar actual de formato de archivo de fuente tipográfica WEB es WOFF2
Desde cuándo el estándar de archivo de fuente tipográfica web es WOFF2? WOFF2 se convirtió en el formato estándar y más eficiente para fuentes web a nivel mundial de forma progresiva. Fue introducido por Google en 2012, pasó a ser una recomendación oficial del W3C en 2018 y alcanzó su estatus de estándar universal al lograr compatibilidad total en todos los navegadores principales a partir de 2020.
Qué mejoras ofrece WOFF2?
Compresión extrema: Woff2 Utiliza el algoritmo Brotli, logrando archivos de un 20% a un 30% más pequeños que su predecesor WOFF.
Mayor Rendimiento: Woff2 Reduce drásticamente los tiempos de carga de las fuentes en las páginas web.
Compatibilidad y Respaldo: Woff2 Es compatible con todos los navegadores modernos. Sin embargo, para asegurar una correcta visualización en equipos o navegadores muy antiguos, la buena práctica actual en CSS es usar una estrategia de respaldo css :
@font-face {
font-family: 'MiTipografia';
src: url('mi-fuente.woff2') format('woff2'),
url('mi-fuente.woff') format('woff');
}
✅ Buscar fuentes con Licencia Permisiva
✅ Descargar fuentes en formato woff2
https://gwfh.mranftl.com/fonts
Es una herramienta gratuita diseñada para descargar fuentes en formatos modernos (como .woff y .woff2) para que puedas hospedarlas de forma local en tu servidor web.
Ejemplo descargamos la fuente inter, seleccionamos 3 variantes especificas
Nos descarga las fuentes seleccionadas en formato woff2 y además nos provee el código css para agregar a nuestra hoja de estilos y así utilizarla directramente desde nuestro servidor.
/* inter-100 - latin */
@font-face {
font-family: 'Inter';
font-style: normal;
font-weight: 100;
/* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
src: url('../fonts/inter-v20-latin-100.woff2') format('woff2');
}
/* inter-regular - latin */
@font-face {
font-family: 'Inter';
font-style: normal;
font-weight: 400;
src: url('../fonts/inter-v20-latin-regular.woff2') format('woff2');
}
/* inter-900 - latin */
@font-face {
font-display for other options. */
font-family: 'Inter';
font-style: normal;
font-weight: 900;
src: url('../fonts/inter-v20-latin-900.woff2') format('woff2');
}