29: Texto SVG | Programar Plus

← Vídeo anterior Vídeo siguiente →

Hay un <text> elemento en SVG. No es una gran sorpresa aquí: es para poner texto en el SVG. No son contornos de formas de letras (aunque también puede hacerlo), sino texto web normal real. Seleccionable, compatible con SEO, accesible, texto web normal.

Las fuentes a las que tiene acceso son las mismas que las del resto del documento. Entonces, si carga una fuente @font-face, podrá usarla en el SVG.

Lo que creo que es genial es que el tamaño de las fuentes es relativo al documento SVG, al igual que todas las formas y demás. Entonces, si diseña algo muy deliberado y tipográfico perfecto en el SVG, mantendrá esa integridad a medida que cambia el tamaño del SVG. Eso sería difícil de lograr en HTML/CSS. Aquí hay un artículo sobre eso.

Una limitación: el texto no se puede ajustar. Eso puede ser un inconveniente bastante significativo, pero esa característica viene en SVG 2.

(Visited 8 times, 1 visits today)