Nueve detalles de usabilidad para redactar entradas de blog

Los blogs, tanto los personales como los corporativos, siguen de moda. A la hornada de blogs que comenzaron su andadura antes del auge de las –mal llamadas– redes sociales, ahora se unen personas y empresas que llegan a los blogs tras llevar años usando Facebook y otras plataformas. A las finales, en estas plataformas uno no deja de ser un inquilino a la merced de un casero lejano que no conoce bien. Son plataformas de terceros. Ni míos ni tuyos. La madurez en la web, tanto para personas como para empresas, viene de la mano del dominio propio y del desarrollo de la identidad personal y corporativa en propiedades de uno mismo. La siguiente gráfica Venn de Avinash Kaushik explica el peso que deberían ocupar los sitios propios frente a los ajenos en la estrategia de comunicación y la de desarrollo de comunidad de las empresas.

Equilibrio entre sitio propio y de terceros

Una de las diferencias entre publicar en Facebook y publicar en un blog propio es que en el primer caso las cosas vienen mucho más precocinadas que en el segundo. Un ejemplo: en las plataformas de terceros uno puede subir cualquier tipo y tamaño de imagen, la plataforma se ocupa de recortar y redimensionarla para que quede perfecta. Esto no pasa en nuestro blog donde por lo general necesitamos preparar las imágenes antes de subirlas. De la mano de más libertad y control, viene más responsabilidad. ¡Como en la vida real!

A continuación comentaré nueve detalles a los que interesa prestar especial atención si venimos al mundo blogger desde Facebook u otras plataformas de terceros. Requieren algo de esfuerzo adicional pero hay recompensa: convierten nuestro blog en un blog mucho más usable y por tanto querido y adorado por los usuarios.

Texto

Los primeros tres están relacionados con cómo tratar el texto en los posts.

1. Usar texto

A veces se quiere reusar en el blog contenido preparado no específicamente para el blog. Por ejemplo, un artículo de prensa que menciona la empresa y del que tenemos una versión escaneada, un folleto que preparamos para imprimir y colgar en la tienda o un montaje de cabecera de Facebook con nuestras últimas ofertas. Bien, estos formatos no funcionan bien en un blog y es mejor evitar subirlos como contenido de posts tal cual, es decir, como imagen. Respecto al artículo de prensa escaneado, hay grandes probabilidades de que lo encontremos en la web y lo podamos enlazar desde un párrafo –que redactemos nosotros mismos– dando contexto. El folleto y el montaje de cabecera de Facebook los podemos tomar como base para diseñar un post para el blog, con su título optimizado, sus encabezados, sus párrafos y sus imágenes.

2. Usar encabezados

Los encabezados estructuran el post y ayudan así al usuario a comprenderlo de forma más fácil. En este post que estás leyendo, el título del mismo es un encabezado de primer nivel –un h1 en lenguaje HTML, viniendo la h de headline–, los encabezados «Texto», «Imágenes» y «Enlaces» son de segundo nivel y el resto de tercer nivel.

¿Cómo se ponen los encabezados? En cualquier editor visual, tendremos algo parecido a la siguiente imagen para marcar las palabras como encabezado.

Poner encabezados en editor visual
En los editores visuales los encabezados a menudo se llaman Título 1, Título 2, etc.

3. Sobre colores, fuentes, tamaños y alineaciones

Los colores, fuentes, tamaños y alineaciones son elementos del diseño global del blog y no deberían editarse a nivel de post salvo razones muy convincentes. El diseñador del blog ya definió estos parámetros cuando diseñó la plantilla. Si los párrafos salen alineados a la izquierda y en color gris 80% es porque el diseñador lo quiso así. Alineando al centro algunos posts, coloreando palabras o poniendo entradas enteras en cursiva –para poner prácticas que veo a veces– empeoramos la experiencia del usuario que navega por nuestras páginas porque estamos rompiendo una de las reglas básicas de usabilidad: la consistencia. Una forma de asegurarnos de mantener la línea gráfica del blog en los posts es desactivar el editor visual. Requiere que aprendamos a poner encabezados en lenguaje HTML pero es un coste muy pequeño a cambio de un blog más usable.

Editor de texto plano en WordPress
El editor en texto plano de WordPress tiene botones para poner negritas, cursivas, enlaces, imágenes y poco más. Y es que ¡no hace falta más!

Imágenes

Cómo tratamos las imágenes de nuestro blog afecta tanto la accesibilidad y la optimización del blog como su usabilidad.

4. Imágenes destacadas

Muchas plantillas de blog requieren que cada post tenga su imagen destacada. Ésta se muestra en carrousels, listados de posts, como primera imagen de post y a menudo sale como imagen por defecto al compartir la entrada en medios sociales. Como imagen destacada es recomendable escoger imágenes limpias e impactantes al primer vistazo, pues su cometido es enganchar a nivel emocional. Por lo general (y siempre hay excepciones), no querremos usar como imagen destacada montajes, imágenes con texto o imágenes demasiado complejas que pidan un esfuerzo racional del usuario. Para eso tenemos el cuerpo el post al que solo llegará si no le asustamos con una imagen destacada sobrecargada.

