Fuente monospac…

Algunos elementos matemáticos necesitan ser tipografiados utilizando fuentes que contengan caracteres/símbolos de un determinado estilo; por ejemplo, es habitual representar los números reales con una fuente negrita de pizarra (como \(\mathbb{R}\)), o los espacios topológicos con una fuente caligráfica (como \(\mathcal{T}\)). En este artículo se muestra cómo utilizar diferentes estilos de letra al componer matemáticas, a partir del siguiente ejemplo:

Hay algunos tipos de letra que sólo admiten un número limitado de caracteres; estas fuentes suelen denotar algunos conjuntos especiales. Por ejemplo, para mostrar la R en el tipo de letra negrita de pizarra, se puede utilizar \ (\mathbb{R}\) para producir \ (\mathbb{R}\). El siguiente ejemplo muestra los tipos de letra caligráficos, fraktur y de pizarra:

Didone

⚠️ Aviso: Como muestra de fuentes variables, este sitio requiere un navegador web que soporte la tecnología de variación de fuentes OpenType. Parece que su navegador no lo hace, así que considere la posibilidad de actualizar a uno que lo haga (las últimas versiones de Chrome funcionan bien, incluso en sistemas operativos antiguos). De lo contrario, las muestras de fuentes que aparecen a continuación sólo aparecerán como fuentes estáticas.

SF Arabic es una extensión de la serie tipográfica San Francisco de Apple, utilizada como fuente del sistema árabe en las plataformas de Apple. Es una «interpretación contemporánea del estilo Naskh con un diseño racional y flexible».

Etiquetas: decorativa/display, cuerpo de texto, sans, geométrica, cartoon, dimensional, monolínea, monoespaciada, multiplexada, postura multiplexada, peso multiplexado, tamaños ópticos, ornamentada, regordeta/convexa, redondeada

La familia de tipos de letra con gracias Immortel está formada por cuatro variantes (Infra, Colera, Vena y Acedia), todas ellas diseñadas con anchos de trazo multiplexados para que sean intercambiables sin provocar el reflujo del texto. Las variantes Infra y Vena -inspiradas en Robert Granjon y Jacques-François Rosart, respectivamente- están pensadas para su uso en textos corrido. Incluyen una cursiva «mediana» para bloques de texto más largos, así como una cursiva más exagerada para un mayor énfasis. Ambas ofrecen también un eje de grado variable para ajustar ligeramente el peso, con el fin de adaptarse a diferentes entornos tipográficos y preferencias del usuario.

Arial

En el primer artículo del módulo, exploramos las características básicas de CSS disponibles para estilizar las fuentes y el texto. En este artículo iremos más allá, explorando las fuentes web en detalle. Veremos cómo utilizar fuentes personalizadas con tu página web para permitir un estilo de texto más variado y personalizado.

Familias de fuentes recapitulaciónComo vimos en Estilo fundamental de texto y fuentes, las fuentes aplicadas a tu HTML pueden ser controladas usando la propiedad font-family. Ésta toma uno o más nombres de familias de fuentes. Al mostrar una página web, un navegador recorrerá una lista de valores de font-family hasta que encuentre una fuente disponible en el sistema en el que se está ejecutando:

Este sistema funciona bien, pero tradicionalmente las opciones de fuentes de los desarrolladores web eran limitadas. Sólo hay un puñado de fuentes que se puede garantizar que estén disponibles en todos los sistemas comunes: las llamadas fuentes Web-safe. Se puede utilizar la pila de fuentes para especificar las fuentes preferidas, seguidas de las alternativas seguras para la web, seguidas de la fuente del sistema por defecto. Sin embargo, esto aumenta la carga de trabajo debido a las pruebas necesarias para asegurarse de que sus diseños funcionan con cada fuente.Fuentes webPero hay una alternativa que funciona muy bien. (Incluso es compatible con navegadores más antiguos como la versión 6 de IE). CSS le permite especificar archivos de fuentes, disponibles en la web, para que se descarguen junto con su sitio web a medida que se accede a él. Esto significa que cualquier navegador que soporte esta función CSS puede mostrar las fuentes que hayas elegido específicamente. Es increíble. La sintaxis requerida es algo así:

Texto de las fuentes

Aquí encontrará una selección de fuentes que hemos elegido, en parte por sus cualidades estéticas, pero sobre todo por su funcionalidad. Además de familias con muchos estilos y pesos, encontrará fuentes optimizadas para interfaces, fuentes web optimizadas para la interfaz de usuario, y otras especialmente legibles en párrafos, o especialmente cómodas para leer en el móvil y legibles en cualquier dispositivo, ya sea smartphone, ordenador de sobremesa o tableta.

Las fuentes se alojan en el servidor del usuario independientemente de los servicios externos. @font-face era una regla obsoleta de CSS2 que ha sido reintroducida en las especificaciones de CSS3 y es soportada por casi todos los navegadores modernos. Una fuente web es una fuente personalizada que es soportada por diferentes navegadores y viene en formatos como TTF, WOFF, EOT y SVG.

@font-face { font-family: ‘ChunkFiveRegular’; src: url(‘Chunkfive-webfont.eot’); src: url(‘Chunkfive-webfont.eot?#iefix’) format(‘embedded-opentype’), url(‘Chunkfive-webfont. woff’) format(‘woff’), url(‘Chunkfive-webfont.ttf’) format(‘truetype’), url(‘Chunkfive-webfont.svg#ChunkFiveRegular’) format(‘svg’); font-weight: normal; font-style: normal; }