TechBlogSD - Todo para WordPress y desarrollo WEB
Instrucciones de WEB y WordPress, noticias, reseñas de temas y complementos

¿Cómo obtener una puntuación de 100/100 en el sitio de Google PageSpeed ​​Insights para WordPress?

10

Google anunció recientemente que la experiencia de la página sería uno de los factores en el algoritmo que afectará las posiciones de clasificación de búsqueda. El nuevo término Core Web Vitals que ve en Google Search Console se está convirtiendo en factores importantes que definirían el futuro de la web. Esto obliga a todos los webmasters a asegurarse de que la velocidad de carga del sitio sea la exigida por Google para obtener una buena clasificación en los resultados de búsqueda. Si está utilizando WordPress para alojar su sitio, en realidad es fácil obtener una puntuación de 100/100 en la herramienta Google PageSpeed ​​Insights.

Este es un estudio de caso con nuestra propia experiencia. Por lo tanto, mencionamos los complementos / temas / nombres de empresas de alojamiento explícitamente. Es importante destacar que no siempre es necesario mirar la puntuación de PageSpeed ​​si tiene una visibilidad clara de lo que está haciendo. Por ejemplo, puede utilizar anuncios pagados o marketing social para promocionar su sitio que tiene una puntuación de velocidad de página baja. Por lo tanto, el contexto de este artículo es aplicable a los blogueros que buscan obtener una puntuación de velocidad más alta, lo que aumenta las posibilidades de obtener una clasificación más alta en los motores de búsqueda y una mejor experiencia del usuario.

Google PageSpeed ​​Insights

Hay pocas herramientas; que puede utilizar para controlar la velocidad del sitio web de WordPress. Google PageSpeed ​​Insights, Pingdom, GTmetrix y WebPage Test son algunas de las herramientas más utilizadas en la lista. Dado que los resultados de búsqueda de Google deciden el tráfico de muchos sitios web, es bueno utilizar la herramienta PageSpeed ​​Insights como referencia.

Puede ir a la herramienta PageSpeed e ingresar la URL de cualquier página para obtener la puntuación de velocidad. Hay muchos factores que influyen en la puntuación que puede leer en el sitio oficial del desarrollador de Google. A continuación se muestra el resumen de los factores que influyen en la puntuación que ve.

Factor Peso
Primera pintura con contenido 15%
Índice de velocidad 15%
Pintura con contenido más grande 25%
Tiempo para interactuar 15%
Tiempo total de bloqueo 25%
Cambio de diseño acumulativo 5%

Después de analizar la página web, Google proporcionará una puntuación basada en una escala de 100 puntos. A continuación se muestran los tres rangos para indicar la posición de velocidad de la página analizada.

  • 0-49: pobre
  • 50-79: necesita mejorar
  • 80-100: bueno

Por lo tanto, una puntuación de 100/100 en Google PageSpeed ​​indica que su sitio se carga súper rápido, obviamente a Google y a los usuarios les encantará los sitios web de carga rápida. Puede consultar la calculadora de puntuación de Lighthouse para comprobar varios parámetros necesarios para mejorar la velocidad de forma dinámica.

Recuerde, además de los factores mencionados anteriormente, Google también sugerirá oportunidades como eliminar los scripts no utilizados o eliminar CSS no utilizados. Sin embargo, estas son recomendaciones y NO afectarán su puntaje, incluso si trabaja duro para que pasen la auditoría. Hacemos este punto explícitamente ya que muchos blogueros piensan que eliminar jQuery ayudará a obtener una puntuación más alta.

Puntaje y tamaño de nuestro sitio web

Antes de explicarte cómo conseguir 100/100, queremos mostrarte la puntuación de nuestra página de inicio. Como puede ver, obtenemos 100 tanto para dispositivos móviles como para computadoras de escritorio.

¿Cómo obtener una puntuación de 100/100 en el sitio de Google PageSpeed ​​Insights para WordPress?

Puntuación de la página de inicio

Recuerde, estamos hablando de este sitio web en vivo que tiene casi 2000 publicaciones de blog y usa alrededor de 20 complementos. Si podemos obtener la puntuación completa, es muy posible para los sitios con menos publicaciones y complementos.

