En su famoso libro The Elements of Typographic Style1, Robert Bringhurst enumera los servicios que la tipografía debería proporcionar al lector:
- invitar a acercarse al texto;
- revelar el tono y el significado del texto;
- dejar clara la estructura y el orden del texto;
- conectar el texto con los demás elementos de la página;
- inducir a un estado de calma atenta, condición ideal para la lectura.
Estos servicios son útiles tanto para un texto impreso en papel como para uno mostrado en una pantalla.
En su libro Pensar con tipos: una guía clave para estudiantes, diseñadores, editores y escritores, Ellen Lupton desmonta la idea común de que la lectura es más difícil en la pantalla. Un estudio de los años 80 sobre la interacción hombre-máquina demostró que «un texto negro sobre un fondo blanco se puede leer, con la misma eficiencia, tanto en la pantalla como en la página impresa»2, y en aquella época las pantallas tenían resoluciones mucho más bajas que las actuales. Lo que cambia en la lectura digital es la expectativa. «El lector de formato digital espera ser “productivo”, no contemplativo»3. El lector de formato digital recorre con la mirada la pantalla siempre en busca de algo en lo que hacer clic (o que compartir), el lector de formato en papel se toma su tiempo y se mueve de manera menos frenética. El soporte no dificulta la lectura de un texto largo, sobre todo si el texto ha sido diseñado para ser leído y no solo para ser visto (las cualidades de readability y legibility, como dirían en inglés).
La importancia de la legibilidad
La legibilidad de un texto está determinada por una serie de elementos, siendo la elección del tipo de fuente tan solo uno de estos. Los otros elementos fundamentales son los siguientes:
- el tamaño
- el espaciado entre letras y palabras
- la longitud de la línea (justificación)
- la distancia entre líneas (interlínea)
Estos elementos se influyen mutuamente. Cuánto más larga sea una línea, mayor deberá ser el tamaño del carácter y, a su vez, mayor deberá ser la interlínea. El tamaño del texto y la interlínea están estrechamente relacionados con el tipo de fuente. Para algunas fuentes será necesaria una interlínea mayor; para otras, una menor.
El diseñador esloveno Matej Latin, para representar la correlación entre el tamaño del texto, la longitud de la línea y la interlínea, usó la metáfora del triángulo equilátero y creó The Equilateral Triangle of a Perfect Paragraph (El triángulo equilátero de un párrafo perfecto). Se trata de un juego online con el que se puede practicar la creación del «párrafo perfecto» y ver en tiempo real qué sucede cuando uno de los elementos no se ha ajustado correctamente.
Las reglas básicas de la tipografía —y, en general, del diseño gráfico— se pueden aplicar de la misma forma tanto en papel como en pantalla, teniendo siempre en cuenta el contexto y el uso que le dará el lector. Cuando se está leyendo un texto en una pantalla, se tiende a ser menos contemplativo. Y, si además la pantalla es la de un smartphone, todavía menos. Conocer estas dinámicas guía las decisiones tipográficas en una dirección, en lugar de en otra.
Diseñar para una app: ¡la fuente cuenta!
Cuando se diseña una aplicación para un smartphone, se diseña para un sistema operativo que tiene sus reglas, sus lógicas de funcionamiento, de configuración y de diseño. Los dos sistemas operativos más populares hoy en día son Android e iOS. Ambos tienen una guía de estilo muy detallada, donde se especifica, entre muchas otras cosas, el tamaño ideal de la barra superior, de la barra lateral y también de la fuente.
Ejemplo de visualización de los elementos de navegación básicos de Android (izquierda) y de iOS (derecha)
La navegación de una aplicación Android (diseñada según las directrices de Google) se desarrolla entre la barra superior y el menú hamburguesa —el icono en la parte superior izquierda—. En cambio, la navegación de una app iOS se desarrolla en la parte inferior (la barra de pestañas). Tanto Android como iOS tienen su fuente predeterminada Roboto para Android or San Francisco para iOS4.
Qué fuentes elegir para las aplicaciones
Usar las fuentes predeterminadas del sistema operativo tiene sus ventajas (ningún coste de licencia ni peso de la app), pero no siempre es la solución ideal para todos. Determinadas necesidades relacionadas con la marca, la identidad visual y el tipo de contenido requieren diferentes opciones. Los elementos que se deben considerar a la hora de elegir una fuente para una pantalla no difieren mucho de los que se elegirían para el formato impreso. Es necesario valorar lo siguiente:
- en cuántos pesos está disponible un carácter;
- la altura de la «x» (la altura de la minúscula);
- el contraste (la diferencia de grosor entre las líneas finas y gruesas de una letra)
- la forma de las letras (posibilidad de distinguir sin problemas letras como la «e» y la «c» o la «l» minúscula y la «I» mayúscula);
- el ancho de las letras.
Cuanto más alta es la minúscula, mayor es la legibilidad, sobre todo en tamaños reducidos. Ni que decir tiene que en una pantalla pequeña, como la de un smartphone, esta característica es fundamental, ya que es importante que las letras tengan un buen contraste.
Examinando algunas de las aplicaciones más conocidas y descargadas, tanto en la Play Store como en la App Store, se puede ver cómo a menudo la fuente utilizada es la predeterminada. Para aplicaciones de varios millones de descargas, se debe considerar el impacto que puede tener el coste de licencia de uso de una fuente. En general, para una aplicación, los costes son mucho más altos que los de impresión o para la web. En estos casos, por norma general, si se quiere evitar la fuente predeterminada y no se quieren usar fuentes gratuitas, conviene tener una fuente propia. Recientemente, tanto Netflix como Airbnb han abandonado las fuentes usadas durante años (Gotham para Netflix, Circular para Airbnb) y han pasado a fuentes propietarias.
Las fuentes propietarias: personalidad y legibilidad
El equipo interno de diseño de Netflix, en colaboración con la fundición de tipos inglesa Dalton Maag, creó Netflix Sans. Por su parte, Airbnb, siempre en colaboración con Dalton Maag, creó Cereal. Tanto en el caso de Netflix como en el de Airbnb, la palabra más usada en los comunicados de prensa de presentación de la fuente fue «legibilidad». El objetivo era tener una fuente que pudiese diferenciar la marca y que fuese legible tanto en pantalla como en papel. Ambas tienen una importante presencia también fuera de internet, vinculada a la publicidad más tradicional, entre otras cosas. Airbnb, por ejemplo, también imprime su propia revista.
Otra aplicación, VSCO, también muy pendiente del diseño, ha seguido la misma orientación en una de las últimas renovaciones de su imagen de marca, creando, en colaboración con la fundición de tipos sueca Letters de Suecia, la fuente VSCO Gothic.
Parafraseando a Robert Bringhurst, el mejor carácter para una aplicación (un sitio web o un libro) será, en primer lugar, un carácter de por sí bueno; en segundo lugar, un carácter adecuado para una app, es decir, cómodo para una lectura continuada y prolongada; y, en tercer lugar, un carácter acorde con el tema.
Recordando que la elección del tipo de fuente es solo el comienzo, la forma en que se use determinará el éxito o el fracaso del diseño gráfico, ya sea para una pantalla o para papel.
Alternativas gratuitas
Terminamos este artículo con dos fuentes gratuitas que son excelentes alternativas a las fuentes predeterminadas de iOS y Android. Una es IBM Plex, la fuente de código abierto creada recientemente por IBM. Está disponible en tres versiones: mono, serif y sans serif (de la sans serif también hay una versión condensada). Todas las versiones están disponibles en ocho pesos diferentes (todos tanto en redonda como en cursiva).
La otra fuente es Inter UI, creada por Rasmus Andersson, disponible en cuatro pesos (tanto en redonda como en cursiva). El diseño de Inter UI comenzó en 2016 como un experimento para crear una fuente perfectamente legible en tamaños muy pequeños.
––––––––––––––––––––––––––––––––
1 Por el momento, The Elements of Typographic Style no se ha traducido al español.
2 Ellen Lupton. Pensar con tipos: una guía clave para estudiantes, diseñadores, editores y escritores. Editorial Gustavo Gili, S.L.
3 Ibidem
4 Apple introdujo la fuente San Francisco en 2015. Previamente, la fuente predeterminada de iOS era Helvética