12 consejos útiles para mejorar su puntaje de Google PageSpeed ​​Insights

contenido
1. Prefacio
2. ¿Cómo funcionan PageSpeed ​​Insights?
3. Cómo mejorar la puntuación de su página de información de la página
3.1. Evite las redirecciones en la página de destino después de hacer clic
3.2. Reducir CSS, HTML y JavaScript
3.3. Prioriza el contenido por encima de la página
3.4. Acelerar el tiempo de respuesta del servidor
3.5. Eliminar los recursos que bloquean la representación
3.6. Minimizar el trabajo en el hilo principal
3.7. Servir imágenes en formatos de próxima generación
3.8. Use la memoria de su navegador en caché
3.9. Evite los cambios de gran aspecto
3.10. Optimizar las imágenes
3.11. Reducir el impacto del tercer código parcial
3.12. Evite una dimensión DOM excesiva
4. Para ti
Google ha aumentado gradualmente la importancia de la velocidad del sitio como señal de clasificación desde que se introdujo la indexación móvil en 2016. En sus propias palabras, “la velocidad es igual a los ingresos”.
Cuando una página tarda demasiado en cargarse, los visitantes pasan otra página para encontrar respuestas más rápido. La baja velocidad desalienta a los visitantes a permanecer en su sitio, independientemente de cómo hayan encontrado (búsqueda orgánica, enlace de recomendación, anuncios pagados). Además de mejorar la experiencia del usuario (UX) de su sitio, un sitio rápido también mejora el SEO. Si su sitio es rápido, tiene una mayor probabilidad de clasificarse por encima de los sitios más lentos con altas tasas de rechazo.
Los visitantes tienen un 106% más de posibilidades de saltar a medida que el tiempo de carga de la página pasa de un segundo a seis segundos.
Un retraso de un segundo de la velocidad de carga de los sitios móviles puede afectar las tasas de conversión hasta en un 20%.

Fuente: piense con Google un estudio de backlinko que analizó 11.8 millones de resultados de búsqueda de Google, bastante sorprendente, que “no hay correlación entre la carga de página y la clasificación en la primera página en Google”. Se ha explicado que la actualización de velocidad de Google afecta solo páginas extremadamente lentas y las reduce en lugar de beneficiarse de las páginas rápidas. Sin embargo, el estudio encontró que la velocidad de carga promedio de la página para los resultados en la primera página es de 1.65 segundos. conversiones de transacciones.

Fuente: Porter sobre todo, Google ha confirmado que la velocidad de la página es un factor de clasificación tanto para dispositivos móviles como para las computadoras y recomienda el uso de PageSpeed ​​Insights y Lighthouse para evaluar el rendimiento del sitio. Por lo tanto, mejorar la velocidad de su página debería ser una prioridad para mejorar la experiencia del usuario y aumentar los motores de búsqueda. ¿Cómo funcionan PageSpeed ​​Insights? PageSpeed ​​Insights es una herramienta de evaluación de rendimiento gratuita que analiza cualquier URL y ofrece un puntaje de 100 para la versión móvil y de escritorio. También ofrece algunas recomendaciones para mejorar e identifica oportunidades de optimización.

Fuente: El terreno del motor de búsqueda El instrumento funciona con Lighthouse, que proporciona datos de laboratorio y datos de campo.

Los datos de campo se recopilan a partir de los datos de rendimiento en el mundo real contenidos en el informe sobre la experiencia del usuario Chrome (Crux) cuando los visitantes cobran su página. Identifique los bloqueos que evitan que los visitantes reales realicen conversiones en su página. Incluye: Primera pintura Contentul (FCP): el tiempo requerido para cargar el primer texto o imagen
La pintura de contenido más grande (LCP): el tiempo requerido para cargar el texto o imagen más alto
Primer retraso de entrada (FID): el tiempo requerido para que el navegador responda a la primera interacción del visitante
Cumulativo desplazamiento de diseño (CLS): mide cualquier movimiento de página en la ventana de vista
Los datos de laboratorio miden la velocidad de la página web en un entorno controlado simulado, como redes móviles y un dispositivo de nivel medio. Es una buena manera de detectar problemas de rendimiento y encontrar soluciones para remediarlos. Calcula FCP, LCP, CLS y otros tres valores:
Índice de velocidad (SI): el tiempo requerido para que el contenido aparezca visualmente durante la carga de la página
Tiempo de interactivo (TTI): el tiempo requerido para que la página se vuelva completamente interactiva
Tiempo total de bloqueo (TBT) – Tiempo total de FCP e interactividad completa
Obtener una puntuación de 100/100 no es un indicador directo de la velocidad de la página. Puede tener un sitio web de carga rápida sin obtener una puntuación perfecta.
Los visitantes tampoco se preocupan por una puntuación perfecta. Todo lo que quiero es ver tu contenido rápidamente. Por lo tanto, es más importante centrarse en implementar las recomendaciones dadas por el instrumento. Los resultados del valor de rendimiento utilizado para calcular su puntaje tienen diferentes pesos. Esta tabla proporciona pesos para datos de laboratorio en Lighthouse 8:

