skip to Main Content

Cómo mejorar el puntaje de PageSpeed Insights con los plugins gratuitos de WordPress

WordPress está liberando sitios web, poniéndolos a disposición de los no desarrolladores. La gente está descubriendo que pueden construir un sitio web por sí mismos, sin ningún tipo de superpoderes técnicos, lo cual es impresionante! Sin embargo, esto también crea algunos problemas en el camino. Por ejemplo, ¿qué haces si tu puntuación de Google PageSpeed Insights es un poco baja? Hoy hablamos de cómo puedes mejorar la puntuación de PageSpeed Insights de tu sitio de WordPress.

Hay mucho debate sobre el tema de cómo Google clasifica los sitios web, y si deberías poner más esfuerzo en subir el listón en un intento de mejorar la puntuación de PageSpeed Insights para tu sitio. Por supuesto, Google no es el único jugador en este juego, y hay otras herramientas disponibles para monitorear el rendimiento de los sitios web. GT Metrix y Pingdom hacen un gran trabajo analizando las velocidades de los sitios web, y recomiendo que también las revisen. Sin embargo, las reglas del juego establecidas por Google no deben ser ignoradas, además porque son fáciles de cumplir.

A continuación, te mostramos cómo se pueden comprobar las 10 recomendaciones de Google PageSpeed, con resultados inmediatos para el tiempo de carga de tu sitio.

La buena noticia es que para la mayoría de las reglas de PageSpeed de Google, hay un plugin de WordPress que puede ayudarte. Sin ningún tipo de conocimiento técnico, podrás arreglar el código de tu sitio web y mejorar la puntuación de PageSpeed Insights!

Mejorar la puntuación de PageSpeed Insights paso #1: Test de Google PageSpeed

Para empezar, tienes que comprobar cómo se compara tu sitio web con las métricas de PageSpeed de Google. Esto se puede hacer en el acto, sin necesidad de una cuenta, sin necesidad de registrarse en el correo electrónico, ni de ninguna brujería de marketing. Sólo tiene que tomar la URL de su sitio web (o cualquier otra URL que desee comprobar) y

Ve AQUÍ.

Sólo tienes que pegar la URL de tu sitio web y esperar un poco, el proceso tomará unos segundos dependiendo de la complejidad de la página. Tenga en cuenta que el análisis se hace en relación con esa URL exacta, no con toda la página web. La página se obtiene tanto para el uso de escritorio como para el móvil, por lo que en realidad recibirá dos informes.

La escala de Google va de 0 a 100, y cada puntuación se marca con un color distinto, dependiendo de los niveles de rendimiento: rojo, amarillo y verde. Si obtienes más de 85 puntos, se marca en verde, lo que indica que estás en el lado seguro.

Las 10 reglas de Google PageSpeed Insights

Después de ejecutar el análisis, obtendrá un informe detallado sobre lo que su sitio web está haciendo bien, así como las cosas que hay que mejorar, con sugerencias prácticas para las versiones móviles y de escritorio. Hay 10 reglas principales que Google está monitoreando, algunas de ellas serán cumplidas exitosamente, otras no.

En el caso de los que fallan, recibirá consejos sobre cómo manejar mejor los requisitos, principalmente dirigidos a los webmasters que pueden trabajar directamente en el código.

Aquí están las cosas que debes hacer primero:

1. Aprovechar el almacenamiento en caché del navegador (ver la regla original)

Algunos elementos de su sitio web pueden ser almacenados temporalmente (en caché) para facilitar la carga. Cargar contenido no almacenado en la memoria intermedia (HTML, CSS, logo, imágenes) ralentizará significativamente las cosas. No es de extrañar que sea la solución número uno para su sitio web si quiere mejorar la puntuación de PageSpeed Insights.

El almacenamiento en caché de los sitios web de WordPress es administrado por varios plugins gratuitos y premium. Sugiero que pruebes el W3 Total Cache (solución gratuita, enlace abajo) o que vayas directamente a WP Rocket, que tiene un precio, pero aún así es muy asequible (es lo que usamos en el blog).

