La importancia del diseño para la legibilidad

El texto no es una idea de último momento en el proceso de diseño. Debe ser tu primera consideración.

La legibilidad debe ser una de las principales preocupaciones cuando se trata de cualquier proyecto de diseño. Si el texto no se puede leer, ¿por qué diseñas en primer lugar? El buen diseño entrega contenido de una manera que es comprensible; La legibilidad es una gran parte de la comprensión. Hoy hablaremos sobre cómo puede planificar un diseño alrededor de las palabras, para que sus proyectos sean fáciles de leer.

¿Qué es la legibilidad?

Hablamos mucho de legibilidad cuando se trata de diseño. Pero la legibilidad, y el texto legible o legible, no son exactamente lo mismo. Si alguien puede distinguir las letras, el texto se considera legible. Sin embargo, eso no significa que las palabras sean necesariamente fáciles de leer o comprender; Simplemente son descifrables.

La legibilidad es la facilidad con la que se puede leer el texto. La comprensión es un factor clave en términos de legibilidad, ya que es capaz de ver y entender rápidamente las letras. El texto legible se puede escanear rápidamente, desde la distancia.

La legibilidad también tiene en cuenta las palabras en sí mismas y la facilidad de comprensión y comprensión. (Algunos expertos recomendaron que el texto escrito para consumo general no debe exceder un nivel de lectura de octavo grado para maximizar la legibilidad).

Echemos un vistazo a algunos de los estándares visuales que contribuyen a la legibilidad.

Longitud de la línea

? ¿Por cuánto tiempo una línea de tramos de tipo puede ser un factor clave en lo que respecta a la legibilidad y es casi invisible?

Las líneas de tipo, especialmente en bloques grandes, que son demasiado largas pueden cansar los ojos y dificultar la lectura. Las líneas que son demasiado cortas a menudo resultan en saltos incómodos. Si se usa la separación con guiones, las líneas cortas también darán como resultado muchas palabras con guiones, que también pueden dividir el flujo de la lectura.

Donde quieras que caiga el texto está en algún lugar de ese medio feliz. El texto debe ser lo suficientemente grande como para leerlo con facilidad, pero no tanto que cause pausas extrañas o interrupciones en la lectura.

Hay una variedad de estándares que contribuyen a la longitud de línea perfecta (e incluso algunas fórmulas matemáticas). Una de las mejores toma en cuenta el ancho de un marco de texto (esto funciona mejor para proyectos impresos pero se aplica a cualquier cosa que use picas como herramienta de medición) y lo divide por la mitad para determinar el tamaño de fuente óptimo. Por lo general, puede ajustar el tamaño del punto hacia arriba o hacia abajo un par de puntos en cualquier dirección desde ese punto de inicio.

Así que si una columna es 36 picas de ancho (en letra de imprenta), el texto sería sobre 18 puntos.

¿Qué pasa con los proyectos digitales que miden en píxeles?

Puedes aplicar la misma fórmula, pero se complica un poco más: hay 16 píxeles por foto. Entonces, si su marco tiene 600 píxeles de ancho, el texto sería 18-19 puntos. (600/16 = 37.5 / 2 = 18.75). Personalmente, creo que esto deja al tipo un poco en el lado grande. Eso nos lleva a la opción # 2 para proyectos digitales. Establecer tipo en términos de caracteres (y espacios) por línea.

Cuando se trata de texto de cuerpo, el número óptimo de caracteres por línea es de 50 a 60, según uno de los libros de texto de tipografía atemporal, "Tipografía: un manual de diseño" por Emil Ruder. Ese rango se puede ampliar en función del estilo del tipo utilizado y del dispositivo en el que se está viendo. Para la mayoría de los proyectos, el rango seguro para dispositivos de escritorio es de 45 a 75 caracteres por línea. El rango óptimo para dispositivos móviles es de 35 a 50 caracteres por línea.

Espacio y contraste

El espacio y el contraste adecuado son componentes clave cuando se trata de legibilidad. Las letras deben vivir en su propio espacio (no compartir con otras letras o imágenes) y el color del texto y el fondo deben ser lo suficientemente diferentes para poder distinguirlos.

Al igual que con la longitud de línea, el espacio entre líneas es importante. Se recomienda que el espacio entre las líneas de tipo (llamado líder) sea al menos igual al tamaño de punto del tipo y la mayoría de los diseñadores digitales optan por un mínimo del 150 por ciento del tamaño del texto. Esto deja mucho espacio para cada línea en grandes bloques de texto para leer. Al igual que con la longitud de línea, demasiado o muy poco espacio entre líneas, puede dificultar la comprensión.

Los diseñadores también deben prestar especial atención al espacio entre los bloques de texto y otros objetos. Tenga en cuenta las envolturas de texto y el texto que cruza los límites de otros objetos. Los ajustes de texto, tanto verticales como horizontales, deben ser al menos iguales al espaciado de línea utilizado para un bloque de texto. Evite permitir que los bloques de texto toquen otros objetos o elementos, o correr sobre o encima de las imágenes.