En lugar de estos pesos, lo que se muestra es un puntaje de rendimiento agregado y un color que denota El grupo de puntuación: rojo (débil): 0 – 49
Naranja (promedio): 50 – 89
Verde (bien): 90 – 100
La herramienta proporciona acciones detalladas en la sección Oportunidades para ayudarlo a mejorar su puntaje.
Cómo mejorar su puntaje de información de la página de páginas basado en las recomendaciones ofrecidas por el instrumento PSI, aquí hay 12 formas en que puede mejorar su puntaje de rendimiento: evite las redirecciones en la página de destino después de hacer clic generalmente cuando elimina o mueve una página desde su sitio web . Aumentan el tiempo al primer byte (TTFB), que es el tiempo necesario entre una solicitud al servidor y cuando se envían los primeros datos de bytes al solicitante. Aunque no hay nada de malo en el uso de redireccionamientos, el uso excesivo causa retrasos en la carga de la página.
Asegúrese de usar redireccionamientos solo cuando sea necesario para mejorar la velocidad de carga de la página y mejorar el SEO general. Reducir la minificación CSS, HTML y JavaScript se refiere al proceso de eliminar o remediar datos innecesarios o duplicados sin afectar cómo un navegador procesa HTML. Implica eliminar espacios innecesarios, personajes y dobles. Minimizar CSS, HTML y JavaScript reduce el tamaño de estos archivos y mejora la velocidad de carga de la página. La fuente: los buffs WP usan complementos como WP Rocket, HTML minificar o autoptimizar automáticamente su código de WordPress.
Prioriza el contenido de arriba de la página La carga perezosa implica priorizar la carga de imágenes que son inmediatamente visibles en lugar de hacer que el navegador cargue todas las imágenes en la página antes de mostrar los contenidos por encima de la página. Reduce el tiempo requerido para llegar a FCP y FMP. Al priorizar el contenido por encima de la página y posponer las imágenes fuera de pantalla, puede mejorar el rendimiento del sitio. Si ha implementado el “desfile infinito” como lo hacen la mayoría de los sitios con contenido intenso, debe usar la carga perezosa.
Fuente: WordStream Use complementos de WordPress como Lazy Lazy by WP Rocket y A3 Lazy Load. La autoevaluación también tiene funciones de carga perezosa.
Acelere el tiempo de respuesta del servidor El tiempo de respuesta del servidor o TTFB es una medida siempre que el navegador tenga que esperar antes de obtener el primer byte del servidor. Cuanto más tiempo este período, más se lleva la carga de la página. Un TTFB bajo no es lo mismo con una rápida velocidad del sitio, pero un tiempo de respuesta rápido mejora el rendimiento del sitio. Fuente: Métodos de WordStream para acelerar el tiempo de respuesta del servidor:

Use un host de WordPress rápido: un proveedor de alojamiento de calidad, concentrado en WordPress, tiene una arquitectura cuidadosamente pensada y prioriza la velocidad.
Implemente una red de entrega de contenido (CDN): si tiene un sitio web que atiende a visitantes de todo el mundo, el uso de un CDN lo reducirá significativamente.

Use la memoria en caché WordPress: la memorización de caché puede reducir el tiempo de carga de la página y TTFB, ya que reduce el tiempo de procesamiento del servidor. Los complementos de caché gratuitos como el habilitador de caché están disponibles.
Seleccione un sistema de nombre de dominio premium (DNS): generalmente con proveedores premium de DNS, los tiempos de búsqueda de DNS son más rápidos. Sin embargo, CloudFlare es un proveedor DNS gratuito que ofrece un excelente rendimiento.

