Cómo optimizar las principales constantes web de WordPress (Guía Final)

¿Quieres optimizar las principales constantes web de WordPress?

Core Web Vitals es una iniciativa de Google para ayudar a los propietarios de sitios web a mejorar la experiencia del usuario y la calidad de su sitio web. Estas señales son cruciales para el éxito de cualquier sitio web.

En esta guía, le mostraremos cómo optimizar fácilmente Google Core Web Vitals para WordPress sin conocimientos técnicos especiales.

Aquí hay una breve descripción de lo que veremos en esta guía.

¿Qué son Google Core Web Vitals?

Google Core Web Vitals es un conjunto de indicadores de rendimiento del sitio web que Google cree que son importantes para la experiencia general del usuario de un sitio web. Estos resultados de vitalidad web serán parte de la calificación general de la experiencia de la página de Google, lo que afectará sus clasificaciones de SEO.

La verdad es que a nadie le gustan los sitios web de carga lenta, incluido Google.

Incluso si su sitio web se carga rápidamente, es posible que los usuarios no puedan hacer lo que quieren o acceder a la información que necesitan.

Esto es lo que Web Vitals le ayuda a medir. ¿Qué tan rápido se carga, se muestra y se prepara su sitio web para el usuario?

Para ello, Google utiliza tres pruebas de calidad (Web Vitals).

• Cobertura Máxima (LCP)
• Primera demora de entrada (FID)
• Cambio de diseño acumulativo (CLS)

Ahora, los nombres de estas pruebas pueden sonar demasiado técnicos, pero lo que están haciendo es fácil de entender.

Veamos cómo funciona cada prueba de Web Vitals, qué mide y cómo mejorar su resultado.

Máximo contenido de pintura - LCP

La pintura con contenido más grande, o LCP, detecta qué tan rápido el contenido principal (ya sea una imagen, un artículo o una descripción) es visible para el usuario.

Por ejemplo, su sitio web puede cargarse rápidamente, pero es posible que la mayoría del contenido no aparezca en la pantalla tan rápido como el resto de la página.

Otras herramientas de prueba de velocidad le darán una puntuación alta, pero la página sigue siendo lenta desde el punto de vista del usuario.

Es por eso que Google mide LCP como parte de su Web Vitality Score, para que los propietarios de sitios web puedan tener una imagen más clara.

Primera demora de entrada (FID)

First Input Delay (FID) mide el tiempo que tarda el navegador de un usuario en procesar los controladores de eventos en respuesta a la interacción de un usuario.

En lenguaje sencillo, suponga que el usuario está en su página de formulario de contacto. Rellenan el formulario y hacen clic en el botón enviar. FID medirá qué tan rápido su sitio web maneja esta interacción.

Un ejemplo más simple es el momento desde el cual un usuario hace clic en un enlace a su navegador para comenzar a procesar la siguiente secuencia de eventos.

Cambio de diseño acumulativo (CLS)

El cambio de diseño acumulativo (CLS) mide el tiempo que tarda un sitio web en volverse visualmente estable.

A medida que se carga el sitio web, cargar algunos elementos lleva más tiempo que otros. Durante este tiempo, el contenido de su sitio puede seguir moviéndose por la pantalla.

Por ejemplo, si un usuario lee un párrafo en un dispositivo móvil y se carga un video incrustado encima, todo el contenido se moverá hacia abajo. Puede ser muy frustrante si el usuario intenta completar una acción, como agregar un producto al carrito, pero el botón se mueve hacia abajo debido al movimiento de otros elementos de la página.

videotutorial

Si prefiere instrucciones escritas, siga leyendo.

Cómo probar su Google Core Web Vitals Score

La forma más fácil de probar su puntaje de Google Core Web Vitals es usar Información sobre la velocidad de la página herramienta. Simplemente ingrese la URL que desea probar y haga clic en el botón Analizar.

Los resultados de las principales constantes vitales se muestran debajo de la sección titulada "Datos de campo".

Para simplificar, verá un mensaje en la parte superior que dice "[…] Los datos de campo indican que esta página ha sido calificada por Core Web Vitals".

En el siguiente diagrama, puede ver los resultados reales de los tres signos vitales principales. Este es el resultado necesario para pasar la prueba básica de Web Vitals de cada proyecto.

• Contenido máximo de pintura (LCP) - 2,5 segundos
• Primera demora de entrada (FID): menos de 100 ms
• Desplazamiento de diseño acumulativo (CLS): menos de 0,1

¿Cómo veo Google Core Web Vitals para un sitio completo?

La herramienta Speed ​​​​Insights ahora le permite verificar páginas individuales. También puede hacer clic en la casilla de verificación "Mostrar resumen de fuente" si la página que está revisando es la principal de su nombre de dominio.

Esto le mostrará el resultado de todas las páginas servidas por esta fuente.

Sin embargo, para profundizar más, también puede acceder al informe Core Web Vitals en el panel de Google Search Console.

Esto le permite ver cuántas URL de su sitio han pasado la prueba, qué URL necesitan mejoras y qué páginas han tenido un desempeño deficiente.