W3 Caché total

Autor(es): BoldGrid

Versión actual: 0.13.1

Última actualización: 10 de febrero de 2020

w3-total-cache.0.13.1.zip

86% Calificaciones 1.000.000+ Instala WP 3.2+ Requiere

2. Eliminar el JavaScript que bloquea el renderizado (ver la regla original)

En resumen, algún código JavaScript puede estar interfiriendo con el contenido de arriba, impidiendo que la página se cargue correctamente.

Este problema tiene dos caras:

  • La explicación técnica: lo que hay que hacer es mover la llamada a jQuery desde la cabecera de la página más abajo, ajustando cuando se hace la llamada al módulo jQuery.
  • La solución simplificada: puedes arreglar el problema con un genial plugin – WP Deffered JavaScripts. Obligará al navegador a descargar JavaScripts en paralelo, ayudando a que el sitio se cargue más rápido.

WP JavaScripts diferidos

Autor(es): Willy Bahuaud, Daniel Roch, Grégory Viguier

Versión actual: 2.0.5

Última actualización: 1 de septiembre de 2016

wp-deferred-javascripts.2.0.5.zip

64% Calificaciones 5.000+ Instala WP 3.0+ Requiere

3. Optimizar la entrega de CSS (ver la regla original)

La mayoría de los CSS requieren un tiempo extra para su descarga, así que reducir el peso del código CSS también ayudará a mejorar la puntuación de PageSpeed Insights.

Un plugin que es realmente efectivo cuando se trata de agregar y minimizar JavaScript, CSS y HTML se llama Autoptimize. Sólo tienes que instalarlo y habilitar las opciones que quieras en Configuración / Autoptimización.

Autoptimizar

Autor(es): Frank Goossens (futtta)

Versión actual: 2.6.2

Última actualización: 24 de febrero de 2020

autotimize.2.6.2.zip

94% Calificaciones 1.000.000+ Instala WP 4.4+ Requiere

Si no te gusta, puedes usar WP Super Minify alternativamente.

4. Minimizar los recursos (ver la regla original)

El código innecesario o redundante afecta al comportamiento del navegador. Google te bajará de categoría cuando tus archivos HTML, CSS y JavaScript sean demasiado grandes. Se recomienda que todos los archivos de JavaScript más grandes de 4096 bytes sean minados.

Este proceso se maneja bien por los plugins que también optimizan la entrega de CSS, que mencionamos en el punto anterior: WP Super Minify o Autoptimize. Úsalos para mejorar la puntuación de PageSpeed Insights.

5. Habilitar la compresión GZip (ver la regla original)

Siguiendo con las mejoras del código, el CSS y el HTML también pueden ser comprimidos. Esto se hace con la compresión GZip, que reduce el tamaño de su sitio web antes de enviarlo al navegador. Esto se puede establecer de varias maneras:

  • Puede hacer que su anfitrión web configure esto.
  • Puedes configurarlo en tu archivo .htaccess.
  • Puedes habilitarlo a través de tu plugin de cacheo, como el mencionado W3 Total Cache.

6. Optimizar las imágenes (ver la regla original)

Las imágenes contribuyen, en promedio, por cerca del 60% del tamaño total de una página web – este es el mayor factor que influye en los tiempos de carga. El proceso de optimización puede reducir considerablemente el tamaño de las imágenes al eliminar la información innecesaria, y al recomprimirlas inteligentemente usando los algoritmos más apropiados.

La optimización puede ser manejada de diferentes maneras. La optimización sin pérdidas es moderada y se recomienda para los dibujos técnicos en los que no se deben eliminar detalles de la imagen. La optimización sin pérdida puede mejorar radicalmente la velocidad del sitio web al reducir las imágenes de forma más agresiva. Sin embargo, esto no interferirá con el aspecto visual de su imagen. Las imágenes seguirán mostrándose correctamente en la web, y la optimización no perturbará la forma en que los usuarios ven las imágenes en línea.

