Furifont incrusta la furigana en la fuente misma: no hace falta el tag <ruby> ni una sola línea de CSS para que la lectura en kana aparezca arriba del kanji correcto.
El proyecto, publicado por el desarrollador Anthony Fu en furifont.antfu.me, usa sustituciones contextuales y variantes estilísticas de OpenType (las mismas funciones que combinan letras en una ligadura o cambian el estilo de un número) para resolver un problema tipográfico que hasta ahora dependía de markup externo.
TL;DR
- Furifont dibuja la furigana dentro del glifo del kanji usando sustituciones contextuales de OpenType, sin ruby ni CSS.- GSUB, la tabla de sustitución de glifos, elige la lectura correcta según el kanji vecino sin una línea de JavaScript.- Elegir la lectura manualmente es posible con variantes estilísticas cuando un kanji admite varias pronunciaciones.- Sin soporte de esas funciones de OpenType, el navegador muestra el kanji solo, sin romper el resto del layout.- La misma técnica sirve para pinyin, transliteración árabe o cualquier anotación que hoy depende de HTML extra.
¿Qué es Furifont?
Furifont es una fuente OpenType experimental que incrusta la furigana en la fuente mediante sustituciones de glifos: cada kanji con su lectura se reemplaza por un glifo compuesto que ya incluye los caracteres kana en miniatura, sin marcado adicional en el documento.
La furigana en sí no es nueva: los diccionarios y los libros infantiles japoneses la usan desde hace más de un siglo para anotar la pronunciación de un kanji complejo arriba o al costado del carácter principal. Internet resolvió el problema con el elemento <ruby> de HTML, estandarizado por el W3C, pero ese marcado depende de que cada plataforma (un lector de EPUB, un generador de PDF, un editor de texto plano) lo implemente correctamente.
Furifont ataca el problema desde otro ángulo, pidiéndole a la fuente que haga el trabajo en lugar de depender de una etiqueta nueva. Cualquier aplicación que ya sabe renderizar texto con OpenType, que es prácticamente todo el software moderno, muestra la furigana sin ningún cambio de código.
Para alguien que recién empieza a leer japonés, la furigana cumple la misma función que un pequeño cartel de pronunciación al lado de una palabra difícil: no reemplaza aprender el kanji, pero permite leer el texto completo desde el primer día sin frenar cada tres palabras a buscar en un diccionario.
Por qué importa la furigana embebida en glifos
El soporte de <ruby> en la web es parejo, pero fuera del navegador es irregular. Generadores de PDF, motores de slides y varios lectores de EPUB todavía no posicionan la furigana donde corresponde, o simplemente la ignoran. Para un material educativo que necesita verse igual en una app, un PDF impreso y una página web, cada renderer que falla es un dolor de cabeza distinto.
Al mover la anotación a la fuente, Furifont saca ese problema de la ecuación. Si el software sabe mostrar texto en japonés con una tipografía OpenType moderna, algo que cubre a casi todo el software actual, ya sabe mostrar la furigana. No hay que parchear el lector de EPUB ni el generador de PDF.
La inconsistencia no es teórica. Algunos lectores de EPUB posicionan la furigana demasiado cerca de la línea anterior cuando el texto tiene mucho kanji consecutivo, y ciertos generadores de PDF basados en motores de layout más viejos ni siquiera reconocen bien el markup ruby, mostrando la lectura como texto suelto fuera de lugar.
El valor del proyecto no está solo en resolver furigana. Fu lo plantea como demostración de una técnica más amplia de font engineering: cualquier anotación secundaria que hoy dependa de markup (el pinyin sobre un carácter chino, la vocalización sobre una consonante árabe, una transcripción fonética sobre una palabra) se puede empujar hacia la capa de la fuente con las mismas herramientas de OpenType.
La furigana acompaña al kanji en diccionarios japoneses desde hace más de un siglo.
Cómo funciona la furigana en la fuente
Todo pasa en la etapa de shaping, el paso donde un motor de texto convierte una cadena Unicode en una secuencia de glifos con posición. Un navegador, un editor o un sistema operativo no dibuja letras, dibuja los glifos que la fuente le indica, siguiendo las reglas que trae la fuente misma en sus tablas internas.
El pipeline de shaping: de texto a glifo compuesto
Motores de shaping como HarfBuzz (usado por Chrome, Firefox y la mayoría de Linux) o CoreText en macOS reciben la cadena de kanji y consultan la tabla GSUB (Glyph Substitution) de la fuente. Esa tabla define reglas: si aparece tal secuencia de caracteres en tal contexto, sustituí el glifo simple por otro. Furifont define, para cada kanji que soporta, una regla que apunta a un glifo compuesto, y ese glifo nuevo no es solo el trazo del kanji: incluye además los caracteres kana de la lectura dibujados en miniatura, ya posicionados y escalados dentro del mismo contorno.
flowchart TD
A["Texto: kanji y contexto"] --> B["Motor de shaping (HarfBuzz)"]
B --> C["Tabla GSUB: lookup calt"]
C --> D["Existe regla contextual"]
D -->|"Si"| E["Sustituye por glifo compuesto"]
D -->|"No"| F["Muestra el kanji sin furigana"]
E --> G["Glifo con kana en miniatura"]
Sustituciones contextuales (GSUB) para elegir la lectura correcta
La función calt (contextual alternates) es la pieza clave: decide qué glifo mostrar según los caracteres vecinos, no solo según el carácter aislado. Esto importa porque un mismo kanji puede leerse de maneras distintas según la palabra que forma. Una regla calt bien escrita mira el kanji siguiente o anterior y elige el glifo compuesto con la lectura correcta para ese contexto específico.
Variantes estilísticas para las excepciones
El contexto no siempre alcanza para desambiguar. Cuando un kanji admite varias lecturas válidas en el mismo contexto, algo común en nombres propios japoneses, Furifont recurre a las variantes estilísticas, la familia de funciones ss01 a ss20 que el estándar OpenType reserva para que un diseñador o el propio usuario elija manualmente entre glifos alternativos. En lugar de que la fuente adivine, el documento activa una variante estilística específica para forzar la lectura correcta en ese kanji puntual.
Cómo se construye el glifo compuesto
Diseñar cada glifo compuesto es trabajo de tipografía, no de programación. En una herramienta como FontForge o Glyphs, el diseñador toma el contorno del kanji, agrega los contornos de los caracteres kana reducidos a una fracción del tamaño y los posiciona en el espacio superior del glifo, ajustando el avance horizontal para que el conjunto no choque con el glifo vecino. Ese glifo nuevo se guarda con su propio nombre dentro de la tabla de glifos de la fuente (glyf en TrueType o CFF en fuentes OpenType-CFF), y la tabla GSUB simplemente indica que, cuando aparezca el glifo original de ese kanji en ese contexto, hay que usar este otro glifo en su lugar. Herramientas como fonttools, la librería en Python que lee y escribe binarios de fuentes, permiten automatizar buena parte de ese mapeo generando reglas GSUB a partir de una lista de pares kanji-lectura en vez de escribirlas a mano una por una.
Ejemplos prácticos y cómo empezar
Probar la anotación furigana incrustada no requiere compilar nada: alcanza con cargar la fuente vía @font-face y activar las funciones de OpenType correctas desde CSS.
Activar las funciones por CSS
@font-face {
font-family: "Furifont";
src: url("Furifont.ttf") format("truetype");
}
.furigana {
font-family: "Furifont", sans-serif;
font-feature-settings: "calt" 1;
}
Este bloque carga la fuente y activa calt, la función que dispara las sustituciones contextuales. Con esto, un <span class="furigana"> que contenga un kanji soportado por Furifont ya debería mostrar la lectura en miniatura arriba, sin ningún otro cambio en el HTML.
.furigana-manual {
font-family: "Furifont", sans-serif;
font-feature-settings: "calt" 1, "ss03" 1;
}
Acá se suma ss03 para forzar una variante estilística puntual, útil cuando el kanji tiene una lectura ambigua que el contexto solo no puede resolver, por ejemplo un nombre propio. El número de variante depende de cómo Furifont mapeó cada lectura alternativa en su propia tabla GSUB.
Verificar que la sustitución está activa
Firefox trae un inspector de fuentes dentro de las herramientas de desarrollo, en la pestaña Fuentes del panel de Inspector, que lista para el texto seleccionado qué funciones OpenType trae la fuente y cuáles están activas. Si calt aparece marcado y el kanji en pantalla muestra la furigana, la sustitución está funcionando. Si el kanji se ve solo, sin la lectura arriba, lo primero a revisar es que font-feature-settings llegó al elemento y no fue sobrescrito por otra regla con mayor especificidad.
flowchart LR
A["Fuente Furifont cargada"] --> B["Renderizador soporta GSUB contextual"]
B -->|"Si"| C["Muestra kanji con furigana incrustada"]
B -->|"No"| D["Muestra solo el kanji base"]
C --> E["Texto copiado conserva solo el kanji"]
D --> E
Casos de uso reales
-
Libros electrónicos: el soporte de
<ruby>varía entre lectores de EPUB, así que incrustar la furigana en la fuente evita que la lectura desaparezca en un dispositivo que ignora el markup.- Material de aprendizaje de japonés: apps y hojas de práctica que solo necesitan tipear el kanji y dejar que la fuente muestre la lectura.- Documentos y PDFs generados por sistemas que no controlan HTML: reportes, facturas o formularios donde agregar<ruby>no es una opción.- Subtitulado y señalética digital: pantallas que renderizan texto plano sin motor de ruby, donde forzar una variante estilística puntual es más simple que integrar un parser de markup nuevo.- Font engineering general: la misma idea de sustitución contextual sirve para incrustar pinyin sobre caracteres chinos o vocalización sobre consonantes árabes.
OpenType reserva hasta 20 variantes estilísticas, ss01 a ss20, por fuente.Errores comunes y buenas prácticas
Copiar y pegar pierde la lectura: el texto subyacente sigue siendo solo el kanji, la furigana es puramente visual.- Explosión de glifos: cada combinación de kanji con lectura necesita su propio glifo compuesto, así que una fuente completa no puede cubrir todas las lecturas posibles.- Motores de render antiguos: si el software no implementa GSUB contextual o ignora
caltpor defecto, el kanji se muestra solo.- Altura de línea: el glifo compuesto ocupa más alto que un kanji normal, así que hay que ajustar el line-height a mano para que la furigana no se corte.
💭 Clave: Furifont resuelve la presentación de la furigana, no su accesibilidad: para un lector de pantalla o un buscador, el texto sigue siendo solo el kanji.
Comparativa con alternativas
La tabla siguiente compara la furigana en la fuente con las alternativas más usadas para anotar lecturas en texto japonés, en la web y fuera de ella.
OpciónCuándo usarlaVentajaLimitación/
Profundizando: dentro de la tabla GSUB
La especificación de OpenType define varios tipos de lookup dentro de GSUB, numerados del 1 al 8. Una ligadura simple, como combinar dos letras en un solo glifo, usa el lookup tipo 4. Lo que hace Furifont se acerca más al tipo 6, sustitución contextual encadenada, que permite mirar glifos antes y después del objetivo antes de decidir el reemplazo. Esa es la maquinaria que calt expone al diseñador de la fuente sin que el autor del documento tenga que escribir una sola regla.
El costo de este enfoque es combinatorio. Cada combinación de kanji más lectura que la fuente quiera soportar necesita su propio glifo compuesto, dibujado a mano o generado por script, con la kana en miniatura ya posicionada dentro del contorno. Un kanji con cinco lecturas comunes implica cinco glifos distintos en la fuente, no uno. Esto pone un techo práctico a cuántas combinaciones puede cubrir una sola fuente antes de que el archivo crezca demasiado, así que proyectos como este suelen enfocarse en un vocabulario acotado en lugar de cubrir los miles de kanji de uso común con todas sus lecturas.
Una alternativa técnica que la fuente también podría explotar es GPOS, la tabla de posicionamiento de glifos que usa el mismo mecanismo que acentos y diacríticos combinables en escrituras como el árabe o el hebreo. En vez de reemplazar el kanji por un glifo compuesto, la fuente podría adjuntar los caracteres kana como marcas ancladas sobre el kanji base, reutilizando el mismo glifo del kanji en otros contextos. Esa ruta reduce la explosión de glifos, pero complica el control fino sobre el tamaño y la posición exacta de cada kana, que es justamente lo que un glifo compuesto resuelve de una sola vez.
El shaping ocurre una sola vez por cada corrida de texto y el motor de layout cachea el resultado, así que no hay costo de rendimiento en tiempo de ejecución más allá del que ya paga cualquier texto con ligaduras o kerning. La limitación real es otra: el texto subyacente, lo que queda en el portapapeles, lo que indexa un buscador, lo que lee un lector de pantalla, sigue siendo solo el kanji. La furigana vive en la capa visual, no en los datos, algo que el elemento <ruby> de HTML sí resuelve porque la lectura es texto real dentro del documento.
La idea de resolver anotaciones tipográficas dentro de la fuente, en lugar de en el documento, no es exclusiva de Furifont. Los sistemas de tipografía asiática llevan décadas lidiando con el problema de dónde vive la información de lectura, y el propio ruby de HTML llegó tarde: recién se volvió ampliamente interoperable en navegadores bien entrada la década de 2010. Lo que aporta Furifont es demostrar la técnica completa, de punta a punta, para construir una tipografía con lectura fonética incrustada usando solo funciones estándar de OpenType que cualquier fuente puede adoptar sin esperar un cambio en ningún navegador.
📖 Resumen en Telegram: Ver resumen
Tu próximo paso: descargá la fuente de prueba desde furifont.antfu.me, armá un span con font-feature-settings: "calt" 1; y confirmá en el inspector de fuentes de Firefox que la sustitución contextual se disparó.
Preguntas frecuentes
¿Furifont reemplaza al elemento HTML ruby?
No lo reemplaza en todos los casos: <ruby> sigue siendo la opción correcta cuando necesitás que la lectura exista como texto real, accesible y buscable. Furifont tiene sentido cuando el canal de salida no te deja controlar el markup, como un PDF generado automáticamente o un lector de EPUB que ignora <ruby>. Para contenido nuevo donde controlás el pipeline completo, <ruby> sigue siendo la opción más robusta a largo plazo.
¿Qué pasa si el navegador no soporta las funciones OpenType que usa Furifont?
Si el motor de shaping no aplica calt ni las variantes estilísticas, simplemente muestra el glifo base del kanji, sin la furigana. No rompe el layout ni genera un carácter faltante, pero el lector pierde la anotación.
¿Se puede copiar el texto y conservar la lectura en kana?
No. La sustitución ocurre solo en la capa visual del glifo: el texto Unicode subyacente sigue siendo el kanji original, así que copiar y pegar, buscar en la página o pasarlo por un lector de pantalla no recupera la lectura en kana.
¿Furifont funciona con cualquier tipografía japonesa?
No: la anotación furigana tiene que estar diseñada dentro de esa fuente específica, glifo por glifo. No es una función que se le pueda sumar a cualquier tipografía japonesa existente sin rediseñar sus tablas GSUB y agregar los glifos compuestos correspondientes. Migrar una tipografía existente implica, en la práctica, generar una fuente derivada solo para este propósito.
¿La anotación furigana incrustada sirve para otros idiomas además del japonés?
La técnica sí: cualquier escritura que combine un carácter principal con una anotación fonética secundaria, como el pinyin sobre caracteres chinos o la vocalización sobre consonantes árabes o hebreas, puede usar el mismo mecanismo de sustituciones contextuales y variantes estilísticas de OpenType.
¿Cuánto crece el archivo de la fuente al incrustar furigana en los glifos?
Crece en proporción directa a cuántas combinaciones de kanji y lectura soporte: cada combinación nueva es un glifo compuesto adicional en la tabla de glifos. Por eso ninguna fuente de este tipo intenta cubrir los miles de kanji de uso común con todas sus lecturas posibles.
Referencias
-
Furifont: sitio oficial del proyecto de Anthony Fu, con la demo de furigana incrustada en la fuente.- Wikipedia: historia y uso de la furigana en la tipografía japonesa.- Microsoft Typography: especificación oficial de OpenType, incluida la tabla GSUB y sus funciones de layout.- MDN: documentación de la propiedad CSS
font-feature-settingspara activar funciones OpenType.- Wikipedia: antecedentes técnicos del formato de fuentes OpenType.
📱 ¿Te gusta este contenido? Únete a nuestro canal de Telegram @programacion donde publicamos a diario lo más relevante de tecnología, IA y desarrollo. Resúmenes rápidos, contenido fresco todos los días.
