Tipografía: la selección correcta

https://raccoonvisualstudio.com/creativos/tipografia-la-seleccion-correcta/

Ya sabemos que el diseño web es una gran parte tipografía, ¿no sería entonces lógico que dedicáramos algo más de esfuerzo a cuidar el texto de nuestras maquetas?

Muchas veces encuentramos páginas web con diseños excelentes, esquemas de color armoniosos y contrastados, con imágenes espectaculares que apoyan el contenido pero que fallan a la hora de disponer las cajas de texto empobreciendo drásticamente la impresión general.

Parece que el diseñador hubiera dejado el trabajo de texto para el final. Quizá se deba a que suele recibir el contenido al final, cuando el cliente ya ha visto su página. El hecho de no disponer de un material cuidado y de calidad desde el principio puede hacer que no se le dé la importancia que merece.

No deberíamos olvidar que el objetivo primero de cualquier sitio es comunicar nuestro mensaje, que nos lean. Marketing de contenidos, nos suena, ¿verdad? Ese contenido tiene que ir presentado de forma impecable.

En internet sí se lee si el contenido es de calidad y está bien presentado. Estoy cansado de oír que en internet no se lee. No creo que sea cierto. Si no se lee más puede que sea porque no nos hemos preocupado lo suficiente por la forma en que presentamos los textos. Difícil es leer un texto de 600 palabras con un cuerpo de 11 píxeles y un interlineado que mezcla lineas sin parar en tu cabeza.

Aumenta el tamaño del texto

Si tu sitio web está compuesto en un cuerpo de letra menor a 16 píxeles estás perdiendo dinero.

16 píxeles no es un tamaño grande para el texto, es un tamaño ideal. A una distancia adecuada del monitor lo percibimos de forma similar al tamaño que leemos en un libro en la playa.

Ajusta el interlineado

Cuando decimos ajustar el interlineado me refiero en un 80% de los casos a ampliar el interlineado. Pone muy nervioso ver bloques de texto en los que apenas hay espacio para respirar entre líneas. Leer así es una tortura. Seamos generosos y creemos preciosas texturas tipográficas con un interlineado adecuado. La propiedad de CSS para esto es line-height. Cada tipografía y bloque de texto exige una medida pero definir un interlineado del 140% del tamaño del cuerpo nos puede servir como orientación.

Vigila la longitud de las líneas

Un error habitual es disponer cajas de textos demasiado anchas con muchas palabras por línea. Esto dificulta la lectura, la hace lenta y pesada y el cansancio aparece enseguida. Nuestro ojo tiene que trabajar en exceso al obligarlo a recorrer una gran distancia para empezar la siguiente línea.

Que nuestra página se adapte al ancho del navegador no significa que nuestro texto tenga que ir de lado a lado de la pantalla. Una longitud ideal muestra entre 50 y 75 caracteres por línea.

¡Tracking!

Los diseñadores de libros y revistas disfrutan desde hace muchos años del tracking. Los diseñadores de web disponemos desde la versión 2.1 de CSS de la propiedad letter-spacing que es un primo pequeño y lejano del tracking de los programas de edición.

Este mayor control nos permite, por ejemplo, ajustar la prosa de las mayúsculas como en la columna de la derecha de este post que tienen un espaciado ligeramente abierto.

Actualiza tu paleta de tipografías web

Somos libres de utilizar casi cualquier fuente. Actualiza tu paleta, descubre con qué tipos trabajas mejor, con cuáles te sientes más cómodo, e incorpóralos. Tus diseños mejorarán sustancialmente.

Publicado por

Raccoon Visual Studio