Para obtener un informe Web Vitals más detallado, puede usar la Prueba de velocidad de Lighthouse yendo a Herramienta de medición Web.dev, o usando las pruebas integradas en Google Chrome.

Simplemente abra un sitio web en Chrome, haga clic derecho en cualquier parte de la pantalla y seleccione la opción "Verificar". En la sección verás una opción llamada Faro.

Luego haga clic en el botón Generar informe.

notas: Para obtener los resultados más precisos, debe ejecutar la prueba de Chrome en modo de incógnito. De lo contrario, la extensión de su navegador puede afectar negativamente el rendimiento básico de la red que le muestra.

¿Por qué son importantes los Core Web Vitals?

Las métricas web clave son importantes porque reflejan cómo se presenta su sitio web a los usuarios. No solo se enfoca en cargar un sitio web más rápido, sino también en qué tan rápido lo usan los usuarios.

Según un estudio reciente, un retraso de 1 segundo en el tiempo de carga de la página puede generar una pérdida del 7 % en las conversiones, del 11 % en las páginas vistas y del 16 % en la satisfacción del cliente.

Por eso es crucial optimizar su sitio web para obtener velocidad y rendimiento. Sin embargo, la mayoría de las herramientas de medición del rendimiento en realidad no tienen en cuenta la calidad de la experiencia del usuario.

Un sitio web más rápido con una experiencia de usuario deficiente aún puede generar conversiones, menos páginas vistas y una menor satisfacción del cliente. Mejorar los signos vitales web básicos puede ayudarlo a resolver este problema.

La experiencia del usuario también es un factor importante en las clasificaciones de SEO. Google ha anunciado que a partir de mayo de 2021, una actualización del algoritmo de búsqueda incluirá la experiencia de la página como factor de clasificación.

Habiendo dicho eso, veamos cómo puede mejorar fácilmente sus métricas básicas de vida web para brindar una mejor experiencia de usuario para su sitio web.

Cómo aumentar la vitalidad web básica en WordPress (7 consejos)

Mejorar su puntaje principal de Web Vitals en WordPress no es difícil. Con algunos consejos básicos de optimización del rendimiento, puede obtener fácilmente los resultados de Web Vitals.

1. Optimiza tu alojamiento de WordPress

Su empresa de alojamiento de WordPress juega el papel más importante en el funcionamiento de su sitio web.

Pueden optimizar sus servidores de WordPress, dando a su sitio web una plataforma sólida.

Recomendamos SiteGround para sitios web de alto rendimiento. Son una de las empresas de alojamiento de WordPress recomendadas oficialmente y usamos SiteGround para nuestro sitio web de AprenderWP.

Para darle a su sitio web el rendimiento que necesita, SiteGround utiliza Google Cloud Platform con PHP increíblemente rápido para sus servidores.

Suyo optimizador SG Los complementos son utilizados por más de un millón de sitios web. Aumenta automáticamente la productividad e incluye almacenamiento en caché incorporado, hace que WP Rocket esté todo hecho y más.

Es importante tener en cuenta que su complemento SG Optimizer solo está disponible para las cuentas de alojamiento de SiteGround, y estas optimizaciones de rendimiento están disponibles para todos los planes, incluida la opción mínima.

Si utiliza otro proveedor de alojamiento de WordPress, entonces recomendamos usar WP Rocket junto con varias otras herramientas para obtener un mejor resultado de los signos vitales web básicos.

WP Rocket es el mejor complemento de almacenamiento en caché de WordPress del mercado. Le permite configurar fácilmente el almacenamiento en caché en su sitio de WordPress sin tener que entrar en los detalles técnicos de la administración del servidor.

2. Mejore el resultado de visualización máxima de contenido (LCP).

Como se mencionó anteriormente, la pintura de contenido máximo (LCP) es en realidad la mayor parte del contenido en la ventana de vista de página. Por ejemplo, en una publicación de blog, esto podría ser una imagen o texto de un artículo.

Cuanto más rápido se cargue este contenido, mayor será su puntuación LCP.

¿Cómo sabes qué contenido se considera el mejor en una prueba? Bueno, debe desplazarse hacia abajo hasta los resultados de la prueba y expandir la sección "elementos de dibujo de contenido más grande".

Verá los elementos que se tienen en cuenta para el resultado del LCP. Si es una imagen más grande, puede intentar reemplazarla con una imagen más pequeña o una imagen con un tamaño y calidad de archivo más bajos. Consulte nuestra guía sobre cómo optimizar las imágenes para el rendimiento web.

Si es texto, puede intentar dividirlo en párrafos y títulos.

3. Mejorar la puntuación de First Delay Delay (FID).

El retraso para el retraso de la primera entrada mide el tiempo entre el momento en que un usuario hace clic en algo en su sitio web y su navegador comienza a procesar el elemento.

El consejo más importante para mejorar esto es utilizar un mejor alojamiento web o incluso una plataforma de alojamiento de WordPress administrada.

Otra manera fácil de mejorar su puntaje FID es usar un complemento de almacenamiento en caché como WP Rocket. Tiene funciones integradas que le permiten optimizar la entrega de archivos.

