Guía definitiva de tipografía web: reglas, glosario, ideas y mejores prácticas

‘Una imagen vale mas que mil palabras.’

La mayoría de las veces, las imágenes transmiten lo que tienen que decir. Sin embargo, una imagen con texto tiene un impacto más fuerte.

La tipografía actúa como un compañero de sus gráficos. La tipografía no es solo elegir una fuente aleatoria y un tamaño de punto del menú desplegable de su software de edición. Es un campo especializado en diseño gráfico. Es el arte y la técnica de ordenar tipos. Es una de las habilidades importantes que puede diferenciarte del resto de los diseñadores si sabes cómo usarla.

¿Qué es la tipografía?

Antes de entrar en el arte y la técnica de la tipografía, primero, comprenda de qué se trata la tipografía. La tipografía es la pieza visual de texto (palabra escrita). Un texto es una serie de palabras. Todos y cada uno de los textos visualizados que ves son básicamente tipografía. El texto se puede clasificar de tres maneras: visual, audible y digitalmente.

La tipografía es más que el diseño de letras y caracteres. Incluye la opción de tamaño de punto, espaciado y longitud de línea. En la época en que Johannes Gutenberg introdujo la imprenta, los tipógrafos tenían que organizar las letras y los caracteres en el espacio físico. Ahora, en la era de las computadoras, este trabajo es mucho más fácil. Solo tiene que encontrar fuentes de código abierto, organizar letras y caracteres, y listo.

Importancia de la tipografía

La tipografía es algo que encontrarás absolutamente en todas partes. Digamos que podría ser su teléfono inteligente, una taza de café, una valla publicitaria, ropa y mucho más. La tipografía está en todas partes. La selección de fuente, letra y disposición de caracteres decide cómo se transmitirá su mensaje.

Incluso si parece un factor pequeño en su opinión, ciertamente no lo es. Incluso un solo tipo de ajuste puede cambiar por completo el aspecto de su obra de arte. Si alguna vez notó que Facebook probó una nueva fuente llamada Ginebra en junio de 2016. Era una versión ligeramente más delgada y liviana de la fuente Helvetica original. Pero, la diferencia entre estas dos fuentes fue notable.

Reglas de tipografía

En tipografía, debe elegir el tipo de letra de acuerdo con su diseño, cuadrícula, tema de diseño, combinación de colores, etc. Aquí hay algunas reglas de tipografía que debe tener en cuenta mientras trabaja.

Elegir la fuente correcta

Si pasa unos minutos en Internet, encontrará una asombrosa variedad de fuentes gratuitas y de pago listas para usar. Pero eso no significa que tengas que pasar horas buscando las fuentes exactas que visualizas en tu mente. Puedes empezar a pintar incluso con una paleta limitada. Hay algunas fuentes probadas como Helvetica que nunca pueden fallar en ningún proyecto.

Una tipografía es una forma de diseño que está formada por artesanos que aportan todos sus esfuerzos y habilidades durante un período de tiempo considerable. Las fuentes diseñadas profesionalmente ofrecen una variedad de personalización en términos de pesos y estilos para crear una familia completa. Además, ofrecen considerables pares de interletraje, compatibilidad con la personalización de configuración de tipos en varios idiomas.

Los siguientes son los términos tipográficos más importantes que se consideran:

Tamaño

No todas las tipografías se crean por igual. Algunos usan aspectos gruesos y anchos, mientras que otros son delgados y angostos. Diferentes tipos de tipografías pueden adquirir diferentes cantidades de espacio en la página.

La altura del carácter se denota como altura X. Cuando empareja diferentes tipos de letra, es una buena práctica usar solo aquellos tipos de letra que comparten una altura x similar. Por otro lado, el ancho del carácter se denomina ‘ancho establecido’, que decide cuánto espacio ocupará la letra y cuánto espacio en el búfer con otras letras.

