Que son los Core Web Vitals
Los Core Web Vitals son tres metricas especificas de experiencia de usuario que Google utiliza como factor de ranking en sus resultados de busqueda desde 2021. Estas metricas se miden con datos reales de usuarios de Chrome y se reportan en Google Search Console. Un sitio con buenos Core Web Vitals (todas las metricas en verde) tiene una ventaja de posicionamiento sobre sitios similares con metricas deficientes.
Mejorar los Core Web Vitals no es solo una cuestion tecnica: mejora directamente la experiencia de los visitantes, reduce el abandono y aumenta las conversiones. En WebHosting MX nuestra infraestructura esta diseñada para facilitar el cumplimiento de estas metricas desde la capa de servidor.
Las tres metricas de Core Web Vitals
| Metrica | Que mide | Meta (verde) | Deficiente (rojo) |
|---|---|---|---|
| LCP (Largest Contentful Paint) | Tiempo hasta que el elemento mas grande es visible | Menos de 2.5 segundos | Mas de 4 segundos |
| INP (Interaction to Next Paint) | Tiempo de respuesta a interacciones del usuario | Menos de 200ms | Mas de 500ms |
| CLS (Cumulative Layout Shift) | Estabilidad visual de la pagina al cargar | Menos de 0.1 | Mas de 0.25 |
Como mejorar cada Core Web Vital
Mejorar el LCP
- El LCP depende principalmente de la velocidad del servidor (TTFB) y del tamaño/formato de la imagen principal. Un hosting con LiteSpeed y NVMe como WebHosting MX puede reducir el TTFB a menos de 50ms con cache activo.
- Convertir la imagen principal a formato WebP y agregar el atributo
fetchpriority="high"para que el navegador la cargue con prioridad. - Precargar los recursos criticos con la etiqueta
<link rel="preload">.
Mejorar el INP
- Reducir el JavaScript que se ejecuta en el hilo principal del navegador.
- Dividir las tareas largas de JavaScript en partes mas pequenas.
- Diferir la carga de scripts de terceros no criticos.
Mejorar el CLS
- Definir siempre las dimensiones (width y height) en todas las imagenes y videos.
- Reservar espacio para los anuncios antes de que carguen.
- Evitar insertar contenido sobre el existente excepto en respuesta a una interaccion del usuario.