Imágenes destacadas limpias e impactantes
Imágenes destacadas en GigaOM

5. El tamaño de las imágenes

Las imágenes que pesan mucho ralentizan la carga de la página y esto, a su vez, empeora la experiencia del usuario. Dependiendo de su necesidad, esperará más o menos segundos pero a partir de determinado momento se cansará y cerrará la página sin esperar que se cargue. Como tamaño máximo de imágenes optimizadas para web he leído recomendaciones en torno a 80-100Kb. Me parece una buena referencia con el añadido que la web tiene lectores desde móvil, deberían ser preferiblemente incluso menos. Saber mirar el tamaño de la imagen y saber retocarla hasta reducirla a tamaño optimizado para web es parte de las habilidades requeridas para editar un blog.

6. El nombre del fichero

El nombre del fichero no es algo con el que el usuario se encuentre a menudo pero tiene su importancia para la optimización mediante palabras clave. Poner al fichero nombres para humanos en lugar del nombre que por defecto le pone la cámara sí puede impactar en la usabilidad si el usuario descarga nuestra imagen.

7. Título y título alternativo

Todas las imágenes que subamos a nuestros posts, sean destacadas o intercaladas, deben llevar título y título alternativo. No sólo son, igual que el nombre del fichero, importantes para la optimización por palabras clave sino suponen una ayuda al usuario. Rellenando estos dos campos conseguimos que el título de la imagen aparezca al pararse el cursor sobre la imagen, que el título salga cuando el navegador del usuario no puede cargar imágenes o que el título sea leído por programas que usan personas con deficiencia visual.

Enlaces

Los hiperenlaces son los conectores sin los cuales la web sería un directorio de páginas aisladas las unas de las otras.

8. Ser generosos enlazando

En muchos blogs, los enlaces brillan por su ausencia. Esto priva a los lectores de contexto. Sin contexto es más difícil entender el mensaje que queremos transmitir. Hay buenas razones para ser generosos con los enlaces en marketing de contenidos y la usabilidad solo es una de ellas. Desde aquí animo personalmente a todo blogger a usar enlaces, tanto externos como internos del sitio, de forma abundante en sus entradas.

9. Evitar enlaces tipo «Clic aquí»

El problema de escribir «clic aquí» o «aquí» para poner un enlace es que saca el enlace de su contexto. La palabra o palabras que llevan enlace se llaman el ancla del enlace. Es buena práctica usar anclas contextuales. Si queremos señalar que un PDF es descargable, un ancla genial es un botón o en su defecto un texto que ponga «Descarga el PDF» (en lugar de «Descarga el PDF aquí», con el «aquí» de ancla). Esto es aplicable para todo tipo de enlaces. Busquemos la palabra o las palabras que mejor contexto dan al enlace, enlacémoslas directamente y olvidémonos de los «aquís». Si mis argumentos sobre el «clic aquí» no resultan suficientemente convincentes, recomiendo un post en UXMovement sobre por qué los enlaces nunca deberían decir »clic aquí» que explica también otras cosas, por ejemplo por qué es mejor enlazar sustantivos frente a verbos.

***

Hasta aquí llega mi selección de detalles a los que prestar atención al redactar entradas de blog si queremos que nuestro blog sea y siga siendo usable, o sea, si aspiramos a ser queridos y adorados por los usuarios. Como siempre, agradezco correcciones y sugerencias en comentarios.

Escribir para domesticar el caos

Hay un capítulo en el libro de Csikszentmihalyi sobre la creatividad en el ámbito de la escritura. Me gustaron las palabras de la poeta Hilde Domin quien decía que «escribir honestamente es construirse una defensa contra ser programado». Pensé en el libro de Rushkoff y mentalmente añadí la vertiente de «desprogramación» a la reflexión del otro día sobre blog y aprendizaje autodirigido. Y ahora que lo vuelvo a pensar, la desprogramación es la otra cara del empoderamiento.

Otra cosa que me enseñó este capítulo es el estrecho vínculo entre empoderamiento y la habilidad de ordenar las experiencias. La metáfora del poeta usando la forma y el estilo para ordenar su mundo y restaurar su control de los acontecimientos, me parece potentísima para pensar la organización de empresas y proyectos. En el fondo, para organizar bien, se necesita una buena dosis de creatividad.

Escribir en la web

La Web y la adaptación de nuestras actividades a ella supone una oportunidad para volver a pensar sobre cómo hacer bien las cosas. Estos días estuve leyendo sobre escritura online y parece que en este ámbito, la Web es una nueva ocasión para recordar la importancia de la buena redacción y la buena edición.

El comportamiento más común

Resulta que lo que más hacemos en la web es cazar información e ignorar detalles. Una vez encontremos lo que buscábamos, algunas veces (!) nos sumergimos más profundamente. El contenido web necesita, por tanto, soportar ambos aspectos del acceso a la información: búsqueda y consumo. Los textos necesitan ser escaneables, pero también necesitan dar las respuestas que buscamos.