Elimine los recursos que bloquean los recursos de bloqueo aleatorios son archivos estáticos como JavaScript, CSS, HTML y fuentes, que son cruciales para reproducir una página web. El navegador del visitante debe descargar y procesar estos archivos antes de que se pueda mostrar el resto de la página.
Por lo tanto, tener muchos de estos archivos “por encima del pliegue” crea un bloqueo y ralentiza la velocidad del sitio. Cree sus conocimientos de sugerencia con el increíble WordPress de Pressable
Saber más
Fuente: Masters de medios en línea Hay dos métodos para eliminar recursos que bloquean la representación:
En línea: si su página web no tiene mucho JavaScript o CSS, considere su inclusión, es decir, incorporando el código JavaScript y/o CSS en el archivo HTML. Puede usar un complemento como Self -Optimize para ingresar su código si usa WordPress. Tenga en cuenta que este método funciona solo para sitios muy pequeños. La mayoría de los sitios de WordPress tienen suficiente JavaScript para que esta técnica pueda ser contraproducente.
Async y diferenciales de sitios web grandes, use los atributos de los atributos de diferencias descargas los scripts durante el análisis HTML, pero solo lo ejecuta después de la finalización del análisis. También los ejecuta para aparecer en la página. Los scripts con el atributo asíncrono se ejecutan tan pronto como se complete la descarga.
Minimice el trabajo en el hilo principal “El hilo principal” es el elemento principal del navegador de un usuario que tiene la tarea de cambiar el código en una página web que los visitantes pueden trabajar. Tiene dos funciones: analiza y realiza JavaScript, HTML y CSS y administra las interacciones del usuario. Cuando el hilo principal funciona en el código del sitio, no puede administrar simultáneamente las solicitudes de los usuarios. Por lo tanto, si trabajar con el hilo principal lleva demasiado tiempo (> 4 segundos), conduce a una velocidad de carga lenta y un UX débil.

Fuente: Métodos Marfeel para minimizar el trabajo del hilo principal:

Reduzca CSS, HTML, JavaScript: use en línea o aplazamiento para reducir las dimensiones del archivo. Elimine el código no utilizado, al igual que reduce el código, considere ingresar o posponer estilos de cualquier manera que funcione para su página web. Use herramientas como ChromedevTools para encontrar el código JavaScript y CSS.

Implementar la memoria del navegador en caché: implica ahorrar a los niños de los recursos previamente cargados, de modo que el navegador no tenga que recargarlos en cada visita. Use herramientas como W3 Total Cache para sitios de WordPress.
Implemente la división del código: es una técnica avanzada que involucra la división de JavaScript en paquetes que se realizarán cuando sea necesario, en lugar de los navegadores para cargar todo el código antes de que la página web se vuelva interactiva. Use Webpack para implementar la división de código.
Servir las imágenes en los siguientes formatos de generación Las imágenes en los formatos de estado de State -La Art como JPEG 2000, JPEG XR y WebP se cobran más rápido que los formatos de archivo utilizados, como JPEG y PNG.
Fuente: Cargar ninja

WebP ofrece dimensiones de archivo en un 25 – 35% más pequeño que JPEG, con la misma calidad.
Las imágenes de WebP dan como resultado una disminución en un 42.8% en comparación con las imágenes de PNG.
Las imágenes de WebP se están volviendo cada vez más formatos estándar para imágenes y complementos, como Smush e Imagify, ofrece una función de conversión WebP.Use la memoria del navegador en la memoria de caché en el caché es una optimización básica que permite que sus páginas web carguen más rápido para repetir los visitantes.Cuando el visitante se mueve a una nueva página en su sitio, la memorización de caché asegura que no se recargue todos sus datos (como logotipos y fuentes).Esto da como resultado una mejora significativa en la velocidad del sitio.
Fuente: KeyCDN use complementos como W3 Total Cache, WP Super Cache y WP Rocket para sitios web de WordPress para implementar la memoria de su navegador. Google PageSpeed ​​Insights requiere una política de caché “efectiva”. Esto significa que debe optimizar la frecuencia en la que su navegador elimina su caché. Pero no quieres ser con demasiada frecuencia, porque viola el propósito de tener caché en el navegador. Puede optimizar el período de vencimiento del caché agregando control de caché y expira a un servidor NGINX. Si tiene servidores Apache, puede editar o crear un archivo .htaccess (usando un desarrollador web). También puede considerar el alojamiento local de Google Analytics con complementos como Perfmatters y Complete Analytics Optimization Suite (CAOS). Evite grandes cambios de apariencia, los cambios de gran aspecto conducen a una experiencia frustrante para el usuario, porque los elementos de la página aparecen repentinamente, cambian e interfieren con la forma en que los visitantes interactúan con la página web. Cuando se producen cambios de apariencia, justo cuando un visitante está a punto de hacer clic o alcanzar un elemento (botones, imágenes, formularios de contacto), la pantalla se mueve hacia abajo y ha hecho clic en otra cosa. Evitar grandes cambios de apariencia es particularmente importante para los dispositivos móviles. Una puntuación CLS débil indica que su página web es “desagradable” o visualmente inestable. Fuente: Formas generadas de prensa para evitar grandes cambios de apariencia:
Especifique el tamaño de la imagen: establezca el ancho y la altura para imágenes y elementos de video, de modo que se use el espacio correcto para imágenes y videos. También puede hacer esto utilizando el CSS. Los cambios reducidos de los cambios de impresión causados ​​por la incorporación, los anuncios e iframe: puede tomar más medidas para minimizar los movimientos de apariencia debido a iframs, anuncios e incorporación:
Use sustituyentes cuando no esté disponible para anuncios de pantalla

