La importancia de la tipografía en la web

Preste atención a la legibilidad

¿Te ha pasado esto alguna vez? ¿Mirar muy de cerca a la pantalla porque el tipo de letra es muy pequeño? A menudo me encuentro haciendo zoom en las páginas web porque no puedo leer el texto. Es extremadamente molesto.

La legibilidad del texto en su sitio web o comunicación en línea es fundamental para afectar la forma en que las personas lo leen. No es solo su elección de palabras, una fuente estándar adecuada también tiene un papel importante que desempeñar en esto. El tamaño de la fuente, la longitud de la línea y el espacio entre líneas también afectan la legibilidad del texto.

La tipografía online y la impresa no son lo mismo

Cuando pasé por primera vez de lo impreso a lo online, debo admitir que me tomó un tiempo acostumbrarme al hecho de que todo en la web puede ser un poco más grande. Empecé en el mundo de los periódicos, donde un tamaño de fuente de 9 o 10 px es bastante normal para el cuerpo principal del texto. Todavía recuerdo mi primera publicación en línea: un tamaño de fuente enorme para el encabezamientos y una fuente diminuta para el cuerpo principal del texto. Esa fue una idea completamente equivocada. El texto del cuerpo principal debería haber sido el doble de grande, al menos 16 px. Y, por supuesto, los encabezados también podrían ser más sutiles. Al principio, lo encontré raro, pero ahora me he acostumbrado por completo.

Hay una lógica detrás de esto porque las proporciones son muy diferentes en la web. Solo piénsalo: a menudo te sientas más lejos de la pantalla que de un periódico, Folletoo revista. En una publicación web, por lo tanto, necesita un tamaño de fuente más grande, porque la distancia hace que la fuente parezca más pequeña. Pero eso no es todo. La longitud de la línea también es importante, al igual que el espacio entre líneas. Pero, ¿cómo decide cuál es el tamaño de fuente, la longitud de línea y el espaciado ideales? Creo que esto varía dependiendo de la fuente porque difieren bastante en cuanto a sus dimensiones. No estoy seguro de si hay algún ideal. orientaciones, pero después de investigar un poco, he llegado a la siguiente lista

importancia de la tipografía web

Pautas de tipografía

Tamaño de fuente: 16px o más grande
Longitud de línea: 45 a 75 caracteres
Interlineado: 1.4 veces el tamaño de la fuente

Los anteriores son tamaños promedio, pero si su fuente es pequeña o estrecha, no dude en optar por un píxel más alto.

Fluidez de procesamiento: ¿atractivo o legible?

Tiempo para un poco de ciencia. Nuestros cerebros son sensibles a los cambios dentro de un mensaje. Puede pensar que me estoy refiriendo a su elección de vocabulario, pero la fuente que elija también juega un papel importante. Si desea animar a su lector a seguir leyendo, asegúrese de utilizar la fuente correcta. La fluidez de procesamiento, es decir, la facilidad con la que nuestro cerebro procesa la información, es sumamente importante en esto. Elegir una buena tipografía para tu trabajo online puede parecer una tontería, pero en realidad afecta a nuestra forma de actuar, aunque no seamos conscientes de ello.

Una fuente influye en la legibilidad del texto. Por ejemplo, las fuentes fáciles de leer como Helvetica y Verdana se pueden procesar en una fracción de segundo. No se puede decir lo mismo de las fuentes más creativas (como los estilos escritos a mano) que son más difíciles de leer.

Pero elegir una fuente creativa y escrita a mano en realidad tiene otro impacto positivo en la legibilidad de un texto. Parece más personal y hace que el significado del mensaje sea más creíble. Entonces, ¿deberías optar por atractivo o legible? Elija lo mejor de ambos mundos: en otras palabras, una fuente clara y legible como Arial, Helvetica o Verdana e intercala con fuentes creativas, en un cotización inicial, por ejemplo.

“Una cita puede proporcionar un lugar para descansar dentro del texto”.

¡Pero esto ni siquiera comienza a explorar todas las diferentes fuentes que podrías usar! La aparición de herramientas como Typekit y Google Fonts ahora significa que han comenzado a aparecer innumerables fuentes web nuevas junto con las fuentes clásicas. Tienden a ser algo más frescas que las fuentes clásicas, lo que le da a su publicación o sitio web un aspecto y una sensación ligeramente más claros.

La instalación de la herramienta Skyfonts para Windows o Mac OSX permite descargar fuentes web de Google Fonts con un clic del mouse. Es fácil agregar fuentes haciendo clic en el signo más y se almacenarán ordenadamente en la herramienta. La ventaja final de Skyfonts es que, después de instalarlas, puede usar las fuentes inmediatamente en los proyectos en los que está trabajando. Probablemente conozca el problema: si instala una nueva fuente por separado, debe comenzar buscándola en las descargas antes de abrirla en su biblioteca de fuentes y guardarla. También existe el problema de tener que guardar todas las versiones regulares, en negrita y en cursiva por separado, mientras que con Skyfonts, puede guardar familias de fuentes completas que funcionan de inmediato. ¿Que podría ser mejor? Existe la ventaja adicional de que los sitios web Fonts.com, Linotype, Monotype y My Fonts están afiliados a Skyfonts, lo que le permite agregar fuentes pagas.

¡Cuida tus palabras!

las palabras importan

Finalmente, su elección de palabras importa. Probablemente no haga falta que le digamos esto, pero no todos se aseguran de que los textos que escriben sean realmente adecuados para el lector objetivo. Debes adoptar un estilo más ligero para los lectores más jóvenes, pero ser más elaborado cuando te dirijas a lectores mayores que requieran mayor profundidad. Tenga en cuenta a su público objetivo, porque esas son las personas que desea atraer. Si tiene éxito, es probable que el lector regrese por más.

Ten en cuenta tu diseño responsive

Sin duda habrás notado que se está produciendo un cambio en el diseño web, como resultado de lo cual casi todas las producciones, sitios web y otras cosas en la web se han vuelto sensible. Esto significa que todo el contenido de una página cambia de tamaño, lo que permite que también se vea igual de bien en su tableta o teléfono inteligente. Esto tiene repercusiones en la tipografía de un diseño web y significa que debes tener en cuenta los colores, las fuentes y los tamaños de las fuentes. Crear un diseño receptivo es importante, pero lleva tiempo lograrlo.

Con la herramienta Foleon, es fácil aplicarlo en su publicación en línea. Debido a que es posible adaptar los colores, los tipos de fuente y los tamaños de fuente para dispositivos móviles en el estilo de tema general, así como el estilo de página y el estilo de elemento a nivel de página, puede configurar sus páginas como receptivas en muy poco tiempo.

Tal vez te guste:

Biografía del autor

Ritesh SheombarRitesh es un gerente de marketing digital con años de experiencia en impulsar el crecimiento. Actualmente es el director de inbound marketing en Foleon. Puedes encontrar más sobre él en su Perfil de Linkedin.

Domina el arte del vídeo marketing

Herramientas impulsadas por IA para ¡Idee, optimice y amplifique!

  • chispa creatividad: Libere las ideas de video, guiones y ganchos atractivos más efectivos con nuestros generadores de inteligencia artificial.
  • Optimice al instante: Eleve su presencia en YouTube optimizando los títulos, descripciones y etiquetas de los videos en segundos.
  • Amplíe su alcance: cree sin esfuerzo redes sociales, correos electrónicos y textos publicitarios para maximizar el impacto de su video.