Cada sitio web consta de docenas o cientos de elementos. Entre ellos encontrarás texto, imágenes, botones, widgets y mucho más. Cada elemento difiere en tamaño, y los elementos más grandes dicen mucho sobre qué tan bien optimizado está su sitio usando una métrica llamada Pintura de contenido más grande (LCP).
En este artículo, explicaremos el concepto de LCP. También le mostraremos cómo medir este punto de datos e interpretar los resultados. Finalmente, discutiremos cómo optimizar su puntaje LCP. ¡Vamos a trabajar!
Suscríbete a nuestro canal de YouTube
¿Cuál es el contenido de tinta más alto (LCP)?
Hay un elemento en la mayoría de los sitios web que se destaca del resto por su tamaño y visibilidad. Por ejemplo, considere una página de destino donde la sección principal domina el área visible:
Esta sección principal representa la mayor cantidad de contenido (LCP) para esa página en particular. Esto significa que el LCP es el tiempo que tarda el sitio web en mostrar el elemento que contiene la mayor parte del contenido.
Si desea conocer el LCP para esa página, debe medir cuánto tiempo lleva cargar la sección principal. En teoría, si tiene un puntaje LCP bajo, significa que su sitio web está bien optimizado y se carga rápidamente para sus visitantes.
Es importante comprender que su puntaje LCP puede (y con suerte lo hará) diferir del tiempo de carga general de su sitio. Es posible que tenga una página que tarde tres segundos en cargarse por completo, pero su LCP solo puede tardar 2 segundos. Esto se debe a que la mayoría de los sitios web modernos también cargan scripts en archivos de texto y multimedia.
Por lo general, LCP va de la mano con First Contentful Paint (FCP). Es un indicador que te dice cuanto tarda el primer elemento de z todo el mundo contenido para representar cuando alguien acceda a su sitio. Una vez vinculados, estos datos (o Google Indicadores básicos de internet) proporcionan una visión mucho mejor del rendimiento del sitio que el tiempo de carga general.
Recuerda que Google no tiene en cuenta a la hora de medir el LCP de tu sitio todos. Ignorará elementos como archivos y videos de gráficos vectoriales escalables (SVG), pero estos pueden incluirse en futuras actualizaciones de las métricas web clave de Google.
Cómo medir LCP
Por lo general, es bastante fácil determinar cuál es la mayor parte del contenido de su sitio. Solo espere a que la página se cargue por completo y mire a su alrededor. La mayoría de las veces, hay una sección o elemento que se destaca sobre el resto. Esta podría ser la sección principal como mencionamos anteriormente, o el contenido real de la publicación del blog.
Por lo general, será un bloque de imagen o texto (p. ej., la sección principal anterior o el contenido del blog en general). El LCP también varía de un usuario a otro, ya que se basa en el área visible (o contenido dentro de la parte visible de la página).
El verdadero truco para LCP es medir el tiempo de carga de un elemento dado. (No la página en sí). Afortunadamente, si alguna vez ha utilizado una herramienta o un servicio que le permite medir los tiempos de carga, probablemente también incluya datos detallados como puntajes de FCP y LCP.
Considerar Estadísticas de PageSpeed, por ejemplo. Puede ingresar cualquier URL y el servicio ejecutará una prueba de rendimiento completa para esa página. En los resultados, verá la puntuación de rendimiento general. También habrá un desglose de otros indicadores dentro Datos de campo sección – incluyendo LCP:
PageSpeed Insights recopila datos de rendimiento reales de varios usuarios y los utiliza para proporcionar resultados agregados a lo largo del tiempo. Este enfoque es mucho más preciso que usar una sola prueba para determinar el rendimiento de su sitio web.
Además, obtienes un desglose porcentual para cada resultado. En el ejemplo anterior, podemos ver que el 89 % de las páginas se cargan en menos de 1,5 segundos, lo cual es un resultado fantástico. Sin embargo, el 11 % restante de las páginas cargadas quedan fuera de este rango. Esto significa que, para algunos usuarios, la solución LCP lleva mucho más tiempo.
Es importante comprender que incluso si su sitio está bien optimizado, los tiempos de carga estarán difieren en su base de usuarios. Algunos visitantes pueden tener conexiones a Internet lentas o estar demasiado lejos de sus servidores. Estas son solo dos de las muchas razones por las que los tiempos de carga pueden ser más largos en algunos casos. Por lo tanto, es crucial tener un puntaje promedio como referencia.
Si se desplaza hacia abajo en la página de resultados de PageSpeed Insights, verá: Datos del experimento Sección. Aquí Google te da los resultados exactos de la prueba que acaban de ejecutar en tu sitio:
PageSpeed Insights utiliza los datos de este experimento para proporcionar un resultado general que es visible al principio de los resultados. Los datos del experimento no proporcionan una imagen tan completa como la información de campo agregada. Sin embargo, todavía da una idea bastante buena del rendimiento de su sitio web.
Idealmente, el resultado de su LCP debe ser inferior a 2,5 segundos (a diferencia de FCP, que es ideal en 1,8 segundos). Cuanto menor sea este tiempo, mejor. Para obtener los mejores resultados y experiencia, el tiempo total de carga no debe exceder los 3 segundos. Después de este punto, por lo general empiezas a ver un marcado aumento en las tasas de rebote.
Según nuestra experiencia, PageSpeed Insights es la mejor herramienta que puede usar para medir LCP y el tiempo de carga total. Sin embargo, puede acceder a la misma información si configura Search Console para su sitio web, que recomendamos encarecidamente para fines de optimización de motores de búsqueda (SEO).
Si desea mirar más allá de Google, también puede medir manualmente los tiempos de LCP utilizando las herramientas de desarrollo de su navegador. La mayoría de los kits de herramientas de desarrollo miden el tiempo de carga de la página y ofrecen información detallada sobre cuánto tiempo lleva cargar cada elemento y procesar cada solicitud. Sin embargo, este enfoque manual incluye: gráfico más trabajo que usar un servicio de terceros.
También puede utilizar servicios como Metrix GT y Prueba de velocidad de Pingdom para obtener información adicional sobre LCP y otros datos de carga de página.
Cómo optimizar su puntaje LCP
Si puede identificar el elemento más grande en su sitio web, debería poder optimizarlo. Por ejemplo, si este elemento es una imagen, siempre puede usar una utilidad de compresión para reducir el tamaño del archivo y mejorar el resultado de LCP.
Sin embargo, este enfoque solo funciona si su sitio web no está bien optimizado. Si ya ha tomado medidas para mejorar el rendimiento de su sitio web, debe considerar diferentes enfoques para optimizar los resultados de LCP.
Según nuestra experiencia, estas son las optimizaciones más eficaces que puede realizar para mejorar el rendimiento de LCP de su sitio web:
- Redimensionar y comprimir imágenes. En la mayoría de los casos, las imágenes determinarán sus puntajes LCP. Básicamente, debe cambiar el tamaño y optimizar cada imagen que cargue en su sitio web. WordPress 5.8 ahora proporciona automáticamente a los usuarios imágenes WebP, lo que puede ayudar a reducir el tiempo de LCP de varios sitios.
- Elija un mejor servicio de alojamiento. Si ha trabajado duro para optimizar su sitio y todavía tarda demasiado en cargarse, probablemente se deba a su proveedor de alojamiento web. Es posible que esté utilizando un plan que no se mantiene al día con la popularidad de su sitio, o que su proveedor de alojamiento web no ofrezca el rendimiento que necesita. Independientemente del trabajo que ponga en su sitio web, un plan de alojamiento sólido puede hacerlo bien o mal.
- Utilice una red de entrega de contenido (CDN). Las CDN pueden almacenar en caché copias de su sitio web en clústeres de servidores de todo el mundo y ponerlas a disposición de los visitantes. Algunas CDN también ofrecen servicios de imágenes, que pueden reducir significativamente las puntuaciones de LCP.
- Elimine los recursos que bloquean el renderizado. Un recurso bloquea la representación si impide que los elementos de su sitio se carguen hasta que estén completos. Generalmente, estas son estructuras críticas para su sitio web, como HTML, CSS y JavaScript. Básicamente, desea eliminar o diferir los elementos que hacen esto, o hacer que se ejecuten después de que todo lo demás haya terminado de cargarse. Muchos complementos como WP Rocket (o el propio Divi Theme) pueden hacer esto con una palanca.
En general, todos estos métodos de optimización son recomendaciones estándar si está trabajando de alguna manera para mejorar el rendimiento de su sitio web. Si se toma el tiempo para optimizar su sitio web, sus puntajes LCP deberían disminuir en consecuencia y sus visitantes estarán más contentos con él.
si usted es Usuario de divisiónmuchas de estas cosas se hacen automáticamente. Por ejemplo, la función Critical CSS de un tema Divi elimina automáticamente los recursos que bloquean el renderizado y retrasa su carga. ¡Esta es una de las muchas razones por las que Divi es tan rápido y obtiene excelentes resultados de LCP desde el primer momento!
Preguntas frecuentes sobre el contenido máximo de pintura (LCP)
Comprender un concepto como LCP es menos intuitivo que comprender el tiempo total de carga de una sola página. Con eso en mente, estas son algunas de las preguntas más frecuentes sobre los puntajes LCP.
¿Cómo encaja LCP con el rendimiento general de mi sitio?
Al medir el rendimiento del sitio web, un solo tiempo de carga general no le da una idea precisa de qué tan bien optimizadas están sus páginas. Centrarse en métricas específicas como LCP le brinda una mejor perspectiva de las respuestas del servidor. También le indica cuánto tardan los usuarios en ver su sitio completo. La orientación de LCP u otras métricas solo mejorará el rendimiento general de su sitio web, ya que son parte de un todo más grande.
¿LCP es un tiempo de carga de la página?
Los propietarios de sitios web a menudo prueban sus páginas y ven cuánto tarda en cargarse cada página. Algunas herramientas de medición del rendimiento enumeran un solo número y nada más. Sin embargo, las métricas individuales como LCP lo ayudan a comprender mejor lo que realmente sucede cuando un usuario visita su sitio.
Lo más probable es que LCP ocurra antes de que se cargue toda la página. Y algunos elementos pueden llenarse después (imágenes o tamaños de archivo más grandes). Idealmente, su tiempo de LCP será más rápido que el tiempo total de carga de la página.
¿Cuáles son los otros aspectos clave de Internet además de LCP?
los Indicadores básicos de internet son métricas que Google tiene en cuenta al intentar determinar si un sitio web ofrece una buena experiencia de usuario (UX). LCP es solo uno de estos elementos esenciales. Otros incluyen First Input Delay (FID) y Cumulative System Shift (CLS). También puede consultar First Contentful Paint (FCP), que está más relacionado con la percepción del usuario de la velocidad de carga de la página.
Solicitud
Al juzgar el rendimiento de su sitio, es mejor no centrarse en un solo valor, como el tiempo de carga de la página de inicio. Si bien son importantes, las métricas individuales como LCP pueden ayudar a identificar elementos y áreas específicas que pueden necesitar mejoras.
La representación más grande del contenido en cada página le da una idea de cuánto tiempo tienen que esperar los usuarios para que la página se cargue lo suficiente como para que entiendan. En el caso de FCP, este es el tiempo que se tarda en mostrar la página. Incluso entonces, es posible que tengan que esperar más tiempo para que se vuelva interactivo, lo que puede seguir al LCP. Esta métrica es una sola pieza del rompecabezas. Sin embargo, al optimizar este resultado, puede ofrecer una experiencia de usuario mucho mejor en su sitio web.
¿Tiene preguntas sobre cómo medir o mejorar el rendimiento de LCP en su sitio? ¡Hablemos de ellos en la sección de comentarios a continuación!
Foto destacada a través de NeMaria / shutterstock.com