5 factores para obtener una puntuación de 100/100 en Google PageSpeed

A continuación se muestran los 5 factores principales que analizaremos en detalle que consideramos importantes para obtener una puntuación de 100/100 en Google PageSpeed.

  1. Obtenga una buena empresa de alojamiento
  2. Sin códigos publicitarios
  3. Usar tema ligero
  4. Eliminar complementos pesados
  5. Usar complemento de almacenamiento en caché

Pocos otros factores como la limpieza de la base de datos y la CDN también pueden ayudar dependiendo de su situación. También cubriremos esos aspectos.

1 Buen alojamiento

Comenzamos este sitio web en Weebly y lo cambiamos a WordPress con Bluehost. Más tarde, trasladamos el sitio al plan SiteGround GoGeek y luego a SiteGround Cloud VPS en mayo de 2016. A partir de ese momento, no hubo vuelta atrás ni dedicar tiempo a problemas relacionados con el alojamiento.

Recientemente, SiteGround movió su infraestructura para usar la plataforma Google Cloud. Esto ayuda mucho a tener un tiempo de primera respuesta sólido del servidor. Ni siquiera estamos usando Cloudflare o cualquier otro CDN para obtener una puntuación de 100/100 en Google PageSpeed. Se trata del buen alojamiento que utiliza para su sitio. Por lo tanto, asegúrese de comprar un plan de alojamiento premium como SiteGround Cloud VPS o similar. Esto le ayudará a ahorrar mucho tiempo y a centrarse en otros aspectos del funcionamiento de un sitio web.

2 Sin códigos publicitarios

Casi el 90% de los blogueros comienzan a bloguear para ganar dinero en línea. La primera opción para ellos es solicitar Google AdSense y la segunda opción es probar el marketing de afiliación. Dado que el marketing de afiliación necesita un sitio confiable, Google AdSense es una opción ideal para los nuevos blogueros.

Usamos Google AdSense y esa es nuestra principal fuente de ingresos para ejecutar este sitio web. Hemos explicado los problemas con AdSense y la velocidad de la página en nuestro artículo: AdSense Vs Page Speed ​​an Irony. La página que hemos probado en PageSpeed ​​es la página de inicio de este sitio. La razón por la que obtenemos una puntuación de 100/100 es que no utilizamos el código de AdSense en la página de inicio. Sin embargo, hay anuncios automáticos disponibles en todo el sitio. Cuando revisamos la página después de verificar la puntuación de PageSpeed, descubrimos que se mostraba un anuncio en la parte inferior de la página. La página se carga más rápido con un solo anuncio que aparece en la parte inferior.

Permítanos mostrarle el resultado de una página aleatoria que tiene 5 anuncios de AdSense en este sitio. Como puede ver, la puntuación está en el rango de 55/90. Esta es una caída del 45/10% en dispositivos móviles y computadoras de escritorio.

¿Cómo obtener una puntuación de 100/100 en el sitio de Google PageSpeed ​​Insights para WordPress?

Velocidad móvil de la página aleatoria

¿Cómo obtener una puntuación de 100/100 en el sitio de Google PageSpeed ​​Insights para WordPress?

Velocidad de escritorio de una página aleatoria

Si su opción es utilizar AdSense o cualquier programa de publicidad similar, olvídese de la velocidad de la página. Google PageSpeed ​​le mostrará muchos problemas debido a la carga de scripts de terceros en su sitio. Desafortunadamente, no podrá resolver esos problemas sin eliminar el código del script de publicidad.

¿Cómo obtener una puntuación de 100/100 en el sitio de Google PageSpeed ​​Insights para WordPress?

Impacto de AdSense en la velocidad

3 Utilice un tema ligero

Usamos el tema Highend durante 4 años. Este es un tema muy bueno con funciones incluidas. Desafortunadamente, no usamos el 90% de las funcionalidades como mapas, preguntas frecuentes, testimonios, etc. Sin embargo, el tema carga los recursos CSS y JS necesarios para todas estas características, independientemente de si lo usas en la página o no. Esto no tiene sentido como ser dueño de un gran palacio pero aún vivir en una pequeña cabaña fuera del palacio.

