¡Muy buenas querido lector! Ya estoy de nuevo una semana más por aquí y, en esta ocasión vengo con un post completito sobre la herramienta de Google PageSpeed Insights.
Exacto querido lector, el post de hoy irá sobre velocidad de carga y WPO.
Es más, a día de hoy esta herramienta se ha convertido en la mejor forma de revisar tus Core Web Vital (Tan importantes para Google) tanto por webmasters cómo por consultores de WPO.
Por este motivo, si te interesa el WPO y quieres saber si tu página web es lo suficientemente rápida para Google no te pierdas este post en el que te mostraré todo lo que necesitarás saber sobre la herramienta gratuita PageSpeed Insights de Google.
¡Al lío!
¿Qué es Google PageSpeed Insight?
Google PageSpeed Insight es una herramienta gratuita de Google que te servirá para auditar de forma rápida y sencilla la velocidad de carga de cualquier URL online.
Es decir, gracias a esta herramienta podrás conocer el estado de optimización de una página y, de esta forma evaluar si dicha URL necesitará una mejora de la velocidad de carga.
¿Para qué servirá el PageSpeed Insight de Google?
Cómo has visto anteriormente, conocer la nota otorgada por el PageSpeed Insight de Google te servirá para hacerte una idea de como estará tu página web a nivel de velocidad de carga.
Además, esta herramienta diferenciará dos tipos de test de velocidad:
- Uno mobile (Qué por regla general tendrá una peor nota).
- Uno en desktop (Qué será por regla general será la versión más rápida de la página web).
Por si esto fuera poco, la propia herramienta te hará una auditoría de WPO de la URL que hayas mandando y te proporcionará posibles mejoras internas dentro de dicha URL que podrás implementar para mejorar su nota el PageSpeed Insight de Google.
¡Todo un lujo!
¿Cómo funciona el Page Speed de Google?
El funcionamiento de Page Speed de Google será súper sencillo.
Simplemente deberás escribir la URL a estudiar por la herramienta en la siguiente URL:
Una vez escrita en el recuadro correspondiente la URL a estudiar deberás pulsar sobre el botón «Analizar» y la herramienta hará el resto del trabajo.
Cuando el Page Speed de Google haya terminado de examinar la URL la herramienta te proporcionará los datos de velocidad de carga de dicha URL divididos en datos desktop y mobile.
¿Qué medirá el Google PageSpeed Insight?
La herramienta PageSpeed Insight de Google medirá:
Por un lado los datos de velocidad móvil y, por otro lado, los datos de velocidad desktop.
Además, dentro de cada dispositivo la herramienta diferenciará dos tipos de mediciones:
Datos de campo
Estos datos Google los extraerá de la experiencia de usuarios reales que utilicen en sus búsquedas el navegador Google Chrome.
De esta forma, Google sabrá cómo de rápida cargará tu página web para los diferentes usuarios con Google Chrome que visitan tu página web.
Además, dentro de estos datos de campo Google diferenciará dos tipos:
- URL en concreto. Datos de velocidad con usuarios reales sobre la URL estudiada.
- URL de origen. Datos de velocidad con usuarios reales sobre el computo global de las URLs que componen la página web de la URL proporcionada.
PD. Si tu página web contase con poco tráfico web orgánico es probable que Google no obtenga métricas de campo de tu página web.
Datos del experimento
Estos datos serán extraídos por Google de la propia herramienta de PageSpeed Insight que analizará la URL en directo.
Para esta tarea, la herramienta emulará una visita ficticia a tu página web para obtener estos resultados.
PD. Google te indicará con que tipo de navegador, red, dispositivo habrá realizado el test de velocidad. Estos datos los podrás extraer del cuadro gris que aparecerá justo debajo de las métricas del experimento.
Información de las CWV
Google PageSpeed Insight te mostrará la velocidad de carga de tu página web en base a las Core Web Vitals de Google.
Es decir, medirá:
- First Contenful Page (FCP)
- Larguest Conteful Paint (LCP)
- First Input Delay (FID)
- Cumulative Layoud Shift (CLS)
Renderizado de la página web
Por si esto fuera poco, el propio PageSpeed Insight de Google también te mostrará cómo habrá sido el renderizado de la página web por parte de Google.
Esto te servirá principalmente para detectar errores de renderizado de la URL tan importantes para el posicionamiento SEO.
¿Cómo utilizar la herramienta PageSpeed Insight?
Una vez analizada la velocidad de carga de una URL con PageSpeed Insight la propia herramienta te facilitará (A modo de auditoría WPO) una serie de oportunidades de mejora de la página web a nivel de velocidad de carga.
Estas oportunidades se dividirán en:
- Oportunidades de mejora o sugerencias. Mejorando estos aspectos dentro de la URL optimizarás su velocidad de carga.
- Diagnósticos. La herramienta te enumerará los problemas que estarán impidiendo una mejora de la velocidad de carga de la URL.
- Auditorías aprobadas. Aspectos de WPO importantes para Google que la URL habrá aprobado.
Cómo conseguir el 100/100 en el PageSpeed Insight de Google
Ahora si que si será el momento de mostrarte cómo conseguir el 100/100 en el PageSpeed Insight de Google paso a paso.
¡Vamos con ello!
Paso 1. Selecciona un buen hosting
El primer aspecto que deberás mejorar para conseguir una buena nota en el PageSpeed Insight de Google será elegir un buen hosting.
Sin un buen hosting tu nota en el PageSpeed Insight se resentirá muchísimo.
Por este motivo, yo siempre recomendaré el hosting que yo utilizo en mis proyectos y en los de mis clientes:
Paso 2. Opta por una plantilla rápida
Ya he escrito mucho sobre las plantillas de WordPress y su relevancia en términos de WPO.
De hecho, si quieres conocer cuales son las plantillas SEO para WordPress que recomendaré podrás encontrarlas aquí.
De todos modos, lo que estará claro es que no utilizar una buena plantilla SEO para tu WordPress rápida y optimizada será sinónimo de mala nota en el PageSpeed de Google.
Por este motivo, siempre recomiendo GeneratePress ya que para mi es la mejor plantilla del mercado en cuando a velocidad de carga.
Paso 3. Instala un plugin de caché
Si, se que el plugin WP Rocket es de pago.
Sin embargo, a día de hoy no he encontrado un mejor plugin de caché para alcanzar la mejor nota posible en el PageSpeed de Google.
Con WP Rocket bastará con activar casi todas las opciones que vendrán por defecto en el plugin para que automáticamente tu página web WordPress quede optimizada.
PD. Ten cuidado al activar todas las opciones ya que podrás romper tu página web al hacerlo sin control.
Paso 4. Reduce al máximo el número de plugins utilizados en tu WP
Cuantos más plugins utilices en tu página web WordPress más lenta será esta y peor será tu nota en el PageSpeed Insight.
Por lo tanto, aplica siempre el «Less is more» y utiliza el menor número de plugins posible para crear tu página web WordPress.
Paso 5. Mejora la optimización de tus tipografías
Las fuentes o tipografías de una página web siempre serán un punto de ruptura con la velocidad de la página web.
Ten en cuenta que cuantas más fuentes utilices en tus diseños web WordPress más lenta será tu página web.
Por lo tanto, utiliza como máximo dos tipografías diferentes dentro de tu página y carga solo aquellos estilos que vayas a utilizar dentro de ellas.
De todas formas, para que aprendas más sobre este aspecto te dejaré esta guía sobre cómo optimizar fuentes en WordPress.
Paso 6. Optimiza tus imágenes
Las imágenes serán con toda probabilidad los archivos que más pesen dentro de tu página web.
Por lo tanto, para evitar problemas de velocidad gracias a ellas lo mejor será optimizarlas.
Para que aprendas más sobre este aspecto te dejaré esta guía sobre cómo optimizar tus imágenes en WordPress.
Paso 7. Optimiza todo tu código HTML, CSS y JavaScript
Para optimizar todo el código de tu página web WordPress te recomendaré instalar el plugin WP Rocket.
Con este plugin podrás optimizar la entrega de archivos HTML, CSS y JS de tu página web WordPress de forma rápida y sencilla.
Conclusiones sobre el PageSpeed Insight de Google
Cómo habrás podido ver a lo largo del post, conseguir el 100% en el PageSpeed de Google será una tarea bastante complicada (Sobre todo en página web mal diseñadas de base).
Por este motivo, desconfía de aquellos gurús que digan que para conseguir una buena velocidad web bastará con instalar un plugin de WordPress y listo.
El WPO será siempre mucho más complejo que eso, créeme.
De todas formas, Google ya ha advertido de la importancia de que cualquier página web sea rápida.
Es decir, Google no penalizará a una página web que tenga más de un 80/80 en el PageSpeed Insight de Google.
Por lo tanto, mi consejo es que no te obsesiones con las métricas de esta herramienta y céntrate en contratar un buen hosting y optimizar tu página web WordPress lo máximo posible
Ahora te toca a ti querido lector ¿Conocías toda esta información sobre el PageSpeed de Google? ¿Te ha parecido interesante?
¡Cuéntamelo en los comentarios y nos vemos en dos semanas!
5 comentarios
Yo desarrolle dos plantillas para blogger, y tienen el 100/100 así ponga imágenes pesadas, no se pierde la puntuación, gracias a el CSS Sprite. Minificar los java script y aumentar los CSS que son mas livianos. O también pueden probar mover los java script que se carguen al final de la página, aunque así queda rara la página.
Hola Adovis, las imágenes son fundamentales para la velocidad de carga de una página web, si no se optimizan la puntuación quedará comprometida.
Por otro lado estoy de acuerdo con todo lo que dices sobre JavaScript cuanto menos mejor.
Un saludo Adovis y gracias por comentar
Prueba a plasmar estos dos códigos en tu htaccess y me cuentas 😉
mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_item_include file.(html?|txt|css|js|php|pl)$
mod_gzip_item_include handler^cgi-script$
mod_gzip_item_include mime^text/.*
mod_gzip_item_include mime^application/x-javascript.*
mod_gzip_item_exclude mime^image/.*
mod_gzip_item_exclude rspheader^Content-Encoding:.*gzip.*
ExpiresActive On
ExpiresDefault «access plus 10 days»
ExpiresByType text/css «access plus 1 week»
ExpiresByType text/plain «access plus 1 week»
ExpiresByType image/gif «access plus 1 month»
ExpiresByType image/png «access plus 1 month»
ExpiresByType image/jpeg «access plus 1 month»
ExpiresByType image/x-icon «access plus 3 months»
ExpiresByType application/x-javascript «access plus 1 month»
ExpiresByType application/javascript «access plus 1 week»
ExpiresByType text/javascript «access plus 1 week»
ExpiresByType application/x-icon «access plus 3 months»
y elimina los otros que te dan un error por cierto! Siempre antes de modificar cualquier archivo delicado de este tipo es recomendable guardarse una copia original para no tener problemas y poder volver siempre atrás
Borja, veo que tu web está muy bien de cara a Page Speed, sin embargo, al ingresar en el administrador de archivos en mi hosting, y editar htaccess cuando pego los códigos que dejas en este post mi sitio da un error 500 y no carga. ¿Como puedo hacer para mejorar mi sitio amigo?