paint-brush
Cómo elegir la fuente perfecta para su sitio web y anunciospor@lanamiro
582 lecturas
582 lecturas

Cómo elegir la fuente perfecta para su sitio web y anuncios

por Lana Miro10m2023/02/15
Read on Terminal Reader

Demasiado Largo; Para Leer

La tipografía es una parte esencial de cualquier proyecto de diseño gráfico. Las fuentes pueden hacer que un sitio web se vea mejor e influir en las emociones y el estado de ánimo de sus usuarios. Es crucial para un diseñador gráfico saber la diferencia entre un tipo de letra y una fuente. Muchas características de la fuente contribuyen a lo fácil que es para los lectores decodificar los símbolos de texto.
featured image - Cómo elegir la fuente perfecta para su sitio web y anuncios
Lana Miro HackerNoon profile picture

La tipografía es una parte esencial de cualquier proyecto de diseño gráfico. Las fuentes pueden hacer que un sitio web se vea mejor e influir en las emociones y el estado de ánimo de sus usuarios. Por eso es fundamental elegir la fuente adecuada para un sitio web para garantizar el éxito del diseño gráfico.


Sin embargo, encontrar la fuente perfecta para un proyecto puede ser un desafío. Puede llevar mucho tiempo seleccionar la fuente correcta. Para tomar la decisión correcta, hay algunas cosas que debe recordar.

¿Qué es una fuente?

El tipo de letra y la fuente son dos términos que se usan con frecuencia para denotar el mismo significado. En realidad, cuando la mayoría de la gente dice fuente , en realidad se refiere a un tipo de letra . Es crucial para un diseñador gráfico saber la diferencia entre los dos.


Un tipo de letra es un conjunto particular de glifos que comparten características de diseño comunes y puede describirse como una familia de fuentes con el mismo diseño subyacente.


Un ejemplo familiar es el tipo de letra Arial , que incluye varias fuentes que difieren en tamaño, peso y otras características, pero todas se basan en diseños neogrotescos sans serif. Entonces, Arial es un tipo de letra, Arial Black de 14 puntos es una fuente y Arial Regular de 14 puntos es una fuente diferente.

fuentes ariales


Al buscar combinaciones de fuentes para el sitio web , recuerda que es común utilizar tipografías que pertenecen a la misma familia.


¿Por qué son importantes las fuentes?

Antes de entrar en una discusión sobre las diversas características de las fuentes que hacen que las fuentes sean adecuadas para diferentes contextos, describamos los propósitos a los que sirven todos los diseños tipográficos.

Proporcionar legibilidad

La legibilidad del sitio web mide la facilidad con la que los visitantes pueden leer y comprender el material escrito.


Hay tres tipos de factores que contribuyen a la legibilidad:


  • los atributos personales del lector (deficiencias visuales y otros factores de salud);
  • qué hay en el texto (interacción con el tema, gramática adecuada, complejidad sintáctica);
  • tipografía (la elección del tipo de letra y sus marcos, es decir, las fuentes).


La legibilidad está inevitablemente conectada, pero no debe confundirse con legibilidad .


La legibilidad es una característica de diseño tipográfico que garantiza que cada carácter se distinga de otro. Muchas características de la fuente contribuyen a lo fácil que es para los lectores decodificar los símbolos de texto y, como consecuencia, la legibilidad general del texto, y las analizaremos con más detalle más adelante en este artículo.


Las versiones muy decoradas de los tipos de letra le dan mucha personalidad a una marca, pero sacrifican sustancialmente la legibilidad del texto.


Es por eso que se utilizan principalmente para crear grandes formatos independientes, como logotipos, pancartas, estampados de camisetas y encabezados. Recuerde, la tipografía se creó para transmitir mensajes, por lo que, en la mayoría de los casos, la legibilidad se antepone al diseño.


Denotar jerarquías de texto

Una jerarquía tipográfica permite diseñar divisiones jerárquicas para llevar a los consumidores a ciertos tipos de información mediante el uso de diferentes fuentes y la creación de diferentes diseños de texto.


La forma más fácil de usar la jerarquía tipográfica es emplear varios tamaños de fuente para varias partes del texto: el tipo más pequeño se usa a menudo para el contenido del cuerpo, mientras que el tipo más grande se usa para títulos y encabezados. Otros métodos para distinguir diferentes secciones de información incluyen viñetas, espacios en blanco, colores de fuente, etc.


