Tipografía en infografía

Usa como máximo dos familias: una para los números (idealmente con variante de cifras tabulares) y otra para el texto corrido y las etiquetas, o una sola familia con suficientes pesos (Regular, Medium, Bold, Black) para cubrir ambos roles. Tres o más familias en un cartel de datos se lee como collage amateur, no como sistema. Que el peso y el tamaño, no más tipos, carguen la jerarquía.

En tablas comparativas y listas de rankings, las cifras proporcionales dan a cada dígito un ancho distinto, así que los números bailan y se rompe la alineación vertical. Activa la variante OpenType tnum (cifras de ancho fijo) con font-variant-numeric: tabular-nums; entonces un 1 ocupa la misma caja que un 8 y los decimales se apilan limpios. Alinea la columna a la derecha para que cuadren las posiciones.

Da a la pieza tres niveles claros de tamaño: el número hero (la tipografía más grande de la página), los stats de apoyo (40 a 60% del hero) y los micro-datos y anotaciones (20 a 30% del hero). Un salto de tamaño menor al 25% entre escalones no se percibe como nivel distinto, así que el lector no separa lo primario de lo secundario de un vistazo. Fija las proporciones a propósito, no muevas tamaños a ojo.

Una etiqueta legible en monitor al 100% puede desaparecer en impreso. En una hoja carta/A4 en mano, mantén notas y fuente en mínimo 6 a 7 pt; en cartel de pared, dimensiona por distancia con la regla aproximada altura de letra (mm) ≈ distancia de lectura (m) × 1.5–2. Nunca encojas una etiqueta por debajo de lo que exige la distancia solo para meterla dentro de una barra.

Una etiqueta puesta directamente sobre la barra o línea que describe (con línea líder si hace falta) se lee más rápido que una leyenda de color aparte, porque el ojo no tiene que saltar a la leyenda y volver emparejando muestras. El etiquetado directo elimina ese viaje de ida y vuelta y el riesgo de emparejar mal color con categoría. Reserva la leyenda tradicional para 6+ categorías, donde las etiquetas directas saturarían el gráfico.

El %, $, kg o x es parte de la cifra, no un elemento aparte. Componlo en el mismo peso o uno claramente relacionado, con kerning ceñido a los dígitos, para que el número se lea como un solo token. Una unidad flotando lejos, en otra fuente o tamaño, queda huérfana y el ojo tiene que reengancharla. Mantenla visible: una unidad reducida a nota al pie es ambigua y obliga a releer.

Las mayúsculas sostenidas eliminan la silueta de palabra (ascendentes y descendentes) que el ojo usa para reconocer palabras completas, así que la lectura se ralentiza de forma medible. Usa mayúsculas para etiquetas de 1 a 3 palabras: nombres de eje, categorías, antetítulos. Deja el titular argumental en caja baja, donde las siluetas de palabra quedan intactas y la frase se escanea rápido.

Empareja un peso claramente distinto con el cambio de tamaño: Black para el número hero, Regular o Medium para la etiqueta descriptiva. El contraste de peso sobrevive al escalado, así que la jerarquía sigue leyéndose cuando la pieza se reduce a miniatura o se previsualiza pequeña, donde las diferencias de tamaño se comprimen. Depender solo del tamaño da una jerarquía que colapsa en previsualización chica.

Los títulos de ejes, notas y la línea de fuente deben anclarse a los mismos márgenes y columnas que el gráfico que describen (ver S72). El texto de apoyo que flota en su propia sangría rompe la sensación de sistema y hace que la pieza parezca ensamblada por accidente. Comparte un mismo borde izquierdo y retícula de línea base entre el título, el gráfico y el pie para que todo se lea como un bloque coordinado.

Los párrafos cortos de contexto en infografía suelen ir junto a elementos visuales densos, así que necesitan un poco más de aire que el cuerpo de texto corrido: apunta a 1.4–1.5× de interlineado frente al ~1.2–1.35× del cuerpo editorial estándar (M2). El interlineado extra evita que las líneas de la nota se fundan visualmente con los filetes y líneas de retícula del gráfico contiguo. No arrastres el interlineado de cuerpo directo a un pie apretado contra un gráfico.