Desafortunadamente, no fue fácil cambiar un tema debido a la estrecha integración del tema de Highend en todo el sitio. Por ejemplo, el tema Highend tiene una opción para integrar Google Analytics usando opciones de tema. Por lo tanto, hemos dedicado mucho tiempo a encontrar un tema de reemplazo que sea de naturaleza mínima pero que ofrezca funciones básicas sin complementos.

Afortunadamente, muy pocos temas cumplieron con nuestros criterios. Para ser precisos, elegimos los temas GeneratePress y Astra y luego decidimos comprar GeneratePress. Después de seis meses de trabajo de migración, cambiamos el tema en junio de 2020 y la puntuación de PageSpeed ​​aumentó al menos un 30% (con anuncios de AdSense).

Se perdieron cinco años anteriores al elegir un tema equivocado que no necesitábamos. Asegúrese de no cometer el mismo error y compre un tema premium y minimalista que satisfaga sus necesidades. El tema GeneratePress ofrece ganchos usando elementos, secciones, tipografía y otras características básicas que necesitamos. Para cualquier otro propósito, es mejor usar complementos para que no necesitemos desperdiciar otros cinco años más tarde para cambiar este tema.

4 Eliminar complementos pesados

Al igual que en el tema, hay complementos pesados ​​que reducirán la velocidad de la página. Anteriormente, estábamos usando los complementos WPBakery Page Builder, WooCommerce y WP Review en este sitio. Ahora, hemos movido todos esos complementos junto con el tema Highend a un subdirectorio. Esto nos causó una gran pérdida de tráfico junto con las actualizaciones del algoritmo de Google en mayo de 2020. Sin embargo, tenemos que seguir adelante con un aumento de ~ 30% en la velocidad.

Si está utilizando o planea encontrar un creador de páginas o complementos similares, deténgase y piénselo dos veces.

  • Convertimos el diseño de WPBakery Page Builder y usamos Gutenberg predeterminado para construir nuestra página de inicio. Incluso GeneratePress ofrece diseños de Elementor y su propio generador de mini páginas, sin embargo, puede hacer diseños decentes con encabezados de héroe y jumbotron de ancho completo utilizando el bloque del Grupo Gutenberg.
  • Evite los complementos hinchados como WP Review: todavía usa una fuente impresionante 4.7 por el precio de $ 97 (licencia de 3 sitios). Esto es absolutamente ridículo al cargar la versión 4.7 en cada página cuando la versión 6 está en ejecución. Recuerde, estamos hablando de 2000 páginas de las cuales solo 70 utilizan la plantilla de revisión del complemento. Este es un tipo de compensación que debe pensar antes de instalar cualquier complemento en su sitio.
  • WooCommerce es otro complemento que matará su sitio al agregar llamadas AJAX de administrador al carrito. Nuevamente, 50 productos frente a 2000 publicaciones no es una buena manera de mantenerlos juntos tanto desde el punto de vista del tráfico como de los ingresos.

Estas son formas difíciles de aprender, nos llevó años comprenderlas. Espero que pueda entenderlo y usar solo los complementos necesarios en su sitio.

5 Utilice el complemento de almacenamiento en caché

Usamos WP Rocket durante más de un año. La mejor parte del complemento es que genera CSS crítico para cada tipo de publicación en su sitio. Junto con el almacenamiento en caché y la precarga, el CSS crítico aumentará la velocidad de su sitio al máximo. Tenga en cuenta que también usamos WP Rocket en el tema Highend con WooCommerce y otros complementos pesados ​​como se explicó anteriormente. Sin embargo, el resultado fue 30/60 en Google PageSpeed.