Debido a que hay tantas opciones para crear piezas de datos visualmente diferentes, una jerarquía tipográfica no tiene que ser una solución única para todos. En su lugar, utilícelo para crear diseños originales que se adapten mejor a su proyecto mientras aumenta la legibilidad del sitio web.


jerarquía tipográfica (Fuente: https://uxcel.com/blog/beginners-guide-to-typographic-hierarchy)


Uno de los deberes más importantes del diseñador es organizar de manera efectiva el contenido de una página web para que sea fácil de consumir. Dado que muchos de los datos que manejan los diseñadores están basados en texto, es esencial aprender cómo los diferentes factores contribuyen a construir una jerarquía.

Mejorar la navegación del sitio web

Si ya creó una jerarquía tipográfica efectiva en una página, es decir, configuró varios niveles de jerarquía, eligió el tipo de fuente, el tamaño, el color, etc., para diferenciar todos los tipos de contenido, asegúrese de aplicar el mismo método en todas partes del sitio web. .


Cuando los usuarios llegan a tu plataforma por primera vez, deben averiguar dónde están las herramientas de navegación , cómo se denota el contenido más importante, de qué color son los enlaces, etc. Si mantiene estos aspectos consistentes en todas las páginas del sitio web, creará una mejor experiencia de usuario para sus lectores.

Crear una marca comercial

Una fuente es un elemento crucial de la marca del sitio web, que tiene un gran impacto en la forma en que los usuarios ven su sitio web. La percepción del consumidor de una marca puede verse influenciada positivamente por el uso de componentes tipográficos finos en su logotipo, y las descripciones de productos pueden hacerse más atractivas mediante el uso de combinaciones de fuentes estéticamente atractivas.

La tipografía efectiva mantiene la atención de los lectores sin distraerlos de la esencia del contenido. No solo puede hacer que su sitio web sea más distintivo, sino que también hace que los visitantes comiencen a asociar su marca con el tipo de letra utilizado en su sitio. En esta época en la que los usuarios acceden a docenas de recursos de Internet todos los días, no se puede exagerar el valor de una imagen de marca sólida y el papel de las fuentes en su creación.

Transmitir estados de ánimo y emociones.

Al elegir fuentes, es importante recordar que la apariencia de los caracteres puede afectar la percepción del contenido por parte del lector. Una de las funciones de la tipografía es conectar a los consumidores con el texto en niveles emocionales. Al igual que ponemos en mayúsculas todas las letras durante una conversación para indicar un grito, las diferentes fuentes crean estados de ánimo y emociones.


Cada fuente tiene su propia voz, y aunque a menudo es fácil diferenciar qué estado de ánimo trata de transmitir una fuente en particular (especialmente cuando se comparan varios tipos de letra), la mayoría de las personas no pueden explicar por qué sienten diferentes emociones cuando ven diferentes diseños de letras.


Una explicación demasiado simplificada que no tiene mucho significado le dirá que tratamos las fuentes y los tipos de letra de la misma manera que tratamos los estereotipos . Por lo tanto, percibimos ciertas emociones de manera subconsciente.


Esa respuesta no es de mucha ayuda para los diseñadores web que deben tener confianza al seleccionar fuentes para sitios web para evocar el estado de ánimo y las emociones deseadas de los lectores.


En la siguiente sección, analizaré las características de las fuentes y su uso para obtener una comprensión mejor y más práctica de qué fuentes deben usarse en qué condiciones.

Características principales del formulario y cómo se utilizan

Al trabajar con el subconsciente, las fuentes juegan un papel esencial en la formación del estado de ánimo y las emociones de los espectadores, incluso antes de que empiecen a leer. La cantidad de fuentes disponibles es prácticamente infinita, lo que facilita la creación de diseños únicos. Sin embargo, elegir las fuentes adecuadas puede resultar complicado, especialmente si no sabes por dónde empezar.


Esta sección explica qué características de las fuentes hacen que las fuentes se ajusten mejor a un contexto u otro.

Peso

El peso se refiere al grosor de los trazos tipográficos en cualquier fuente. Hacer que las letras sean más gruesas o delgadas es una manera fácil de crear una jerarquía de texto. Los pesos de fuente livianos , regulares y en negrita son las tres categorías principales, siendo los tipos de fuente regulares los más populares para la lectura. Los tipos ligeros y audaces transmiten más emociones, como delicadeza y fragilidad en un extremo frente a fuerza y rudeza en el otro.


Los estilos de fuente ultrafina son populares en la industria de la cosmética y la belleza porque transmiten la sensación de cuidado, ligereza y sensibilidad. Los tipos en negrita (especialmente las llamadas fuentes negras, que contienen aún más peso) no son fáciles de leer y se ven principalmente en frases cortas para publicidad, juegos o espectáculos.

peso de fuente (Fuente: https://medium.com/@ltm/typography-part-1-3c3c98211b5)

Ancho

Al igual que con el peso, el ancho es una característica fácilmente identificable que afecta fuertemente la velocidad de lectura. Las fuentes condensadas ocupan menos espacio horizontal que sus contrapartes no condensadas y aparecen cuando es necesario colocar mucho texto en un área pequeña.

Estas fuentes se usan a menudo como encabezados de una línea en columnas angostas de estilo periódico donde no se puede usar una fuente de ancho regular.

Las fuentes estrechas brindan una sensación de tirantez e incluso pueden hacer que los lectores se sientan incómodos. No son fáciles de leer ya que las líneas horizontales en los glifos se reducen y es difícil diferenciar un carácter de otro.


Los estilos de fuente extendidos hacen que incluso las palabras cortas parezcan largas y los lectores tienden a leerlas más despacio. Las palabras se vuelven más memorables y atraen una atención significativa. Debido a que estas fuentes usan más líneas horizontales, son perfectas para crear logotipos y frases para pancartas que deben leerse en ángulo.

ejemplo de diseño de fuente extendida (Fuente: https://commons.wikimedia.org/wiki/File:Logo_Oreo_alt.svg)

Serifs y losas

Las líneas cortas que cruzan los extremos de los trazos en las letras se denominan serif y las fuentes que usan serif son fuentes serif . Sin serif – sans serif.

El tipo Serif fue el primer tipo de letra creado.

A teoría popular dice que en el Imperio Romano, las letras se pintaban primero sobre piedras con pinceles, luego los trabajadores cincelaban la piedra siguiendo las marcas de pincel que se ensanchaban al principio y al final de cada línea, formando serifas.


Incluso las serifas pequeñas aumentan el contraste entre las letras, lo que hace que las fuentes sean más legibles. Es por eso que las fuentes serif son populares en grandes obras científicas y literarias, especialmente para textos impresos, donde la nitidez de la tinta puede degradarse con el tiempo.


Al haber existido durante tanto tiempo, las fuentes serif son una opción versátil y segura que proporciona mucha personalidad y carácter. Dan una sensación de atemporalidad y tradición a muchas marcas de renombre en sus logotipos y son especialmente populares en el periodismo, el derecho, la joyería, la moda y el cine.

fuentes serif, sans serif y slab serif (Fuente: https://atelierlks.com/how-to-choose-the-perfect-font-for-your-brand/)


En comparación con las fuentes Serif, las sans serif brindan un aspecto moderno y se ven favorecidas por los diseños minimalistas. Con frecuencia son empleados por negocios de tecnología, juegos y automóviles.


Las gracias se convierten en losas cuando son rectas, rectangulares y tienen el mismo grosor que los trazos principales del carácter. Las fuentes Slab Serif parecen sólidas y confiables y se ven naturales en los pisos de fábricas, tiendas de herramientas eléctricas, asadores y otras industrias "varoniles".

Fuentes cursivas y oblicuas

Cursiva y oblicua son dos términos relacionados pero separados que describen fuentes en ángulo.


Los diseñadores de tipos crean tipos de fuentes en cursiva para parecerse a la caligrafía manuscrita; Históricamente, su propósito es resaltar el texto. Debido a la inclinación, estas fuentes tienen menos líneas verticales y curvas más elegantes, proporcionando un tono elegante y agradable. Las fuentes cursivas o manuscritas transmiten sentimientos personales y aparecen en saludos y cartas de invitación.


Los tipos de fuentes oblicuas (a veces llamadas cursivas falsas ) aparecen inclinando las letras verticales de un tipo de letra existente. La mayoría de los tipos de letra modernos incluyen fuentes oblicuas junto con otros tipos de letra. Resaltan partes del texto y, a veces, le dan una sensación de velocidad. Los diseñadores informan que las sans serif oblicuas no se destacan en el texto tanto como las serif oblicuas.

fuentes regulares cursivas oblicuas


Contraste

El contraste de fuentes es una diferencia de ancho entre los trazos finos y gruesos de un carácter. Las fuentes con contrastes medios y bajos son preferibles para lecturas largas y no evocan necesariamente ningún estado de ánimo o emoción.


Las fuentes monopeso (con trazos uniformes) tienen buenas cualidades de legibilidad. Tienen menos conexión con la escritura a mano con trazos irregulares, añadiendo una sensación de modernismo e industrialismo a los textos.


Las fuentes de contraste extra heredan las características de las fuentes del clasicismo. La diferencia entre trazos finos y gruesos crea la sensación de dramatismo y permite la creación de encabezados elegantes sacrificando algo de legibilidad.

altura X

La altura x, o tamaño del cuerpo, es la altura de las letras minúsculas en comparación con las letras mayúsculas. Las fuentes con tamaños de cuerpo pequeños (donde la altura de las letras minúsculas es más del doble más pequeña que la de las mayúsculas) brindan un gran contraste entre las letras de una fuente, lo que facilita que los ojos salten al comienzo de cada oración. Estas fuentes exigen más espacio entre las líneas de texto. Como parecen más expresivos, son perfectos para leer poemas y composiciones musicales.


Por el contrario, las fuentes con grandes alturas x crean textos uniformes, proporcionando una sensación de estabilidad. También permiten el ajuste de más líneas de texto en un espacio determinado.

altura x en tipografía (Fuente: https://medium.com/8px-magazine/practical-guide-to-font-pairing-da58b9bcd42b)

esquinas

Las intersecciones de líneas rectas en letras forman esquinas con bordes afilados. Redondear estos bordes hace una gran diferencia en la percepción de una fuente que forma asociaciones con superficies suaves y agradables al tacto. Las formas redondeadas también están más extendidas por naturaleza, por lo que parece normal que las fuentes con esquinas redondeadas sean populares en las industrias de alimentos y productos para bebés.

fuente con esquinas redondeadas (Fuente: https://www.dunkin.co.uk/)

Por otro lado, los bordes afilados pueden expresar tensión e incluso incomodidad. Las fuentes con una nitidez exagerada son populares para hacer todo tipo de logotipos y son la opción número uno para las bandas de metal.

fuente de bordes afilados para metaleros

Consejos para elegir la fuente adecuada para su diseño

Elegir fuentes para su sitio web puede ser complicado para los diseñadores no capacitados. Ahora que se ha familiarizado con los principales elementos de las fuentes, puede analizar mejor las fuentes y seleccionar las que funcionen para usted. Aquí hay algunos consejos adicionales para su consideración:


  • Piensa en la personalidad. ¿Quiere que su sitio parezca serio, divertido, de alta tecnología o elegante? Defina qué atributos de fuente reflejan las características de su sitio y comience a recopilar los tipos de letra apropiados.
  • No te saltes ninguna de las funciones principales de la fuente. Por ejemplo, no use tipos de letra decorativos que sean difíciles de leer para grandes fragmentos de texto y evite diseños neutrales que no transmitan carisma. Además, las fuentes inusuales pueden distraer a los lectores, por lo que elegir fuentes siempre es una cuestión de equilibrio.
  • Mantenga el número de fuentes al mínimo. El uso de más de tres fuentes en un sitio web hace que parezca desestructurado y difícil de enfocar.
  • No utilice fuentes similares en un proyecto. Al usar diferentes fuentes, podrá crear diversidad visual y un diseño más interesante.
  • Elija una familia tipográfica ampliada. Cuando encuentre una fuente que le guste, consulte otras fuentes de la familia. Vea cómo se ven los caracteres en diferentes tamaños, pesos y otras fuentes.

Elegir fuentes y crear diseños gráficos puede ser difícil y llevar mucho tiempo. Pero espero que este artículo te haya ayudado a sumergirte en los conceptos básicos para elegir la fuente correcta. 😉