• Tipo de color de reserva para palabras o logotipos grandes o de gran tamaño.

No te olvides de los márgenes. Recuerda dejar un espacio en blanco alrededor de todo el marco de texto, creando un halo casi invisible. Este margen ayudará a separar el texto de otros "ruidos". facilitando al lector en la copia.

Piensa también en el contraste. El espacio es una forma de crear contraste; otro es el color. El texto en negro sobre un fondo pálido es una opción popular para blogs y libros porque los bloques de copia grandes deben estar separados del medio (papel o pantalla). Cuando se trata de bloques de texto para leer, manténgase en las opciones de colores simples como negro, blanco o gris que se destacan del fondo. Reserve el tipo de color para palabras grandes o de gran tamaño o logotipos.

Separación de palabras y saltos de palabras

Una de las cosas más irritantes para un lector es un guión gigante en medio de un titular o una subpartida que abarca tres o cuatro líneas de profundidad. Preste especial atención a estos detalles al configurar el tipo, ya que pueden ser agravantes para los lectores y difíciles de comprender.

Los guiones hacen que los lectores se detengan y se detengan en medio de una palabra. Deben ser eliminados de los tipos y muebles grandes (cualquier cosa mayor a 25 puntos) y usarse con cuidado en letras pequeñas.

Algunos guiones son aceptables en bloques de copia grandes, pero considere establecer un número limitado de guiones por párrafo.

La mala escritura y los saltos de palabras pueden ser tan discordantes para los lectores. Trate de mantener los titulares y subtítulos cortos, simples y directos. Evite las frases largas y mantenga la redacción concisa. Dele a los lectores una idea del texto que viene, y téntelos a leer más.

Cuando trabaje con proyectos digitales y web, tenga en cuenta muchos cortes y subtítulos para grandes cantidades de copias (verá que hacemos eso aquí con los artículos de Design Shack). Estos cortes hacen que el texto sea más fácil de digerir visualmente y hace que una copia más larga parezca menos intimidante para leer.

Alineación

Si el texto está en el centro, a la izquierda o al lado derecho de un documento o pantalla, también es importante y puede impactar enormemente la legibilidad. En términos generales, la alineación fuerte para el texto se alinea a la izquierda. La alineación a la izquierda funciona porque refleja la forma en que se lee, de izquierda a derecha. Usted sabe dónde termina cada línea y dónde comienza la siguiente.

Las alineaciones correctas y justificadas pueden ser las más difíciles de usar. La alineación correcta se reserva mejor para pequeños bloques de texto, como citas grandes o elementos de texto artístico. El texto justificado requiere especificaciones de separación y justificación precisas y es mejor utilizarlo en un entorno no fluido, por lo que lo ve más comúnmente en los límites del diseño de impresión.

El texto centrado, si bien es popular, no se presta a la legibilidad. Puede funcionar para bloques de texto pequeños, pero no debe utilizarse para más de unas pocas líneas. (Consulte esta publicación anterior de Design Shack en Cómo utilizar alineaciones centradas para obtener ideas y ejemplos.) La dificultad con el texto centrado es que puede ser difícil para el ojo saber dónde comienzan y se detienen las cosas, ya que las líneas están rasgadas en ambos lados de la ventana. bloque de copia.

Herramientas de legibilidad

  • La herramienta de prueba de legibilidad: Ingrese una URL (o bloque de texto directamente) y obtenga una puntuación de legibilidad calculada matemáticamente. Obtendrá resultados rápidos y fáciles de entender, como la lectura del nivel de grado y las puntuaciones en varios índices de legibilidad, además de un análisis general. La herramienta también incluye un ingenioso bookmarklet.
  • Legibilidad: Este complemento y aplicación de navegador web convierte cualquier página web en una vista limpia para leer y le permite recopilar páginas para leerlas más tarde.
  • Prueba de legibilidad de Juicy Studio: Obtenga más información sobre todas las diferentes pruebas de legibilidad y algoritmos, y sobre cómo entender qué significa cada uno y cómo se puede relacionar con sus proyectos.
  • ¿Arquitectos de la información? ¿El estándar 100% fácil de leer 2? Este artículo escrito en 2006 incluye una lista de verificación de legibilidad de clases. Si bien se aplica principalmente al diseño web, muchos de los consejos son estimulantes y siguen siendo aplicables en la actualidad.

Conclusión

Diseñe para facilitar la lectura o no se moleste en utilizar texto. Si desea que su contenido sea efectivo, debe ser legible. Al diseñar teniendo en cuenta la legibilidad, le está haciendo un servicio a sus lectores y usuarios.

Con tanta información, los usuarios tienden a mirar (o hacer clic) lejos del texto que no es fácil de entender en un instante. Esos son lectores, o clientes potenciales, que tal vez nunca vuelvas.