Mueva los anuncios a la parte inferior o fuera de la ventana de observación
Reserve el espacio publicitario más grande antes de cargar la biblioteca de anuncios
Evite insertar el contenido dinámico por encima del contenido existente: puede evitar altos cambios de apariencia, no insertar contenido nuevo, como pancartas y formularios por encima del contenido existente, a menos que se responda a la interacción de los visitantes.
Evite el flash de texto invisible (FOIT): su puntaje CLS puede verse afectado por problemas de FOIT. Puede precargar las fuentes y/o usar el atributo de pantalla de fuente para asegurarse de que su texto debe permanecer visible durante la carga de la fuente.

Evite las animaciones no compuestas: con la ayuda de un desarrollador web, realice solo animaciones compuestas siempre que sea posible para minimizar la actividad principal y evitar volver a pintar los píxeles al cargar la página.

Optimizar las imágenes de las imágenes y las puntuaciones bajas de la comprensión de la velocidad de las páginas son causadas principalmente por imágenes grandes. La optimización de imágenes ayuda a reducir los tiempos de FCP y LCP y previene los problemas de CLS.
Fuente: Tech Aprenda aquí hay algunas formas en que puede optimizar las imágenes:
Cambiar y comprimir imágenes: use complementos como WP Smush Image o Crush. También puede usar herramientas en línea como Optimizilla y Compress JPEG.
Estándares establecidos: Defina los estándares para el formato y la resolución de imagen máxima para el sitio
Use un CDN para entregar sus imágenes: use una red de entrega de contenido para que las imágenes se entreguen más rápido.
Use imágenes receptivas: implica la creación de diferentes tamaños para diferentes dispositivos mediante el uso de los navegadores de atributos, lea esta lista, decidiendo qué tamaño de imagen es adecuado para el dispositivo actual y muestra esa versión de la imagen.
Reducir el impacto del código de terceros de terceros puede reducir el rendimiento de su sitio prolongando la actividad en el hilo principal. Ejemplos de guiones de terceros son:
Google analitico
Bibliotecas y fuentes de JavaScript
Iframe para anuncios y otro contenido

Incorporar videos de YouTube
Botones y compartir flujos en las redes sociales
Fuente: Web.dev Aunque algunos de estos pueden ser necesarios para su sitio web, hay formas de minimizar su impacto:
Posponer la carga de JavaScript
Organizó los scripts de terceros localmente como Google Analytics
Use etiquetas de enlace con atributos de prenección
Evite una dimensión DOM excesiva El modelo de modelo de objetivos del documento (DOM) es cómo los navegadores convierten HTML en objetos. Utiliza una estructura de árbol con varios nodos individuales que representan cada objeto. Cuanto mayor sea el tamaño, más tiempo se carga su página web. También debe usar un tema de sitio suave que utilice la compresión de GZIP o tenga un diseño más receptivo. Los temas pesados ​​agregan más volúmenes de elementos a DOM y pueden tener un estilo complicado que ralentiza la velocidad de carga de la página. Es su giro de Google PageSpeed ​​Insights es una herramienta invaluable para propietarios de sitios y agentes de marketing, incluso para menos conocimiento técnico. Siguiendo las recomendaciones en el informe PSI (pero sin estar obsesionado con obtener una puntuación perfecta), ciertamente aumentará la clasificación de su sitio en SERP.
Cambie una de las formas más rápidas de lograr la velocidad de su página es cambiar a un host de WordPress rápido. Con servidores de memoria no volátiles expresos (NVME) especialmente construidos para WordPress, Autoscaling y CDN global, Pressable asegura que su sitio se ejecute rápidamente en todos los volúmenes de tráfico. Ver precios