Entonces, el hallazgo es que el complemento de almacenamiento en caché funciona mejor con los mejores temas / complementos codificados. De lo contrario, tendrá una combinación incorrecta sin mucho aumento en la velocidad. Tenga en cuenta que SiteGround ofrece almacenamiento en caché de servidor predeterminado con el complemento SG Optimizer. Sin embargo, esto no funciona para nosotros incluso con el tema GeneratePress simple. Como queremos mantener el almacenamiento en caché independiente del alojamiento, WP Rocket o un complemento similar fue la mejor opción para nosotros. A continuación se muestran el almacenamiento en caché y otras características que obtendrá con WP Rocket:

  • Almacenamiento en caché del navegador, compresión GZIP, eliminar la cadena de consulta y optimizar las fuentes de Google.
  • Deshabilite las incrustaciones, los emoji y la API de control de latidos del corazón.
  • Generación de CSS crítico para cada tipo de publicación con precarga de URL basadas en su mapa del sitio XML.
  • Aloje jQuery Migrate, Google Analytics y Facebook Pixels para mejorar la velocidad.
  • Combina y minimiza CSS y JS.
  • Limpieza de entradas redundantes de la base de datos como transitorios, revisiones y autoguardados.
  • Carga diferida de imágenes, videos y marcos.
  • Caché separado para dispositivos móviles y de escritorio, si lo necesita.

También puede comprar CDN y usar el complemento de optimización de imágenes por un costo adicional (no usamos estas funciones).

Otros factores

Bueno, en todo Internet encontrará una palabra "CDN" cuando se habla de la velocidad del sitio de WordPress. SiteGround también ofrece integración gratuita de CDN con Cloudflare. A menos que tenga un público objetivo en países bloqueados de Internet como China, no creemos que CDN pueda realmente aumentar la velocidad drásticamente. Para un sitio como el nuestro, ayudará a servir archivos estáticos como imágenes grandes más rápido. Sin embargo, SiteGround introdujo Herramientas del sitio (reemplazando a cPanel) que generarán automáticamente imágenes WebP usando su complemento SG Optimizer. Todavía no estamos usando Con esta función, puede utilizar cualquier complemento WebP para ofrecer imágenes ligeras a los navegadores compatibles, en lugar del formato PNG / JPEG.

Otro factor es limpiar su base de datos y su sitio. Como se mencionó, WP Rocket ofrece la opción de limpieza de base de datos que puede programar periódicamente. Sin embargo, esa no es la limpieza de la que hablamos aquí.

  • ¿Sabe que el complemento WooCommerce agregará más de 25 tablas en su base de datos? Como explicamos aquí, la instalación predeterminada de WordPress solo tendrá 12 tablas para un solo sitio. Pasamos mucho tiempo migrando pedidos, productos y archivos de WooCommerce. También necesitamos eliminar las miniaturas de WooCommerce para limpiar el espacio de almacenamiento. Obtenga más información sobre cómo eliminar completamente WooCommerce de su sitio.
  • El complemento WP Review Pro agregará ~ 25 campos personalizados a cada publicación que cree. Todos estos hincharán la mesa postmeta. También generará 2 miniaturas adicionales para cada imagen que cargue.
  • WP Bakery y muchos otros complementos tendrán CSS, JS y otros recursos en un directorio separado en la carpeta de cargas. Estos scripts ralentizarán su sitio al cargarse en todas las páginas.
  • El tema de gama alta generará ~ 10 miniaturas (esto variará según el tamaño de la imagen y las opciones) para cada imagen que cargue.

Ahora que simplemente cambiar el tema a GeneratePress y migrar complementos pesados ​​al subdirectorio no ayudará a limpiar el desorden actual. Si está cambiando de tema o eliminando complementos, asegúrese de eliminar todos los rastros que dejan en las tablas wp_postmeta y wp_options. Esto ayudará a aumentar la velocidad de carga de la página al reducir el tiempo de ejecución de la consulta de la base de datos.

Ultimas palabras

Hemos escrito este artículo a propósito de una manera, lo que NO se debe hacer para obtener una puntuación de 100/100 en la herramienta Google PageSpeed ​​Insights. Esto es para aquellos blogueros que están en medio de los blogs tratando de mejorar la velocidad. Sin embargo, si eres un nuevo bloguero, debería darte una idea clara del impacto de elegir opciones como AdSense y temas pesados ​​con creadores de páginas. Como dice un proverbio popular, "La simplicidad es la máxima sofisticación", elegir lo que necesita lo ayudará a obtener una puntuación alta y a ahorrar mucho tiempo.

Fuente de grabación: www.webnots.com
Deja una respuesta

This website uses cookies to improve your experience. We'll assume you're ok with this, but you can opt-out if you wish. Accept Read More