Vamos a actualizar nuestra Política de privacidad próximamente. Te recomendamos consultar el avance.

Maquetación y tipografía para web

Jerarquías y pesos tipográficos

¡Prueba gratis durante 10 días

nuestros 1290 cursos !

Prueba gratis Mostrar modalidades de suscripción
Podemos escoger una o dos tipografías, pero la verdadera manera de crear niveles de texto es a través de una buena jerarquía tipográfica definida por los tamaños y los pesos de los textos y sus relaciones entre ellos.
04:22

Transcripción

Podemos escoger una o dos tipografías, pero la verdadera manera de crear diferentes niveles de texto es a través de una buena jerarquía tipográfica definida por los tamaños y los pesos de los textos y sus relaciones entre ellos. Por ello, vamos a ver una herramienta llamada Modular Scale .com en la que, en base a una base, valga la redundancia, y un ratio, un factor de multiplicación, podemos calcular una proporción armónica entre tamaños de texto. En este ejemplo, yo lo he puesto un factor de 1,618, que es la proporción áurea, en base a, pues bueno dos tamaños de texto que me interesaban, que es 16 píxeles y 50 píxeles. Si queremos más podemos añadirlos. Aquí tendríamos el de 50 y aquí abajo el de 16. Entre ellos, mediante este factor de multiplicación, se han ido creando diferentes escalas de texto, con lo cual aquí podríamos usarlo como titular principal, subtítulo, título de tercer nivel, título de cuarto, etcétera, etcétera, etcétera, hasta llegar a 16 puntos, que sería un tamaño ya más o menos razonable para cuerpo de texto, aunque seguramente para esta tipografía, sería recomendable algo un poquito mayor. Además, nos lo calcula tanto en píxeles como en ems. Una vez que lo ajustamos –vamos ajustando de las bases y del ratio– es ir probando y luego ya ir copiando los valores o incluso exportándolo en SAS o Javascript nos da la opción. Para entender cuál es la importancia de esto y cómo podemos jugar con esto, porque sí que podemos jugar a crear niveles y subniveles de texto a través del tamaño, pero también hay que hacerlo a través de los pesos, para eso vamos a ver qué es esto de los pesos o cómo funciona un poco y lo vamos a hacer a través del clásico gráfico de Adrian Frutiger de su Univers, de cuando lanzó su Univers, que partió de una tipografía muy gruesa y expandida y terminó en una tipografía muy finita y muy condensada. A través de esta línea, va construyendo los diferentes pesos. Va pasando de más gruesa a más fina en este eje, en el eje vertical, y de más expandida a más contraída en el eje horizontal. Y a partir de allí, como digo, pues bueno va construyendo los diferentes pesos y ya la mayoría de familias suelen trabajar en uno de los dos ejes, normalmente solo en este vertical que tendríamos aquí, en el del peso, pero sí que es verdad que hay diferentes familias tipográficas que trabajan en los dos y esas son las más completas. Si conseguimos una de esas perfecto, si no una que trabaje en uno de los dos ejes, pues también nos vendría muy bien para, como digo, ir construyendo esa jerarquía. A través del tamaño y a través de los pesos, vamos variando pesos, por ejemplo a los mayores tamaños le hacemos un mayor peso y conforme vamos bajando le vamos también quitando un poquito de peso o incluso vamos compensando de alguna manera. Tenemos también otra imagen clásica de Geri Norwich en la que explica también un poquito mediante un cubo cómo van creciendo y decreciendo las formas tipográficas y cómo se puede ir variando. Aquí los ejes, bueno, pues son más complejos., tenemos de peso, pero también tenemos de forma, en la que vemos por ejemplo esta 'e' que es totalmente diferente a esta o a esta, y cómo va avanzando en el cubo para ir complementándose o evolucionando entre ellas, para ir conformando este cubo. Es una imagen muy visual que para lo único que sirve es para entender que pueden existir diferentes pesos de texto que tienen diferentes funciones, diferente peso visual sobre todo, diferente importancia visual. Y esto, combinado como digo con los tamaños, nos va a servir para construir nuestra jerarquía de textos con la que maquetar nuestra página web.

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.