La tipografía en nuestras webs

Implementador WordPress y VPS
Implementador WordPress y VPS
La tipografía en nuestras webs
icon loader
/

Todos piensan en las imágenes, lo colores, las formas… Pero todo mundo pasa por alto a la tipografía. En este episodio quiero compartir con vos mi resumen de un post del blog de Elementor y que nos paremos a reflexionar un poco, para darle su justo lugar a este elemento tan importante.

La tipografía en nuestras webs
  • El post tiene el título:
  • Y es una lectura obligada 100%
  • En este episodio quiero darte un breve resumen… Pero como te digo lo mejor es que vayas y le des una leída jejeje
  • 👉Así que manos a la obra:
  • Ya sabemos que la tipografía
  • Transmite branding, diseño visual, y experiencia del usuario
  • Todo en algo tan simple pero a la vez tan importante
  • Pero veamos… ¿Qué es la tipografía?
    • Técnicamente es el arte y la técnica de ordenar el tipo
    • Va mas allá del diseño, composición, y disposición
    • También la tipografía nos habla de comunicación, identidad visual, personalidad de marca, y por supuesto usabilidad.
  • Al reconocer la importancia de la tipografía
  • También le damos su justo valor a las palabras
  • Porque aún al día de hoy, nuestro usuarios cuando necesitan saber de nosotros
    • Van a nuestro sitio web a LEERLO
  • Por eso tenemos que entender
  • Muchos factores como los siguientes:
  • 👨‍💻La tipografía web
    • ¿No te ha pasado que por más que insistas no sentís lo mismos al leer un libro en papel que en digital?
    • Y aunque pareciera exactamente lo mismo leer letras sobre un fondo
      • Impreso o digital
    • No es lo mismo… Así como no es lo mismo imprimir letras que quedarán fijas y estáticas
    • Y utilizar letras en una web que cambiara constantemente para adaptarse a los dispositivos
  • 📱Adaptación en pantalla
    • Diferente dispositivo… Diferente tamaño de pantalla
    • Y no solamente que se vea bien en una pantalla o la otra
    • Deben leerse y verse bien en dispositivos móviles
    • Que es ahora la punta de lanza desde que Google ha dicho que indexará primero móviles
    • Y es la tendencia de los usuarios a consumir contenido desde celulares
    • Aquí interviene los tamaños, colores, peso, y diseño de la tipografía
  • 🖥 La resolución
    • La resolución de pantalla se refiere a la cantidad de píxeles que una pantalla contiene horizontal y verticalmente
    • Es decir la cantidad de puntos que muestra una pantalla por pulgada
    • La resolución es importante
    • Porque afecta lo que vemos dentro de la pantalla
    • Con este punto debemos entender que una cosa es lo que se muestra
    • Y otra es lo que nuestros ojos pueden percibir
    • A mas resolución, mas pequeña se ve la letra
  • ✅Lo responsive
    • La idea de la tipografía es que sea
    • Fácil de leer en diferentes dispositivos y tamaños de pantalla
    • Lo responsive no solo es que el texto se adapte
    • También significa que el texto se lea bien al adaptarse
    • Es bueno que sepamos que el texto se adapta a todo
      • A la pantalla
      • A la resolución
      • A los elementos
      • Y a sus unidades red y em
        – 🛠Claves de la tipografía
  • 👨‍👨‍👦‍👦Familias de fuentes genéricas
    • Serif
      • Con detalles decorativos o “colas”
      • Son suaves, redondeadas y decorativas
      • Se usan mucho para textos de libros, periódicos, revista
      • Times New Roman, Georgia, Palatino, Garamond, Playfair Display
      • Esta familia con serifa
      • Se usa mucho para marcas serias, formales… Como abogados, seguros, médicos, etc.
    • Sans-serif o cursiva
      • Ahora que ya hablamos de la serif
      • Es mas fácil entender
      • Estas no tiene detalles decorativos o “colas”
      • Tienen un grosor más uniforme
      • Y se usa mucho en diseños
      • Minimalistas, modernos, y simples
      • Su uso dentro del diseño web
      • Es mas frecuente en títulos, subtítulos, textos de botones
      • Por ejemplo…
      • Avenir, Roboto, Open Sans, Source Sans Pro, Lato, Monstserrat, Proxima nova
  • 👨‍👦Familia de Fuentes… Y fuente
    • La familia de fuente
    • Es un conjunto de letras del alfabeto
    • Con el mismo diseño
    • De distintos tamaños y pesos
    • El tipo de letra es una familia de Fuentes
    • La fuente se refiere a los pesos, anchos, y estilos de cada variación de ese tipo de letra
  • 📝Formato de texto
    • Todos sabemos lo útil
    • Que es resaltar un texto al ponerlo en negrito o cursiva
    • Pero además nuestros lectores
    • Se benefician de estos énfasis
    • Y las podemos usar para enfatizar términos, secciones, títulos de capítulos, subtítulos, entradas de tablas, etc.
  • El post sigue reflexionando sobre conceptos que te recomiendo 100% ir a leer
  • Y nos da ocho consejos de cómo elegir la fuente perfecta para tu sitio web
  • Que te recomiendo ir a profundizar en el post:
    • Pensa en cómo queres retratar tu marca usando la tipografía correcta
    • Decidi entre serif o sans serif
    • Mira si tus fuentes combinan
    • Tener en cuenta el tamaño, grosor, y longitud De la Fuente
    • Respetar el papel de la jerarquía visual
    • Conocer las hojas de estilo CSS
    • Mantenernos actualizados de los estándares

Si bien es cierto que no somos diseñadores gráficos, y que como implementadores aun nos falte mucho por aprender…. Pero nunca es tarde y todo suma. Te recomiendo dar un repaso al post y después regresar y comentar

Deja un comentario

Tu dirección de correo electrónico no será publicada.