Otra cosa, las cámaras y los smartphones crean fotos con muchos megapíxeles, que no se necesitan para la web. Para mantener un tamaño de imagen óptimo, y reducir el uso de espacio en el servidor, también debes redimensionar las imágenes a un máximo de ancho y alto que tu tema de WordPress pueda manejar.

Para una detallada explicación sobre la optimización de imágenes, por favor, consulte nuestro otro post aquí. Te ayudará a mejorar la puntuación de PageSpeed Insights.

7. Mejorar el tiempo de respuesta del servidor (ver la regla original)

La lentitud en la respuesta puede deberse a varios problemas: un alojamiento web deficiente, la configuración del servidor web, la sobrecarga de tráfico o el uso de demasiados recursos. La recomendación del tiempo de respuesta óptimo del servidor de Google se establece por debajo de los 200 ms.

Entre otras cosas, tener demasiados plugins mal codificados puede afectar los tiempos de respuesta del servidor.

8. Priorizar el contenido visible (ver la regla original)

Una muy buena práctica en la codificación de sitios web – cuando se construye la estructura HTML de su sitio – es poner el contenido en primer lugar, y luego todos los elementos laterales y JavaScript más abajo en la página.

Google también advierte sobre la reducción de la cantidad de datos utilizados por tus recursos, una opción que debería haber sido resuelta por los complementos recomendados al discutir la regla número 4.

9. Usar guiones asíncronos (ver la regla original)

Cuando el código es ejecutado sincrónicamente por el navegador, no puede hacer más de una tarea a la vez e impedirá que la página se cargue más rápido.

Para ello, Google ha publicado una lista de las versiones asincrónicas de las populares herramientas/script de JavaScript. Asegúrate de usarlas en lugar de sus versiones estándar para mejorar la puntuación de PageSpeed Insights.

10. Evitar las redirecciones múltiples de la página de destino (ver la regla original)

Las redirecciones son una buena herramienta para llevar a la gente exactamente donde quieres en tu sitio web. Sin embargo, las redirecciones innecesarias también causarán retrasos y dificultarán la mejora de la puntuación de PageSpeed Insights para tu sitio de WordPress.

A Google no le gustan mucho las redirecciones de cualquier tipo. Sin embargo, cuando necesites usarlos, asegúrate de que sólo tienes una redirección para una sola URL.

Por ejemplo, evite redirigir desde site.com/página » www.site.com/page » m.site.com/página cuando se trate de la versión móvil.

Si quieres una simple redirección 301 de una sola vez, prueba un plugin llamado Linker. En resumen, le permite a Google saber que lo que sea que estés redirigiendo no es una redirección temporal, sino que permanecerá allí para siempre.

Linker

Autor(es): Yakir Sitbon, Ariel Klikstein

Versión actual: 1.2.1

Última actualización: 30 de diciembre de 2019

linker.1.2.1.zip

90% Calificaciones 2.000+ Instala WP 3.5+ Requiere

Conclusión

Bien, con todo eso detrás, mi consejo es empezar por resolver los problemas más críticos señalados en tu informe de PageSpeed Insights.

Para conocer más a fondo cada una de las recomendaciones, consulta las reglas de los desarrolladores de Google, que se explican con más detalle. El test de Google PageSpeed Insights puede repetirse tantas veces como se desee, pero deja pasar un tiempo entre cada ejecución, ya que los resultados se almacenan en caché durante unos 30 segundos.

Espero que te sientas mucho más confiado para abordar todas esas reglas de PageSpeed Insights en este momento. También estoy interesado en saber cómo ha tratado estos temas, qué otras herramientas de rendimiento ha probado y cómo le han ayudado. Compártalas en los comentarios.

Y por último, ¿quieres hacer tu sitio web más rápido? No te olvides de nuestro curso gratuito por correo electrónico sobre cómo acelerar tu sitio de WordPress:

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Pin It on Pinterest

Share This
Back To Top