Primero, debe instalar y activar WP Rocket. Para obtener más detalles, consulte nuestra guía paso a paso sobre cómo instalar complementos de WordPress.

Luego ve a Ajustes »WP Rocket y vaya a la pestaña Optimización de archivos.

Desplácese hacia abajo hasta la parte inferior de la página y marque la casilla junto a "Lazy Load JavaScript".

Asegúrese de hacer clic en el botón "Guardar cambios" para guardar sus cambios.

JavaScript retrasado permite que su sitio web se cargue sin esperar a que se cargue JavaScript. Esto aumenta el resultado de la primera demora de entrada (FID) en la página donde JavaScript puede ser la causa.

4. Mejorar la puntuación de cambio de diseño acumulativo (CLS).

El resultado del cambio de diseño acumulativo (CLS) sufre cuando varios elementos de una página web se cargan lentamente y mueven otros elementos en la pantalla.

Puede ver qué elementos afectan la puntuación de CLS expandiendo la sección Evitar cambios importantes de diseño en los resultados de Speed ​​Insights.

Esto le mostrará los elementos que tienen el mayor impacto en el cambio de diseño a medida que se carga la página.

Para asegurarse de que el diseño visual de la página no cambie al cargar otros elementos, debe indicarle al navegador las dimensiones (ancho y alto) de elementos como imágenes, videos incrustados, anuncios como Google AdSense, etc.

WordPress agrega automáticamente atributos de alto y ancho a las imágenes que agrega. Sin embargo, puede verificar todos los demás medios, especialmente los integrados, para asegurarse de que todos tengan propiedades de alto y ancho.

Una forma es usar una herramienta de verificación. Simplemente haga clic derecho en su navegador y seleccione "Verificar" para abrir la consola del desarrollador.

Luego puede señalar y hacer clic en varios elementos de la página para resaltar su código fuente. Allí puede ver si el elemento tiene propiedades definidas para ancho y alto.

5. Elimina los elementos que bloquean el renderizado

Un elemento de bloqueo de imagen es aquel que se carga lentamente pero no permite que otros elementos se carguen en primer lugar. Esto afecta su puntaje general de Web Vitals y la experiencia del usuario en su sitio.

Los resultados de Speed ​​Insights le mostrarán elementos de bloqueo para su visualización. Suelen ser archivos JavaScript o CSS agregados por su complemento de WordPress, herramientas de terceros como Google Analytics, Facebook Pixel, Google Ads y más.

Sin embargo, la mayoría de estos elementos se agregan mediante programación a su sitio a través de varios complementos o temas. Esto hace que sea más difícil para los usuarios novatos eliminarlos o cargarlos correctamente.

Tenemos una guía paso a paso sobre cómo eliminar fácilmente elementos que bloquean imágenes en WordPress sin confundir el código de su sitio.

6. Imágenes del tamaño adecuado en WordPress

Otra razón común para las puntuaciones bajas de Core Web Vitals son las imágenes que son demasiado grandes. Muchos usuarios de WordPress cargan imágenes de alta resolución en sus sitios, que tardan más en cargarse y, a menudo, son innecesarias.

Esto se está volviendo aún más problemático para los usuarios móviles. Su WordPress receptivo y el tema de WordPress colocarán imágenes automáticamente en la pantalla móvil del usuario, pero aún cargarán archivos más grandes.

Tenemos una guía detallada sobre cómo optimizar correctamente las imágenes en su sitio de WordPress sin perder calidad ni comprometer el rendimiento.

7. Use un CDN a un servidor para mejorar el rendimiento web

CDN o Content Delivery Network es un servicio de terceros que le permite servir contenido estático para su sitio web desde múltiples servidores en todo el mundo.

Esto permite a los usuarios descargar estos archivos estáticos, como imágenes y CSS, desde el servidor más cercano. También reduce la carga en su sitio web antes de que otros elementos puedan continuar cargándose.

Puede usar una aplicación de firewall en la nube con un servicio CDN incorporado, como Sucuri. Sucuri también lo ayuda a bloquear solicitudes maliciosas y de spam al liberar más recursos en su sitio web.

También puede usar Cloudflare Free CDN como alternativa. Viene con protección básica de firewall y servicios de CDN que pueden mejorar el puntaje de Web Vitals en su sitio web.

Esperamos que esta guía le haya ayudado a comprender cómo optimizar el rendimiento web básico de WordPress. Otro aspecto importante de una buena experiencia de usuario es la seguridad. Le recomendamos que siga nuestra lista de verificación de seguridad de WordPress para asegurarse de que el rendimiento de su sitio web no se vea comprometido por el spam o los ataques DDoS.

También puede echar un vistazo a nuestra comparación del mejor software de edición de video y las mejores plataformas de seminarios web para crear contenido multimedia optimizado para el rendimiento que no ralentizará su sitio web.

Si te ha gustado este artículo, suscríbete a nuestro Canal de Youtube Vídeo tutoriales para WordPress, también nos puedes encontrar en Gorjeo y Facebook.