Con la llegada del próximo cambio de algoritmo de Google se comenzará a tener en cuenta los Core Web Vitals como factor de posicionamiento, o lo que es lo mismo, que la web cargue muy rápido y con las menores trabas posibles para el usuario. Para ello, esta medición se basa en tres métricas: First Input Delay (FID), Largest Contentful Paint (LCP) y Cumulative Layout Shift (CLS).

Mientras que el CLS está más orientado con el diseño y la maquetación, tanto el FID y LCP están mucho más ligados a todo el contenido en general.

Mientras que el First Input Delay (FID) es la métrica que ayuda a cuantificar el tiempo que se necesita para que un usuario pueda interactuar con la página, el Largest Contentful Paint (LCP) mide el tiempo de renderizado de la imagen o el bloque de texto más grande visible. Es decir, lo que tarda en cargar el elemento más pesado, incluyendo las antiguas métricas load o DOMContentLoaded –los DOM están directamente relacionados con el tamaño de la página y los elementos que contiene (cantidad de texto, imágenes, los JS…).

Qué relación tiene esto con el contenido: todo. Para hacernos una idea, tanto la longitud como la maquetación juegan un papel muy importante tanto en términos de experiencia de usuario y velocidad de carga. Ambos, puntos dramáticos en la versión móvil.

Cómo hemos realizado las pruebas

En un texto de unas 8.000 palabras, hay 5.000 recogidas en un apartado con 5 pestañas diferentes. Solo se muestra una de ellas. Este supuesto lo hemos comparado con el mismo artículo, pero incluyendo este contenido dividido en “tabs” dentro de un acordeón cerrado por defecto. En ambas ocasiones se ha vaciado la caché y minimizado el código; no se han realizado procesos paralelos y se ha dispuesto una conexión por cable a una fibra óptica de 300 megas. Las pruebas en PageSpeed Insights en escritorio superaron el 94% en ambos casos.

El contenido incluye vídeos externos, imágenes con carga recargada y plugins como awwp sin carga asíncrona. El CMS elegido ha sido WordPress y la plantilla TablePress, optimizada para que el resto de contenidos tengan una valoración media de 88 en móvil y de 97 en escritorio con textos entre las 2.500 y 3.300 palabras –en algunos casos con o sin imagen principal, que afecta dramáticamente al resultado-.

Entonces, ¿es malo utilizar acordeones para distribuir el texto?

Depende. Como vemos en la comparativa (a la derecha se muestran las métricas del contenido dispuesto en el acordeón), apenas hay un cambio significativo, siendo ligeramente peor en los parámetros no Core Vitals, mejorando el tamaño excesivo de DOM y marcando un peor resultado en  cargas útiles de red de gran tamaño aun siendo los mismos elementos (vídeos embebidos de Amazon –cuya optimización está muy lejos de la de YouTube-).

El problema de este caso de estudio ha resultado ser un contenido demasiado extenso, que genera DOM de tamaño excesivo. También es cierto que el diseño incrementa el tamaño del HTML y del CSS, además del js. Asociado a ciertas funcionalidades.

Respecto a la usabilidad de usuario, la mejora es palpable, permitiendo un contenido más limpio y ordenado.

Ahora bien, ocultar un contenido en un acordeón presenta otra consideración aparte: si en un inicio se muestra contraído y tenemos un enlace ancla dentro del mismo texto o un apartado destacado en las SERP, en ninguno de los dos casos se mostrará al usuario el texto exacto.

Conclusiones y soluciones

Crear contenidos muy amplios no siempre es la mejor manera para posicionarse bien en las SERP. Aunque la nueva funcionalidad de Google, que también afectará al posicionamiento al tener en cuenta para las búsquedas los fragmentos de texto, va a jugar un papel importante, una buena arquitectura web es mucho más eficiente para el usuario y para el SEO. Se puede usar más allá de los conjuntos de Preguntas frecuentes.

Incluso es recomendable que si se utilizan para estructurar el contenido, se encuentren desplegadas en versión escritorio y contraídas en móvil, y contar con una tabla de navegación en el contenido e, incluso, si es extenso, facilitar la misma en una columna lateral con una versión concisa y funcional.

Por ejemplo, en las ayudas, Google no dispone una página para toda la categoría de dudas, sino que cada “respuesta” se alberga en una página independiente en una estructura vertical muy parecida a la de los ecommerce, tratando de minimizar el riesgo de canibalización SEO.

Para ello, lo mejor es atacar las intenciones de búsqueda para necesidad específica e ir desglosando dentro de este contenido los que satisfacen otras búsquedas subyacentes y otras longtail. De esta manera, habría que optimizar al máximo las URL y el enlazado interno (haciendo uso de las migas de pan también) para compensar que cada subpágina estará un poco más alejada de la home.

Por ejemplo, tenemos la ulr “xxx.com/moviles”. Tomando móviles como categoría, existen varios tipos (baratos, calidad-precio, marca, mayor batería, mejor cámara, mejores, etc.). Cada una de estas palabras clave debe ir a continuación (p. ej.: /moviles/baratos/).

Y en el caso de combinaciones como mejor móvil Huawei calidad-precio, si el contenido se ha trabajado adecuadamente, sólo se precisa conformar enlazados internos con la palabra clave exacta a la url “xxx.com/moviles/huawei”.

Por supuesto, debes contar con un sitio optimizado a nivel técnico.