La importancia de poder extraer con facilidad la información de una página convierte los siguientes tres elementos en fundamentales al escribir en la web:

  • Lenguaje objetivo (sin lenguaje de publicidad)
  • Textos concisos (bien editados y cortos)
  • Diseño escaneable (que rompe la uniformidad del texto)

El texto frente a otros formatos

Sucede que buscamos texto antes que audio, imágenes o vídeo. En estos últimos formatos es más difícil escanear el contenido y detectar la parte del mensaje que más nos importa. Los textos, en cambio, pueden ser ojeados, escaneados, segmentados, resumidos y reutilizados (traducidos, formateados, enlazados, transmitidos) mucho más fácilmente que el contenido de audio o vídeo. Tener en cuenta esto nos ayuda a conseguir una mejor experiencia de usuario, por ejemplo, poniendo el titular siempre por encima de la foto.

Facilitar la lectura no lineal

Una vez conscientes de que el comportamiento más común es la búsqueda mediante el escaneo de la página, podemos usar técnicas que faciliten la lectura no lineal.

  • Usar la pirámide invertida. Consiste en comenzar el post con la conclusión, seguir con la información de apoyo más importante y terminar dando contexto.
  • Ser directos y eficientes con los títulos. Tratar de ser demasiado estéticos o usar metáforas puede ahuyentar al lector. Éste, a las finales, solo quiere saber si vale la pena leer una historia. En promedio, el titular tiene menos de un segundo de la atención del usuario.
  • Usar la pirámide invertida horizontal: conseguir que las dos primeras palabras o el primer tercio del título y de los párrafos sean portadoras de información. A esta técnica también se le denomina «recargar a mano izquierda» y mejora la escaneabilidad debido al patrón F de lectura. Es el motivo por el que los artículos y las expresiones de enlace (por tanto, de modo que…) no funcionan para iniciar títulos, párrafos, intertítulos o ítems en una enumeración.
  • Evitar la repetición de la información. Técnicas periodísticas como el uso de antetítulo, título y sumario, asumen una lectura lineal que en la web no sucede.
  • Usar la forma más fuerte de los verbos: el presente y el pretérito perfecto. Crea acción, economiza palabras y revela a los actores. «Decidir» en lugar de «tomar una decisión», «usar» en lugar de «hacer uso».
  • Ubicar las palabras fuertes al comienzo y también al final de frases y párrafos. La coma actúa como un reductor de velocidad y el punto como una señal de pare. En el punto, la idea de la frase se completa. La pequeña pausa en el flujo de la lectura magnifica la palabra final. Este efecto es intensificado en el final del párrafo, donde las palabras finales limitan con frecuencia con espacios en blanco. Los ojos de los lectores son atraídos por las palabras próximas a espacios en blanco.

  • Reducir el número de ideas por frase. Minimiza la puntuación y se reduce el tamaño de la frase. Las frases largas obligan al usuario a establecer relaciones complejas entre las ideas de la frase. Es difícil seguir una frase de más de 30 palabras.

  • Alternar frases de diversa longitud. En ocasiones querremos escribir una frase larga. Esta también puede ser clara y poderosa cuando el sujeto y el verbo adquieren significado temprano. «Ramificando a la derecha» conseguimos que la relación de ideas vaya en una sola dirección.
  • Romper la uniformidad del texto con las siguientes herramientas.

    • Intertítulos. Cada intertítulo es una nueva oportunidad para atraer atención «recargando a mano izquierda».
    • Enumeraciones con 7 más o menos 2 ítems. Es preferible no usar números para identificar los ítems, salvo que tenga importancia el orden.
    • Negrita, un elemento de color que sirve muy bien para diferenciar preguntas en una entrevista, primeras palabras dentro de una enumeración así como palabras sueltas o frases completas dentro de un texto.
    • Enlaces. Son un elemento que destaca por color.
    • Dígitos. Usar dígitos para los números atrae la atención porque representa hechos. Los dígitos rompen la uniformidad del texto, incluso sin estar en negrita.
    • Párrafos cortos. Los posts con párrafos cortos reciben más atención que las de párrafos largos.

    Optimización para buscadores

    Podemos tener en cuenta técnicas como favorecer el uso de variaciones semánticas frente a la densidad de palabras clave. Pero es mucho más importante hacer bien el ejercicio de jerarquización para la construcción de la pirámide invertida. Éste nos ayudará a definir las palabras clave que usaremos para categorías e etiquetas. Es el buen uso de las etiquetas lo que mejor nos posicionará.

    Los buscadores están continuamente mejorando sus algoritmos para aumentar la relevancia de los resultados de las búsquedas. Escribir para la gente en lugar de hacerlo para los motores de búsqueda es, por eso, la mejor estrategia a largo plazo para asegurar un buen posicionamiento en ellos.