Krypton Solid

Cómo mantener limpio su texto

Cómo mantener limpio su texto

Nada es más importante que la legibilidad cuando se trata del texto de su sitio web.

Absolutamente nada.

Si no puedes leer las palabras, ¿de qué te sirve? ¿Quién recibe tu mensaje?

Tan importante como las palabras mismas es el diseño del texto, desde las fuentes hasta la separación de sílabas y la forma en que se organiza todo en la pantalla. Parte del diseño incluye las palabras en sí, la forma en que compones las «palabras importantes» en tu sitio también puede marcar la diferencia.

Selección de fuentes

Hay tantas fuentes para elegir. Puede resultar bastante abrumador.

No dejes que sea así. Lo mejor que puede hacer cuando se trata de legibilidad es mantenerlo simple.

Seleccione uno o dos tipos de letra para su sitio. Un buen lugar para comenzar es con una fuente para el texto del cuerpo principal y otra para las palabras grandes, como encabezados, pancartas y texto de desglose. Usar una fuente diferente para cada elemento distrae, confunde y es difícil de leer.

Comience con una fuente sans serif para la copia del cuerpo principal. Las sans serif son las más fáciles de ver cuando se trata de lectura de pantalla y tienden a funcionar bien incluso en tamaños más pequeños. Las fuentes serif pueden comenzar a «correr juntas» o perder sus serifas según el tamaño de fuente, la resolución de la pantalla e incluso el contraste de color entre el texto y el fondo.

Tenga en cuenta que el texto de su cuerpo será lo más leído en el sitio y debe ser fácil de digerir en las pantallas de computadoras, tabletas o dispositivos móviles. Está bien usar diferentes estilos de este tipo de letra dentro de la copia, pero no se vuelva loco. La negrita y la cursiva son excelentes para los puntos de énfasis, pero los bloques grandes de estos estilos pueden ser difíciles de leer.

Si necesita ayuda para seleccionar un tipo de letra, intente emparejar fuentes con herramientas en línea como Google Web Fonts o Typecast.

Fuentes web de Google

Separación

Los guiones son malos. Es feo. Es ineficaz y confuso. (Y estos problemas se magnifican en todas las plataformas).

Separación

Manténgase alejado de ella.

En caso de que necesite un repaso, la separación de palabras se produce cuando una palabra se divide al final de una línea, lo que hace que parte de una palabra aparezca al final de una línea y el resto de la palabra aparezca al principio de la siguiente. El uso de guiones ha pasado de moda en lo que respecta al diseño web, pero todavía te lo encuentras de vez en cuando. (Se usa regularmente en publicaciones impresas, como periódicos).

La idea detrás del uso de guiones era permitir que el texto se espaciara correctamente (y de manera uniforme) a través de las líneas. Cuando se trabaja con texto justificado, es posible que surjan problemas de espaciado extraños cuando se eliminan los guiones.

Pero los guiones que dividen las palabras pueden dificultar la lectura del texto. Leer un guión puede hacer que una persona se tropiece o malinterprete una palabra. El uso de guiones también puede cambiar inadvertidamente el énfasis de ciertas palabras o su impacto en el resto de la copia. Inconscientemente, un guión le dice al lector que la palabra es un poco menos importante que otras palabras que están enteramente traducidas.

Reserve guiones solo para las palabras que los necesiten, como con modificadores, y no para romper líneas. El texto se verá más limpio y profesional y tendrá una mayor legibilidad sin todos esos molestos guiones al final de las líneas.

Mala raqueta

Justificación

Al igual que la separación de sílabas, la justificación completa se ha salido de la moda del diseño web, aunque todavía se usa comúnmente en la impresión.

Justificación

La escritura con ajuste completo llena cada línea por completo desde un margen izquierdo hasta el margen derecho para que cada línea tenga el mismo ancho. El uso de la justificación completa crea (y cierra) espacios entre palabras para que el espaciado no se distribuya uniformemente. El uso de este tipo de alineación de texto puede funcionar para algunos sitios web, pero no siempre es la opción más atractiva a la vista. Observe cómo se divide su texto e intente leerlo varias veces para evaluar si la justificación completa es una opción viable.

También existen otros tipos de «justificación» o alineación de texto. Puede configurar el texto para que se alinee en el margen izquierdo, en el margen derecho o en el centro.

Para los sitios web en inglés, la justificación a la izquierda es la práctica más común. El texto se alinea con el margen izquierdo y tiene un borde derecho irregular. La sensación es amigable y fácil de leer. Debido a que esta técnica es tan común, muchos lectores ni siquiera notarán cómo está configurado el texto. Esta es su mejor opción para trabajar con grandes bloques de texto.

Nanozoom

La alineación a la derecha es otra opción, pero no funciona tan bien con fragmentos de texto. Con el texto alineado en el margen derecho y desigual en el izquierdo, los puntos de inicio y finalización se ubican de manera incómoda en la pantalla. El orden de lectura natural se invierte y la sola idea de leer un texto de esta manera (especialmente en grandes cantidades) puede incomodar al lector. Reserve texto alineado a la derecha para pequeños desgloses si desea incorporarlo en su esquema de diseño.

La fábrica de papel

El texto centrado es una herramienta bastante popular, aunque no se recomienda para bloques de texto grandes. (De acuerdo, encontrará que se usa de esta manera en toda la web.) Las trampas de la alineación central son muy similares a las asociadas con el texto alineado a la derecha: no tiene inicios y paradas «naturales» y puede resultar incómodo en la página. El texto alineado al centro puede parecer algo formal (porque a menudo se usa para elementos como invitaciones) y debe reservarse para pequeños fragmentos de texto donde el énfasis es importante. No es una buena opción para bloques de copia grandes.

