Maquetación y tipografía para web

Tracking o espaciado entre letras

¡Prueba gratis durante 10 días

nuestros 1197 cursos !

Prueba gratis Mostrar modalidades de suscripción
En muchas ocasiones, nos vendría bien ampliar o reducir ligeramente el espaciado entre letras (tracking) de un texto determinado. Pues no esperes más y aprende ahora a jugar con el tracking de una webfont.
03:22

Transcripción

Los diseñadores de tipografías entienden que las versalitas, las mayúsculas, van a trabajar siempre con minúsculas a sus lados. Por lo tanto, suelen espaciar este juego de caracteres, mayúsculas y versalitas, para tener a sus lados, como digo, minúsculas y no otras versalitas u otras mayúsculas. Por lo tanto, en la mayoría de las ocasiones se queda demasiado cerrado el espaciado entre estos juegos de caracteres, como podemos ver por ejemplo aquí en 'versalitas', donde vemos que se han quedado un poco apretadas las letras con respecto a como podría ser entre minúsculas. Para ello, ¿qué se puede hacer? Pues jugar con el "tracking", y de hecho nos viene muy bien para ver qué es el "tracking", que es un estiramiento proporcional del espaciado de las letras propio de la tipografía. Así pues, vamos a ver cómo se trabaja el "tracking" y vamos a duplicar este fragmento de código. Vamos a poner "tracking" y vamos a llamar "tracking" a esta clase para trabajar en ella. Vamos a poner aquí la clase y vamos a usar la propiedad que se refiere al "tracking" o al espaciado de letras. Así pues, su nombre –también proviene del inglés– 'letter-spacing', y le vamos a poner un 'em', que es una barbaridad, pero así vemos el efecto. Vemos cómo se ha aplicado un espaciado proporcional entre letras. En base al espacio que ya ha preparado el diseñador de la tipografía, se aplica proporcionalmente la cantidad que hemos puesto. 1 em, vemos que es una barbaridad, así pues vamos a probar con 0,1 No está mal, aún podríamos poner incluso menos. Así estaría seguramente un poquito mejor, así que lo vamos a dejar así. Vamos a borrar esto para verlo todavía mejor, ya lo pondremos luego. Vemos cómo, uno junto a otro, se ve la diferencia entre el espacio entre uno y otro. Aquí vemos que está muy apretado y aquí vemos que hemos aplicado un ligero "tracking", no mucho, pero lo suficiente para mejorar la legibilidad o la apariencia del texto. Vamos a devolver esto a su sitio y aquí ya lo vemos en todo su esplendor. Vemos que tenemos versalitas por un lado y aquí versalitas con un "tracking" modificado por nosotros. Este sería versión estándar, o versión salida de fábrica por decirlo de alguna manera, y aquí lo tendríamos con "tracking" positivo. Podemos hacer lo mismo con "tracking" negativo si vemos que por lo que sea esa tipografía está demasiado espaciada y estamos en tamaños muy grandes, pues tenemos que apretar un poquito las letras, podemos aplicar "tracking" negativo sin ningún problema. Así pues, hasta aquí el "tracking" o espaciado entre letras.

Maquetación y tipografía para web

Aprende cómo seleccionar una fuente óptima para su lectura en pantalla y cómo exprimirla para aprovechar en tus proyectos web todas las posibilidades de las fuentes OpenType.

2:10 horas (25 Videos)
Actualmente no hay comentarios.
 
Software:
Fecha de publicación:30/09/2016

Este curso video2brain está disponible como descarga y para ser visualizado online. ¡Pero no hace falta que decidas entre las dos opciones! Al comprar el curso, disfrutarás de ambas posibilidades.

La descarga te permite ver las lecciones sin estar conectado/a a internet y supone una navegación fácil y ágil entre capítulo y capítulo. Si vas a trabajar en diferentes ordenadores o si no quieres descargarte el curso completo, entra en la web con tus datos de acceso y disfruta directamente de tus vídeos online. Te deseamos que disfrutes de este curso y te resulte de mucha utilidad.

Estamos a tu disposición si tienes cualquier tipo de duda o pregunta.