Nuevos criterios de Google: Core Web Vitals
Publicado: 2020-12-01Actualizado mayo 2021
En el marketing SEO, las empresas, los blogs, los sitios web y las plataformas en línea compiten a diario. La parte superior de la lista de Google es donde quieren estar.
De los innumerables listados en Google, el 90% de los sitios listados nunca llegan a la página principal. El 10% que lo hace son los anuncios pagados, los gráficos de conocimiento y aproximadamente diez listados orgánicos. El tráfico entre ellos es desigual. Menos del 3% de los usuarios de la web llegan a los resultados en las páginas de seguimiento.
Hasta este momento, los principales mecanismos de marketing de SEO que han influido han sido los encabezados, el contenido, las etiquetas de título, las palabras clave, las descripciones de imágenes, los enlaces internos, los vínculos de retroceso, etc. Con un enfoque en el control de calidad, el motor gigantesco, Google tendrá en cuenta un nuevo requisito.
Core Web Vitals se convertirá en un componente determinante de las agencias técnicas de SEO en los Estados Unidos . También se puede esperar y es propenso a redefinir los resultados de búsqueda. Si bien el marketing SEO tradicional esencialmente adopta la relevancia, la distancia y la prominencia, Core Web Vitals afianzará el valor.
Tabla de contenido
- ¿Qué son los principales web vitals?
- Los tres elementos de Core Web Vitals
- Pintura con contenido más grande
- Retraso de la primera entrada
- Cambio de diseño acumulativo
- Métricas fundamentales de la web principal
- Herramientas principales de análisis de Web Vitals
- ¿Por qué es importante la optimización de Core Web Vitals?
- Conclusión
¿Qué son los principales web vitals?
Core Web Vitals es un conjunto separado de métricas que determinan la experiencia del usuario (UX) en los sitios web. Este último incorpora tres medidas diferentes de velocidad de página e interacción con el nodo cliente. La acumulación de estos factores aparecerá en un sistema de puntuación que determina la prioridad que recibe una página como listado.
Los tres elementos de Core Web Vitals
Pintura con contenido más grande
La pintura con contenido más grande (LCP) es una medida creada por Google para garantizar la satisfacción del usuario. Este parámetro se centra más en el rendimiento que en la presentación. Si la página tarda demasiado en cargarse y el internauta se va, esto se considera insatisfactorio.
El tiempo de carga de la página web y los factores de experiencia de Google, como etiquetas de imágenes y miniaturas de videos, determinan la calificación LCP. Las imágenes de fondo con CSS y elementos de texto como párrafos, encabezados y listas también se controlan para comprobar su fluidez.
Causas de LCP deficiente
Tiempos de respuesta lentos del servidor
La velocidad de renderizado de un sitio web depende del tiempo de reacción de un servidor. Cuanto más lento sea el servidor, más tardará algo en mostrarse en la pantalla de un dispositivo.
La solución principal aquí es optimizar su servidor. El almacenamiento en caché de activos y el servicio de caché de HTML primero agiliza los procesos de servicio. Además, es recomendable enrutar a los usuarios a un CDN cercano. Al establecer conexiones de terceros temprano, la latencia se vuelve mínima, lo cual es importante para los sitios web con capacidad de respuesta móvil.
Bloqueo de procesamiento de CSS y JavaScript.
Los navegadores entregan contenido al analizar las marcas HTML en un árbol DOM. Si el analizador encuentra alguna hoja de estilo externa, se detiene. Los scripts y las hojas de estilo externas retrasan la distribución de recursos de bloqueo, FCP y, en última instancia, LCP.
CSS y Java son robustos y pueden perder “mucho peso” a través de la deferencia, la minimización y la minificación. El software disponible para la compactación de Java incluye UglifyJS2, Closure Compiler y YUI Compressor. CSSnano, UNCSS y CSSO son todos mecanismos capaces de comprimir CSS. El tiempo de optimización de la carga mejorará con el despliegue de estas herramientas.
Pobres tiempos de carga de recursos
Si bien el aumento de la actividad de CSS y JavaScript produce malos resultados, otros componentes resultan igual de problemáticos. Los elementos que afectan negativamente a LCP son <imagen>, <img> y <video> y componentes a nivel de bloque que contienen nodos de texto.
La optimización y compresión de archivos de imagen y texto ayudará aquí. Al precargar los recursos necesarios y almacenar en caché los activos, mientras se utiliza un trabajador de servicio diferente, se reduce el tiempo necesario.
Representación final del usuario
Los sitios que realizan la mayor parte de su representación en el extremo del cliente pierden una buena cantidad de control. La desventaja de esta opción se hace evidente con el uso de grandes paquetes de JavaScript. En la mayoría de los casos, el contenido no se muestra hasta que JavaScript completa su representación; pondrá en peligro las calificaciones LCP.
La minimización de JavaScript es crucial, y la representación del extremo del servidor es preferible al extremo del usuario. Otra solución es el renderizado previo que ayudará con el tiempo de optimización de la carga.
Retraso de la primera entrada
First Input Delay (FID) mide el tiempo desde la interacción inicial del usuario hasta que el navegador responde. Es un factor crucial en si el cliente abandonará el sitio o no. Los retrasos generalmente ocurren cuando el hilo principal de un navegador está ocupado.
Los archivos JavaScript cargados por aplicaciones locales suelen ser los culpables de los problemas de FID. Lo que sucede es que los navegadores intentan analizar y ejecutar, pero se produce latencia, lo que provoca que los dispositivos finales no respondan. Una calificación FID baja puede determinar que el sitio o la página en cuestión no se puede utilizar.
Causas de FID deficiente
JavaScript
Generalmente, mientras el hilo principal está ocupado, el navegador no puede responder a las interacciones. La ejecución pesada de JavaScript agrava este problema al imponer retrasos en la velocidad de carga.
Al dividir las tareas largas, puede aliviar el trabajo atrasado. Además, limitar el tiempo de ejecución de JavaScript debería mejorar la capacidad de respuesta. El uso de un trabajador web también es útil. Todas estas son formas de optimizar las métricas del sitio web para la interacción.
Cambio de diseño acumulativo
La métrica Cumulative Layout Shift (CLS) mide la estabilidad del diseño de una página web. Funciona para garantizar que las interacciones con los clientes fluyan de la forma más natural posible. Los navegantes web a menudo experimentan interrupciones o saltos mientras visualizan el contenido de un sitio. Por lo tanto, conduce a una ruptura de la concentración y crea una mala experiencia.
El inconveniente es el resultado de un diseño débil. Los efectos prevalecen en los sitios web con capacidad de respuesta móvil y en los navegadores de escritorio.
La falta de elementos de diseño correctos provoca inestabilidad visual. Este último tiende a forzar cambios repentinos de diseño, lo que muchas veces hace que el usuario haga clic en contenido no deseado sin darse cuenta. Los ejemplos típicos son los sitios con anuncios emergentes.
Los nuevos diseños, aunque estén correctamente estructurados, también pueden ralentizar las páginas web. El algoritmo de Google compensa permitiendo una omisión de 500 ms antes de comenzar su proceso de cálculo.
Causas comunes de CLS
Imágenes sin dimensiones
La exclusión de los atributos de tamaño de ancho y alto para video e imágenes dará como resultado una clasificación baja. Mucha gente no reserva espacio para los medios, y esto da como resultado saltos y cambios.
La solución aquí es simple; incluya siempre ancho y alto. La otra opción son los cuadros de relación de aspecto CSS. Son útiles para la reserva de espacio en sitios web. Es especialmente útil en sitios que alojan anuncios.
Anuncios, incrustaciones e iframes sin dimensiones
Los anuncios son grandes contribuyentes al problema. Las redes publicitarias optan por el tamaño dinámico en lugar de la variante estática, que aumenta el tráfico a los sitios web. Desafortunadamente, esto es a expensas de la experiencia de escritorio o móvil.
Ciertos widgets permiten la incrustación de elementos como videos, mapas y contenido de redes sociales en la página web. El problema aquí es que el sitio a menudo no tiene idea del tamaño exacto o la composición de la inserción. Al no reservar espacio, la inestabilidad se hace evidente una vez que se carga la página.
El cálculo previo de las necesidades espaciales necesarias para una incrustación o una reserva en el sitio evita el peligro de CLS. Las herramientas de desarrollo del navegador son útiles para obtener el alto y el ancho del resultado. Después de establecer esto, el iframe se ajustará automáticamente al espacio reservado cada vez que se cargue la página.
Contenido inyectado dinámicamente
Los elementos recién insertados sobre medios antiguos también son los que crean cambios de diseño. Ejemplos típicos de estos son los banners de llamado a la acción. No solo bloquean la interacción, sino que irritan en lugar de convencer.
Una vez más, reserva espacio. Además, los diseñadores de sitios pueden agregar un esqueleto de interfaz de usuario. Este último es un marcador de posición que evitará que el texto migre cuando se cargue la imagen.
Fuentes web que causan FOIT/FOUT
La descarga y la representación de tipos de letra web son fundamentales para un Flash de texto sin estilo (FOUT). En este caso, un nuevo estilo reemplaza la impresión alternativa.
Una consecuencia adicional es Flash of Invisible Text (FOIT) que oculta el tipo de letra hasta que haya un nuevo caso disponible.
La API de carga de fuentes reduce el tiempo necesario para obtener los estilos de letras necesarios, minimizando o erradicando así la aparición de FOUT y FOIT.
Métricas fundamentales de la web principal
Como se señaló, los tres elementos Core Web Vital tienen medidas individuales. Cada uno clasificado de acuerdo con diferentes estándares de tiempo.
- Una buena calificación LCP es inferior a 2,5 s. Google otorgará indulgencia para cualquier cosa menor de 4 años, pero esto aún significa que hay margen de mejora.
- La unidad de medida de FID es milisegundos y si el tiempo entre la entrada del usuario y la reacción de la página web cae por debajo de 100, esto es ideal. Una métrica de 300 ms es aceptable, pero sugiere problemas por venir. Cualquier cosa por encima de 300 ms conduce a la relegación de la lista web.
- La lectura ideal para CLS es cero. Los algoritmos de Google aceptarán 0,1, pero dado que la aceptabilidad máxima es 0,25, crea un margen de flexibilidad demasiado pequeño. Los administradores del sitio web también pueden esforzarse por lograr la perfección completa.
Herramientas principales de análisis de Web Vitals
- Web Vitals For Chrome es como cualquier otra extensión, y es posible que algunos no se sientan cómodos con esta opción debido a problemas de privacidad.
- La información sobre la velocidad de la página es una interfaz simple que le permite alternar entre las opciones de escritorio y móvil. Los resultados de PC y dispositivos inteligentes difieren independientemente del software de análisis que utilice. Lo anterior produce datos de campo de usuarios reales de Google durante 28 días.
- Los diseños de Chrome Dev Tools y Lighthouse les permiten monitorear LCP y CLS. Desafortunadamente, el mismo software no puede medir la FID, pero para eso existe el TBT.
A medida que proliferan Core Web Vitals, es probable que entren en escena más herramientas de monitoreo.
¿Por qué es importante la optimización de Core Web Vitals?
La actualización principal de Google está programada para mayo de 2021. Esto significa que, a partir de ese momento, las señales habituales de SEO no serán suficientes para mantener una clasificación alta en Google.
Es una implementación de un UX estándar que aboga por la calidad. Los sitios actualizados con los nuevos criterios no se verán afectados. Las páginas web que no se han ajustado seguramente sentirán los efectos, a pesar de cuán efectivo sea su SEO. Los listados con Core Web Vitals débiles caerán en la clasificación, dejando espacio para las entidades que cumplen.
Conclusión
Al establecer una nueva regulación en marketing SEO, Google allana el camino para la mejora. El estándar Core Web Vital es el primero, y seguramente lo seguirán muchos más. Estas medidas crean una plataforma para que una nueva era de Internet se fusione con otras tecnologías emergentes impecables. Además, puede utilizar estos consejos para aumentar la velocidad de carga de su sitio web.