Otros efectos de tipo

Trazos o contornos

Úselo con moderación en elementos de texto más grandes como un punto de énfasis, pero evite en texto pequeño.

Tachado o subrayado

Ambos se usan comúnmente: tachado como una notación de que algo ya no es válido y subrayado para enfatizarlo. Siga usando estas herramientas, pero utilícelas con moderación. Ambos funcionan para pequeños fragmentos de texto, pero causan enormes problemas de legibilidad cuando abarcan más de unas pocas palabras.

53

Inclinaciones o distorsiones

Estos efectos son excelentes cuando se utiliza la tipografía como forma de arte. No son tan efectivos cuando intentas transmitir un mensaje. Debe evitar manipulaciones de texto y distorsiones en la copia del cuerpo principal.

Color

hip2save

El uso del color puede ser una gran herramienta para enfatizar una sola palabra en un bloque de texto. (Las combinaciones de colores más comunes y visualmente atractivas para los bloques de texto son negro o gris oscuro sobre blanco o blanco sobre un fondo oscuro). Busque colores que contrasten claramente con el fondo para que sean fáciles de ver y leer. Los colores superbrillantes (como el amarillo o el fucsia) pueden resultar difíciles de leer a menos que se utilicen con un tipo de letra grande y grueso. Considere escribir en negrita con color para un énfasis adicional, pero reserve esta técnica para un número limitado de palabras.

Mantener limpio el texto grande

Aunque la separación de sílabas puede considerarse una cuestión de preferencia en el cuerpo del texto, siempre debe evitarse en letras grandes. Los estilos de justificación simples son imprescindibles; texto alineado a la izquierda o al centro son sus mejores opciones.

Los encabezados, pancartas, desgloses y otros tipos o muebles grandes deben ser fáciles de leer. Estas palabras no solo se utilizan para la navegación, sino que también deben leerse para mantener a las personas en movimiento a través del contenido de su sitio web.

Los guiones son obstáculos.

La alineación extraña no ayudará a la navegación.

También hay algunas otras cosas en las que pensar al trazar el diseño para su tipo grande.

Piense en el tamaño del texto en proporción al texto del cuerpo principal. Los titulares y los encabezados que son significativamente más grandes y audaces hablarán en voz alta a los lectores, mientras que los muebles más pequeños y delgados susurrarán.

Pizza de Dewey

El contraste es de suma importancia para las palabras grandes. Al elegir las fuentes, elija algo para los muebles que no sea muy similar al cuerpo del texto. Considere una fuente serif, teniendo en cuenta que las serifas funcionan mejor en tamaños grandes para que los terminales y los detalles de cada letra no se pierdan en los píxeles. Otra opción es optar por el color para establecer un estilo y una jerarquía distintos para los muebles.

Estudios éticos

Piense también en el espacio alrededor de las palabras grandes. Asegúrese de que las palabras grandes estén cerca de la copia que describen. Agregue espacio adicional sobre cada encabezado o título y condense el espacio entre este y la copia.

Escribe para encajar

Finalmente, piense en el ajuste.

Mire cómo se alinea el texto una vez que haya escrito la copia de las palabras grandes. ¿Llena la línea? Cuantas lineas?

Visualmente, desea optar por encabezados que tengan un aspecto coherente. Esto se aplica tanto al estilo de letra como a la longitud de las palabras. Evite los elementos que llenan una línea por completo y solo una fracción de la siguiente. Piense en los muebles en términos de pequeños rectángulos; desea que todo encaje dentro del marco sin dejar espacios en blanco.

moderno

Cree un estilo para las palabras grandes, ya sea un encabezado simple que contenga solo unas pocas palabras o pensamientos completos de dos líneas encima de cada sección de texto. Considere que parte de este estilo es el tipo de título que usa: ¿hará una pregunta, será una declaración de hechos, le dirá a los lectores qué hacer, mostrará cómo hacer algo o será más indirecto y lindo con palabras y frases?

Intente escribir encabezados y titulares que tengan solo una línea (dos como máximo), use palabras activas.

Tipo de elaboración

Esto puede ser difícil de lograr y desconfíe de los trucos. No tome un diccionario de sinónimos y sustituya una palabra grande por una corta solo para que las cosas encajen. (Correrás el riesgo de usar la palabra incorrecta o un término cuyo significado quizás no conozcan los lectores). Piensa en forma conversacional al escribir. Redacte las palabras y luego revise (corte o agregue) para mantener la integridad de lo que desea expresar y producir una copia limpia y fácil de leer.

Conclusión

La copia limpia es más que simples tipos de letra y guiones. Se trata de escribir un texto que tenga sentido y presentarlo de manera legible.

Piense en su audiencia cuando lo ponga todo junto. Usaría una técnica y un estilo diferentes al escribir publicaciones de blog sobre ideas de bodas (sensación tradicional y femenina) en lugar de blogs sobre tatuajes (probablemente más atrevidos y oscuros). Su audiencia tiene un impacto en las imágenes, también deberían afectar su copia.

Pero lo más importante es pensar en cómo se junta todo. Elimine todo lo demás del diseño de su sitio, dejando solo el tipo. Es fácil de leer? ¿Tienes que acercar o alejar la imagen? ¿Estás entrecerrando los ojos en la pantalla? Estas son las preguntas reales que debe responder porque, al final del día, lo que más importa es la legibilidad.

¿Qué texto te resulta difícil de leer en línea? ¿Qué técnicas utilizas para que tu texto sea legible? Háznoslo saber en los comentarios.

Imagen destacada / miniatura, imagen de texto a través de Shutterstock.

Deja un comentario