El sistema de puntos es el método que se ha utilizado para medir tipos desde el siglo XVIII. Un punto se puede medir como 1/72 de pulgada y 12 puntos pueden formar una pica. Pica es la unidad para medir el ancho de columna. Además, los tamaños se pueden medir en píxeles, pulgadas o milímetros. Depende del requerimiento del proyecto.

Principal

El espacio vertical entre cada línea de tipo se conoce como interlineado. La razón para llamar a esto como guía es porque las tiras de plomo se usaban para dividir las líneas de tipo en la época en que se usaba la composición tipográfica de metal. La regla general para obtener un cuerpo de texto legible es usar un valor inicial mayor que el tamaño de la fuente. Puede utilizar un valor principal superior en 1,25 a 1,5 veces.

Seguimiento y interletraje

Kerning es el acto que involucra los ajustes de espacio entre los personajes. Ayuda a generar un maridaje armonioso.

Por ejemplo, cuando usa una mayúscula de la letra ‘A’ con la mayúscula de la letra ‘V’, los trazos diagonales de la parte superior izquierda de la letra ‘V’ se intercalan con la parte inferior derecha de ‘A’.

Por otro lado, el seguimiento es el término que se relaciona con el espaciado de todos los caracteres que se aplican de manera uniforme. Kerning es similar a la pista, pero ambos no son lo mismo.

Medida

La medida es un término que explica el ancho de un bloque de texto. Para una experiencia de lectura óptima, debe considerar la medida como un aspecto importante de la tipografía.

Jerarquía y escala

Todos los tipos no se pueden usar en el mismo tamaño, debe establecer la jerarquía para los tipos. De lo contrario, será difícil para los lectores comprender qué información es más importante que las demás.

Generalmente, los títulos son grandes, los subtítulos son más pequeños y el tipo de cuerpo es ligeramente más pequeño que los subtítulos para ayudar a los lectores a comprender su jerarquía.

No solo el tamaño, el uso de diferentes colores, pesos y espacios también puede ayudarlo a establecer una jerarquía en su trabajo.

Glosario

Hemos cubierto casi todos los conceptos y terminologías fundamentales relacionados con la tipografía aquí.

• Aesc: Se pronuncia como ‘Ash’. Es una ligadura de dos letras a saber. ‘a’ y ‘e’. El origen de aesc es del inglés antiguo, donde se significa como una vocal diptongo. El Aesc ha migrado a alfabetos como el islandés y el danés.
• Abertura: La abertura es una abertura anudada de un glifo que se puede ver en letras como ‘e’. El tamaño de la abertura varía según su implementación. Sin embargo, como variará la apertura, su efecto se reflejará en la legibilidad de una forma de letra.
• Apex: Apex es el punto que está en la parte superior de un carácter. Es el lugar donde se encuentran los trazos izquierdo y derecho.
• Línea base: Es una sección donde se asienta la base de las letras mayúsculas.
• Tazón: Tazón se considera como las partes encerradas de letras como ‘b’ y ‘p’.
• Soporte: es un contorno en forma de cuña que es valioso para sostener una serifa y formar el tallo de una fuente en varios tipos de letra.
• Altura de la tapa: la altura de la tapa es la altura de una letra mayúscula por encima de la línea de base.
• Contador: El contador está encerrado o encerrado de forma incompleta en una sección de un formato de letra. El contador se puede ver en letras como ‘c’ o la parte inferior de ‘g’ y ‘e’. Esta sección se puede mezclar con el recipiente.
• Descendente: Es una parte de la letra que va por debajo de la línea de base. Por ejemplo, letras como ‘p’, ‘y’ y ‘q’.
• Oreja: La oreja es un trazo pequeño que se expande desde el lado superior derecho del cuenco.
• Glifo: Es una parte singular que construye una fuente. Se incluye cualquier tipo de parte singular que ayude a construir una fuente, ya sea un signo de puntuación, un número, una letra o incluso un dingbat. Los glifos se pueden llamar los componentes básicos de la tipografía.
• Gutter: Es el espacio provisto entre las páginas enfrentadas de su trabajo. Los canales se pueden ver comúnmente en columnas de texto.
• Huérfano: Huérfano es la primera línea de un nuevo párrafo que se enhebra al final de una página. No es algo que le gustaría tener en su proyecto, ya que se considera una mala práctica.
• Pica: Pica es la unidad para medir el ancho de columna. Hay 16 píxeles o 12 puntos en una pica.
• Legibilidad: se refiere a la facilidad de lectura que incluye el uso de un bloque de texto que se puede escanear fácilmente a simple vista.
• Serif: Es una tipografía con serifas. El final del trazo de una forma de letra en este tipo de letra se deriva de la tendencia romana.
• Sans-serif: Una tipografía sin serif es una sans-serif o sans serif.
• Lomo: Es el trazo curvo mayor que está presente en las minúsculas de la ‘S’ mayúscula.
• Espuela: Es una pequeña protuberancia que aparece en la curva de una forma de letra. También se le llama barba o pico. Por ejemplo, la letra ‘G’.
• Tallo: un trazo completo se llama tallo en caracteres verticales. es vertical
• Altura X: la altura de la letra ‘x’ en minúsculas en un tipo de letra determinado es una altura x.

