Preparo mi WordPress para Core Web Vitals

Por lo que he leído por ahí, parece que WordPress no va a hacer nada especial para adaptarse al nuevo factor que afectará en las próximas semanas al SEO, las Core Web Vitals, así que no queda otra que trabajarlo uno mismo para no perder ni una posición. Esto es lo que acabo de hacer para mejorar la velocidad y el rendimiento de MejorCMS.com de cara a esta actualización del algoritmo de Google…

Los que me sigáis desde hace tiempo sabés que no soy un perfil técnico, soy periodista, y tampoco tengo mucho tiempo ni dinero para dedicarle, así que las mejoras que he hecho y que os explico a continuación son rápidas y no exigen de presupuesto. Pero empecemos por el principio, veamos qué son las Core Web Vitals.

Qué son las Core Web Vitals y por qué es importante

Las Core Web Vitals son importantes porque son el nuevo factor oficial que afectará en el posicionamiento en Google el próximo mayo, fecha en la que se comenzará a considerar en todas las búsquedas. Todas ellas tienen mucho que ver con la velocidad del site y la experiencia de usuario y se espera que tras su puesta en marcha haya un buen baile en el posicionamiento de la mayoría de SERPS (Search Engine Results Page), especialmente si tu web consigue malas puntuaciones. Eso sí, este nuevo factor se convertirá en uno más de los muchos que ya usa Google y no sabemos a ciencia cierta qué peso tendrá. Las Web Core Vitals son tres:

• LCP: Largest Contentful Paint, es la primera magnitud que forma parte de las Core Web Vitals y mide la construcción del contenido más grande de la página. Es un número que mide lo que tarda en cargar tu contenido de más peso. En este sentido intenta medir lo rápido que carga tu página. Considera bueno que tu página cargue su contenido más “pesado” antes de 2,5 segundos.
• FID: First Input Delay está muy relacionado con la interactividad y mide cuándo tu web empieza a ser interactiva para el usuario. En este caso, para obtener una buena nota, debe estar por debajo de 100 ms.
• CLS: Cumulative Layout Shift, la última magnitud que forma parte de las Core Web Vitals, mide lo que tarda en estabilizarse el diseño. Debemos intentar conseguir una nota por debajo de 0,1.

No me voy a explayar más puesto que internet está lleno de artículos que explican en profundidad el tema.

Cómo mido mis Core Web Vitals

Es muy fácil. Se puede hacer con el inspector de Chorme, pero lo más fácil es acudir a Page Speed Insights y buscar la url de tu web. Tras el análisis, se te presentará una puntuación de tu web tanto en escritorio como en móviles. Personalmente uso mucho GTMetrix, que también utiliza Lighthouse de Google.

Cómo subir la velocidad y el rendimiento de mi WordPress

En primer lugar, vamos a repasar cosas que ya tenía implementadas en mi backend de WordPress para mejorar la velocidad del site. Por un lado, aunque esto ya lo hace ahora de serie WordPress, tengo instalado un plugin para carga diferida de imágenes (lazy load).

También cuento con un plugin que se ocupa de optimizar el peso de las imágenes automáticamente, así como W3 total caché, el cual tengo en su versión gratuita correctamente optimizado.

Por supuesto, cuento como punto de partida tamibén con un WordPress perfectamente actualizado junto al tema Twenty Twenty y todos los plugins perfectamente. Tener todo bien actualizado no solo es importante para mejorar la seguridad, también lo es para contar con el mejor rendimiento.

Esta es la base desde la que parto. Lo primero que he hecho es desinstalar un par de cosas que realmente no necesitaba demasiado, como el plugin de encuestas, para hacer el site un poco más ligero. Todo lo que no sea estrictamente necesario y afecte al rendimiento se ha ido fuera.

Por otro lado, por fin me he decidido a implementar la versión gratuita de Cloudflare en esta publicación y he de decir la instalación ha sido sencilla (tan solo cambiar los DNS del dominio), su configuración igualmente simple y el resultado final, muy bueno. El aumento de la velocidad es considerable.

También he instalado Google Tag Manager y he pasado ahí unos pocos códigos que tenía insertados en el site, como Google Analytics (GA) y Microsoft Clarity. Sé que no es la mejor forma de insertar el código de GA, pero vamos a pensar en el rendimiento.

Por último, el añadido Twentig al tema Twenty Twenty me permite cargar el script de Contact Form 7 en una sola página en vez de en todas, así que lo he utilizado para hacer el site más ligero.

Solo me faltaría subir un poco el rendimiento del servidor, quizás lo haga en los próximos días. Y eso es todo. El resultado final es bueno para escritorio…

… aunque no lo es tanto para móviles

Seguro que se pueden hacer muchas más cosas, tal y como indican los sistema de medición que hemos utilizado, podéis comentar debajo. ¡Gracias!

---

[Actualización del 23 de marzo de 2021] Siguendo un consejo recibido por Linkedin, retiro el módulo de Carrusel con el que comenzaba la portada y lo sustituyo con un módulo de fondo genérico de Gutenberg, el editor de bloques de WordPress. Gracias a este nuevo ajuste, hay varios parámetros que han mejorado, como podéis ver:

Ya la experiencia en Page Speed Insights mejora hasta una puntuación de 95 en desktop y 44 en móviles.

Se confirma así la importancia de que los primeros elementos de tu página sean livianos para mejorar la puntuación. Aún no he conseguido bajar el CLS del todo y eso, según Google, significa que no he conseguido mi objetivo, ya que para beneficiarse del todo el cambio de algoritmo hay que cumplir con todas las Core Web Vitals. En cualquier caso, contento de haber elevado tanto la velocidad de mi WordPress sin haber tocado una línea de código.

Artículos relacionados:

• 
  Por esto se debe usar chatGPT con mucho cuidado
• 
  WordPress sigue reinando, pero ya no crece como antes
• 
  Opinión impopular: ¿Es este uno de los mayores errores de WordPress?