El próximo 12 de marzo entra en juego una nueva métrica de evaluación web esencial por parte de Google, INP (Interactión to Next Paint). Si bien está métrica no es del todo una novedad, ya que se había añadido en 2022 de manera experimental, a partir del próximo marzo va a desplazar a FID (First Input Delay) como métrica de referencia en Core Web Vitals.

Para quien no conozca los Core Web Vitals, son un conjunto de métricas que evalúan la experiencia de los usuarios en las páginas web, que analizan desde el rendimiento o velocidad de carga de la página, la capacidad de respuesta o interactividad de la página y a la estabilidad visual de la página cuando un usuario accede a la web.

¿Por qué son importantes los Core Web Vitals?

Google lleva muchos años intentando mejorar la experiencia de los usuarios en la web. Atrás quedaron las versiones mobile de las webs. Ya en 2016 anunciaba la indexación centrada en móviles (Mobile-first Indexing) y en febrero de 2022 comunicaba que iba a empezar a tener en cuenta la experiencia y rendimiento de las páginas como factor de posicionamiento.

Todo este interés en mejorar la interacción de las webs y los tiempos de carga, no responden a un espíritu altruista, sino más bien a una necesidad de ahorro de costes principalmente. En un entorno en constante crecimiento, con miles de sitios webs creados a diario y cientos de miles de contenidos en distintos formatos subidos a la red, necesita consumir una gran cantidad de recursos solo para rastrear, analizar e indexar toda la información. Aunque Google no ofrece datos estadísticos, se estima que recibe cerca de 99.000 peticiones de búsquedas por segundo en su buscador.

Esta alta demanda de peticiones y de necesidad, por tanto, de rastrear continuamente la red para intentar ofrecer el mejor y actual resultado posible, hace indispensable que las webs ofrezcan una respuesta rápida y carguen lo antes posible. En definitiva, si le ahorramos tiempo de procesamiento, le ahorramos costes a Google y nos premia con una mejor valoración por parte del algoritmo, que puede derivar en un mejor posicionamiento y visibilidad orgánica de la web. Ahí es dónde entramos los SEOs como “gestores de costes de Google”, intentando optimizar el rendimiento de la web, la interactividad y la estabilidad de la página para conseguir un mejor posicionamiento. Pero también porque creemos que realmente una buena experiencia del usuario es fundamental para alcanzar los objetivos que nos marquemos.

¿Qué es FID y qué es INP?

FID (First Input Delay) traducido sería algo así como el retraso que hay hasta la primera interacción del usuario con la página. Esta métrica mide el tiempo que transcurre entre la primera interacción del usuario con la página (scroll, clic, pulsación, etc.) y el momento en el que el navegador puede responder a esa interacción. Si transcurre mucho tiempo entre ambos genera una mala experiencia ya que da la sensación de ser una web lenta.

INP (Interaction to Next Paint), que es la nueva métrica que se lanza este marzo y sustituye a FID, al igual que la anterior mide la capacidad de respuesta de la web ante una interacción de un usuario. Sin embargo, en este caso, evalúa el tiempo de interacción con un elemento de la web, presionar un botón o hacer clic en un enlace y la reacción del navegador ante esa acción.

¿Qué supone entonces el cambio de FID por INP?

Si anteriormente se habían tenido en cuenta el rendimiento y se había trabajado sobre la experiencia del usuario en la página, tenemos una buena base de inicio. Quizás se tengan que hacer algunos ajustes, porque los parámetros que se analizan son distintos.

Si no se ha trabajado anteriormente, va a requerir un esfuerzo importante para poder adaptarse a estos nuevos estándares.

Veremos cómo evoluciona y que grado de afectación tiene el cambio. Es posible que haya que cambiar la conceptualización de qué elementos y eventos cargamos primero en las páginas. Ya que, desde el punto de vista SEO, no sería prioritario que en webs con anuncios, los tipo display fuesen el primer elemento de interacción o los avisos de cookies sobre los que interactuar.

¿Cómo optimizo entonces el Core Web Vital de INP?

Antes de ponernos a minificar, refactorizar, buscar el mejor CDN, analizar los eventos de la página, etc. deberíamos de analizar el punto desde el que partimos y las posibilidades reales que tenemos de optimización. No hay una solución única que nos permita mejorar está métrica ya que no todas las páginas tienen el mismo tipo de interacción. No es lo mismo un sitio con contenido estático de imagen y texto, como puede ser un periódico online, que un editor de código online como una web de juegos online o una red social, que tienen muchas más interacciones.

Debemos tener en cuenta también, que cada tecnología tiene tanto sus ventajas como limitantes. No es lo mismo trabajar sobre un desarrollo ad hoc, que sobre un estándar popular de mercado, que pueden ser más o menos cerrados a hacer cambios sobre su propio core.

De la documentación que ofrece Google se pueden sacar algunos puntos a tener en cuenta para su mejora:

  1. Optimizar la ejecución de JavaScript:

Divide las tareas largas en subtareas: si una tarea de JavaScript tarda más de 50 minutos, se podría dividir en fragmentos más pequeños para evitar bloquear el hilo principal y retrasar las respuestas.

Utiliza Web Workers: ejecutar scripts en segundo plano separándolo de la ejecución del hilo principal para que así mejore la respuesta.

Reduce el impacto de JavaScript: optimiza, minimiza y aplaza el JavaScript no crítico para reducir su impacto en la carga inicial de la página y el tiempo de interacción.

  1. Optimizar el renderizado:

Evita el «Layout Thrashing»: evita el JavaScript que modifica con frecuencia los elementos del DOM de forma que obligue al navegador a recalcular los diseños. Esto puede afectar gravemente al INP.

Optimiza el CSS: minimiza los selectores y animaciones CSS complejos ya que pueden ser intensivos en cuanto a renderizado.

Carga y renderiza las fuentes de forma eficiente: utiliza estrategias para priorizar la carga y la visualización de las fuentes críticas de forma eficiente.

  1. Optimizar el Input Delay:

Event Listeners: Deben de responder de manera rápida y eficiente cuando un usuario interactúa.

Prioriza la interacción: asegúrate de que el navegador procesa la interacción del usuario antes que otras tareas.

 

Todo este proceso de optimización de rendimiento puede tener más o menos sentido, por el esfuerzo que puede llegar a suponer, dependiendo del contexto particular de cada site, sector y competencia. Lo que es innegable, es que se debe intentar siempre dar la mejor experiencia posible al usuario, si queremos tener una buena apreciación por parte del algoritmo y del usuario.