7 ideas tipográficas y mejores prácticas

Las siguientes son las mejores prácticas tipográficas que puede utilizar en su trabajo. Utilice estos consejos en sus proyectos para crear sus propias obras maestras.

Importancia de la elección de las fuentes correctas

Cada diseñador tiene una lista de sus fuentes favoritas. Pero eso no significa que tengas que elegir una fuente solo de tu lista de favoritos todo el tiempo. Cada tipo de letra tiene su propio estilo, personalidad y estado de ánimo. Por lo tanto, tendrá que decidir qué fuente se adaptará perfectamente a su diseño. La elección de la fuente es importante ya que te ayuda a transmitir tu mensaje a tu audiencia.

Ten en cuenta a tu audiencia

Después de elegir una fuente que complemente la idea de su diseño, debe pensar si coincidirá con su audiencia. Un grupo de su público objetivo puede sentir que sus fuentes están de moda, mientras que algunas personas las llamarán obsoletas. Por lo tanto, deberá comprender para quién está diseñando el proyecto. La edad, el sexo, la ubicación y otros factores de su audiencia deben tenerse en cuenta antes de decidirse por la fuente.

Establecer una jerarquía

Como se mencionó antes, la jerarquía juega un papel importante en la tipografía. Sus gráficos deben estar bien organizados y deben facilitar la navegación a los lectores. La jerarquía tipográfica es muy útil para hacer diseños con mucho texto, como libros, boletines, revistas y otras publicaciones impresas tradicionales.

Preste atención al espaciado y la alineación.

El espaciado y la alineación pueden sonar menos importantes, pero ciertamente no lo son. Sin el espaciado y la alineación adecuados, sus diseños se verán confusos, desordenados y ordinarios. El espaciado incluye el uso de encabezados, márgenes, seguimiento y espacios en blanco.

Use Kerning cuando lo requiera

Muchos diseñadores se confunden entre el seguimiento y el interletraje. Sin embargo, ambos son términos diferentes. Kerning le permite hacer que su tipografía se vea profesional y pulida.

No exceda el uso de tipos de letra, pesos y estilos.

A todos nos gusta usar diferentes fuentes y personalizarlas para que se vean elegantes. Sin embargo, el uso de diferentes tipos de letra en un solo diseño puede hacer que su trabajo parezca aficionado y desordenado. Debe evitar el uso de más de tres fuentes en un diseño para darle un aspecto profesional.

Observa y Practica

La única forma probada de mejorar sus habilidades tipográficas es estudiar cómo otros diseñadores usan la tipografía en su trabajo. Es la habilidad que requiere práctica y atención a los detalles para comprender cómo alguien ha usado la tipografía en su proyecto y cómo podrá usarla en sus proyectos.

Esta fue la guía definitiva para la tipografía. Espero que esta guía te haya ayudado a comprender diferentes conceptos y prácticas con los que puedes mejorar tus habilidades tipográficas.