Cómo estructurar el contenido escrito

¿Cómo leemos? ¿Por qué algunos elementos nos llaman la atención y otros no? El neuromarketing nos ayuda a entender cómo nuestro cerebro interactúa con una página web y nos ofrece muchas herramientas para mejorar su usabilidad. 

En los tutoriales anteriores hemos analizado los 2 elementos principales que caracterizan un artículo:

el título ---> Un Título Efectivo: Cómo Escribir la Parte Más Importante del Artículo

las imágenes ---> La imagen perfecta para llamar la atención en tu artículo ; Reglas de Composición: Por qué ciertas fotos atraen la mirada y otras no

Ahora veremos cómo estructurar el texto y los elementos de la página para optimizarlos y adaptarlos a las necesidades de la red. 

¿Cómo leen los usuarios en la web? 

A partir de los datos recogidos en artículos anteriores, hemos visto que no sólo el 80% de los usuarios se limitan a leer el título de un artículo, sino que también los que empiezan a leer el texto tienden a centrarse en un pequeño porcentaje de palabras.

De hecho, la mayoría de los usuarios de la web utiliza un modo de lectura llamado «escaneo» o «lectura exploratoria» en el que el ojo escanea la página y se detiene en los elementos que más le llaman la atención. Según Nielsen(1), hasta un 80% lee exactamente así y detecta y presta atención sólo al 20% de las palabras. 

Esto sucede por dos razones: 

    1. podemos entrar y salir de las páginas web con un clic rápido y permitirnos actuar impulsivamente: la exploración es rápida y sin riesgos. 

    2. el contenido de la web es ilimitado, mientras que nuestros recursos cognitivos no lo son: no podemos dedicar atención y tiempo a todo, tenemos que seleccionar. 

El término introducido por el científico social Herbert Simon «Satisficing» (satisfy+suffice= conformarse con lo suficiente), describe el comportamiento de quienes eligen la primera opción razonable que encuentran en Internet. 

¿Qué partes de la página se tienen más en cuenta? 

• El Patrón F 

En los estudios sobre el seguimiento del movimiento del ojo, se ha observado que el lector centra su atención en el texto de un sitio dibujando un movimiento en forma de F.

Las diferentes partes de la página se ven de esta manera:

⮞ La parte superior de la página capta más la atención que la inferior. 

⮞ La parte de la página que requiere que deslices la barra de lectura hacia abajo se lee poco o nada en absoluto. 

⮞ El lector pasa 70% del tiempo en el lado izquierdo y el 30% en el lado derecho de la página.

El NNGroup ha publicado estos estudios sobre el seguimiento del movimiento ocular (para culturas que leen de izquierda a derecha): las zonas rojas son las más observadas, mientras que las zonas azules son las menos vistas. Las zonas en gris son las que el lector no toma en cuenta.

En conclusión, esto puede darnos muy buenas indicaciones sobre cómo organizar los elementos del texto que queremos publicar en línea: 

será apropiado colocar lo que queremos que se lea en las zonas «calientes» detectadas por el rastreo ocular. 

• El Patrón Z

Cuando la página web no se centra en un texto escrito (como un artículo) sino que presenta un gráfico con elementos clave (como una página de Inicio), se usa un patrón de lectura en forma de Z. 

¿Cómo deben usarse los ejes de la Z y sus 4 partes?

Tomemos por ejemplo una página web muy popular para observar este patrón en la práctica: Facebook.

PUNTO 1   Aquí es donde inicia el recorrido del ojo, una posición ideal para el logo de la compañía. 

PUNTO 2   Siguiendo la forma de la Z, la atención se moverá hacia la parte superior derecha, donde podemos colocar la segunda «llamada a la acción», el segundo botón importante que queremos que se pulse. 

PUNTO 3   El tercer punto sirve de enlace con la llamada final a la acción. Puede contener información adicional para aumentar el interés de los usuarios. La parte central de la página también suele estar dedicada a una imagen que refuerza el concepto de nuestro producto. 

PUNTO 4   La mirada se posa por último aquí, donde más nos interesa. Aquí tienes que colocar la call to action principal, el botón «comprar», «suscribirse», «iniciar». 

Por lo tanto, si la extensión de texto es mínima y queremos captar la atención de los usuarios con llamadas a la acción, es aconsejable disponer los elementos siguiendo una hipotética letra Z. 

En pocas palabras:

✐ Si tenemos que publicar un contenido escrito, apliquemos el Patrón F 

✐ Si tenemos que publicar contenido con poco texto y elementos clave, utilicemos el Patrón Z

Cómo construir la estructura interna del texto 

Te damos algunos consejos de los estudios de usabilidad web que podemos utilizar a nuestro favor: 

• Layer-Cake Pattern - El patrón de capas de pastel 

Este tipo de esquema se aplica partiendo del supuesto de que el lector online tiende a escanear la página deteniéndose en los títulos y subtítulos, saltándose el texto dentro de los párrafos: como si su atención tuviera la forma de un pastel de capas. 

Así que, para no asustar a quienes descubren nuestro texto, es importante dividir los conceptos en párrafos con títulos, subtítulos y algunas imágenes. 

Un texto único y visualmente amplio da la impresión de estar frente a una pared de la que es difícil extrapolar conceptos e impide que el lector lo analice de un vistazo para poder orientarse antes de recorrerlo.

• Spotted Pattern - El patrón moteado

Esta técnica sirve para facilitar la lectura de un texto y para enfatizar los conceptos más importantes. 

El ojo va en busca de los elementos resaltados, enfocándose en puntos y palabras individuales, siguiendo un patrón «moteado». 

Por lo tanto, para facilitar la lectura y dar movimiento al texto es fundamental insertar palabras en negrita, cursivas, subrayados, enlaces y palabras de diferentes colores.

• Alineación de los títulos y uso de espacios en blanco 

No es necesario incluir o justificar los títulos y subtítulos (como en los libros) porque, al utilizar los subtítulos en los párrafos, delimitarán los conceptos.

Además, manteniendo el texto en el lado izquierdo, respetamos el «Patrón F». También es importante cambiar de línea al final de una frase con un concepto acabado. De esta manera, conseguiremos un texto más aireado con espacios en blanco. 

¡Intentemos aplicar estas reglas básicas para aumentar la legibilidad y las interacciones con nuestro contenido! 

En el próximo artículo veremos qué técnicas de escritura aplicar al texto.

(1) Jakob Nielsen, informático, empresario, escritor y consultor. Autor que introdujo los principios de usabilidad web 

Bibliografía: Daniele Fortis «Scrivere per il Web» Maggioli Editore ; de la página web https://uxplanet.org los artículos «Z-Shaped Pattern For Reading Web Content» y «F-Shaped Pattern for Reading Content» de Nick Babich ; de la página web https://qabiria.com el artículo «Tutto d’un fiato: cos’è la leggibilità e perché è importante per il tuo sito» ; de la página web www.nngroup.com las imágenes sobre los estudios y algunas reflexiones