Optimiza las imágenes del renderizado del mayor elemento con contenido (LCP) con Jetpack Boost
La optimización de imágenes de LCP identifica y optimiza automáticamente las imágenes más importantes de las páginas principales de tu sitio web Páginas principales. Esta función analiza tus páginas principales, identifica sus imágenes principales (si procede) y aplica optimizaciones técnicas para que se carguen más rápido para tus visitantes.
La optimización de imágenes de LCP está disponible tanto en los planes gratuitos como en los de pago de Jetpack Boost. El plan gratuito permite optimizar una página principal, mientras que el plan Premium admite hasta diez.
¿Qué es el renderizado del mayor elemento con contenido (LCP)?
El renderizado del mayor elemento con contenido (LCP) es una métrica de Core Web Vitals que mide cuánto tarda en cargarse por completo el elemento de contenido visible más grande —como una imagen grande o un titular— en el navegador de un visitante.
Un LCP rápido da la impresión de que tu sitio es rápido y responde con agilidad. Un LCP lento, aunque los demás elementos se carguen rápido, puede hacer que tu sitio parezca lento a los usuarios.
Por qué es importante LCP para tu sitio web
Renderizado del mayor elemento con contenido (LCP) es una métrica de Core Web Vitals que mide cuánto tarda en cargarse el elemento de contenido visible más grande de tu página web.
- Los visitantes juzgan la velocidad de un sitio según lo rápido que aparece el contenido principal, no según cuándo termina de cargarse toda la página.
- Un LCP lento hace que tu sitio parezca lento, aunque los demás elementos se carguen rápido.
- Un LCP rápido hace que tu sitio parezca profesional y responda con agilidad.
Optimización para motores de búsqueda
- Como LCP es una métrica de Core Web Vitals, Google utiliza LCP como factor de posicionamiento en los resultados de búsqueda.
- Los sitios web con buenas puntuaciones de LCP (menos de 2,5 segundos) tienen un posicionamiento superior al de sus competidores más lentos.
- Las puntuaciones bajas de LCP pueden perjudicar tu visibilidad en las búsquedas orgánicas.
¿Qué hace que LCP sea lento?
Entre las causas habituales del bajo rendimiento de LCP se incluyen:
- Imágenes grandes sin optimizar.
- Imágenes sin una priorización de carga adecuada.
- Ausencia de técnicas para imágenes adaptables.
- Tiempos de respuesta del servidor lentos.
- Recursos que bloquean el renderizado.
¿Qué es la optimización de imágenes de LCP?
La optimización de imágenes de LCP es una función de Jetpack Boost que identifica los elementos visuales más importantes de tus páginas clave y aplica mejoras de rendimiento para que se carguen más rápido.
Se centra en la imagen más grande o en la imagen de fondo visible en la ventana del navegador cuando se carga una página —el elemento LCP—. Optimizar este elemento puede mejorar considerablemente tus puntuaciones de Core Web Vitals.
Cómo funciona la optimización de imágenes de LCP
Análisis automático de páginas
La función examina tus Páginas principales para identificar:
- El elemento visual más grande que aparece en la ventana gráfica.
- Si se trata de una imagen estándar o de fondo.
- La estrategia de carga óptima para cada tipo de dispositivo (móvil/ordenador).
Optimizaciones técnicas aplicadas
Para elementos de imagen:
- Optimiza la imagen de LCP mediante el acelerador del sitio de Jetpack.
- Establece
fetchpriority="high"para dar prioridad a la carga. - Aplica
loading="eager"para evitar retrasos por la carga diferida. - Genera imágenes adaptables con los atributos
srcsetysizes. - Incluye compatibilidad con pantallas de alta densidad de píxeles.
Para elementos de imagen de fondo:
- Optimiza la imagen de fondo de LCP mediante el acelerador del sitio de Jetpack.
- Añade enlaces de precarga en la cabecera del documento.
- Implementa imágenes de fondo adaptables mediante CSS
image-set(). - Aplica consultas de medios específicas para cada dispositivo.
- Utiliza reglas alternativas de CSS para garantizar una carga óptima.
Cómo interpretar los estados
Análisis pendiente
Jetpack Boost está analizando tus páginas tanto en dispositivos móviles como en ordenadores. Este proceso suele tardar unos minutos:
- Análisis completado: Jetpack Boost ha identificado los elementos LCP, y las optimizaciones están activas para todas las páginas y tipos de dispositivo analizados correctamente.
- Completado parcialmente: Jetpack Boost ha completado el análisis, pero no ha podido identificar ni optimizar el elemento LCP en una o más páginas o tipos de dispositivo. Esto puede ocurrir en dispositivos móviles o de escritorio de forma independiente. Las optimizaciones seguirán activas allí donde el análisis se haya realizado correctamente.
Consulta las páginas afectadas para obtener más información. Si una página sigue fallando, consulta Solución de problemas de la optimización de imágenes de LCP.
Análisis completado
Se han identificado tus elementos LCP y las optimizaciones ya están activas. Deberías ver mejoras de rendimiento en las herramientas de prueba.
Solución de problemas habituales
Si Jetpack Boost no ha podido optimizar algunas de tus páginas, puede deberse a problemas como la accesibilidad de la página, una carga lenta o la complejidad del diseño.
Aquí encontrarás una lista completa de problemas conocidos y sus soluciones: Solución de problemas de la optimización de imágenes de LCP en Jetpack Boost.
¿Sigues necesitando ayuda?
Por favor contacta con el equipo de soporte. Estaremos encantados de asesorarte.
