Son muchos los factores que influyen a la hora de conseguir un buen posicionamiento en los buscadores web. La velocidad de carga es uno de los que siempre deberíamos tener en cuenta para conseguir estar siempre lo más arriba posible. Para medir si nuestra web carga lo suficientemente rápida y está todo lo optimizada posible, nos encontramos varias herramientas online. Entre ellas está Google PageSpeed Insights, que será la protagonista a lo largo de este White Paper.

Descargar White Paper: 'Mejora la velocidad de carga de tu web utilizando Google PageSpeed Insights'

¿Qué es Google PageSpeed Insights?

PageSpeed Insights es una herramienta gratuita creada por Google que permite analizar un sitio web para evaluar su velocidad de carga, pero además de esto, es capaz de ofrecer una serie de sugerencias y herramientas asociadas para mejorar los resultados.

Para realizar este análisis, lo que PageSpeed Insights hace es comprobar que el portal que está siendo analizado cumple algunas de las buenas prácticas que Google considera necesarias para que la web sea mostrada lo más rápido posible a los usuarios. Estas buenas prácticas abarcan tanto a nivel front-end (imágenes, archivos, carga de JavaScript, hojas de estilos…), así como la configuración del servidor donde la web está hospedada.

Los objetivos planteados por esta herramienta para mejorar la velocidad de carga del sitio se pueden clasificar en tres aspectos fundamentales.

• Reducir al máximo el número de llamadas HTTP realizadas
• Reducir a su mínima expresión el tamaño de las respuestas tras una petición HTTP
• Optimizar el renderizado de la página en el navegador del usuario

¿Cómo funciona Google PageSpeed Insights?

El funcionamiento de Google PageSpeed Insights es muy sencillo. Cuando entramos en ella, nos aparecerá un campo de texto donde tendremos que poner nuestro dominio o aquella que queramos analizar. Una vez indicado y tras pulsar el botón de “Analizar“, la herramienta empezará a realizar su trabajo de análisis, un proceso que se puede demorar durante varios segundos.

Una vez finalizado ese proceso, la aplicación nos mostrará en pantalla la puntuación que ha cosechado nuestro sitio, una puntuación cuyo valor máximo es 100. Cuanto más próximo estemos a ese valor, mejor velocidad de carga tendrá y por lo tanto, será mejor para nuestro SEO.

Dependiendo de nuestra puntuación, la herramienta nos ofrecerá una serie de consejos para que mejoremos nuestra velocidad de carga. Estos consejos se clasifican en tres colores diferentes, que indican una mayor o menor prioridad. Su significado es el siguiente:

• Consejos en color rojo. Hacen referencia a cosas que deberíamos intentar corregir a toda costa
• Consejos en color amarillo. Se tratan de consejos que podrías llevar a cabo, pero cuyos resultados no serían muy relevantes para la valoración final. Se pueden omitir pero siempre es bueno aplicarlos
• Reglas en color verde. Aquellos consejos que aparezcan en este color, significa que son correctos y que no hay que hacer ningún tipo de cambios

Elementos que analiza Google PageSpeed Insights para emitir su valoración

Tal y como hemos explicado en un punto anterior, esta herramienta proporcionada por Google se centra en analizar una serie de puntos que entran en funcionamiento a la hora de cargar la página para determinar su valoración. Pero, ¿cuáles son estos factores a tener en cuenta? A continuación os mostramos los más importantes.

• Optimización de imágenes

Las imágenes son elementos que pueden influir mucho a la hora de cargar una determinada página, ya que si hacemos uso de imágenes muy grandes y pesadas, el servidor tardará más tiempo en mostrar toda la información.

Con este punto, lo que Google pretende es que el usuario haga uso de imágenes más livianas. La propia herramienta se encarga de indicarnos aquellas que se pueden optimizar.

• Eliminar el JavaScript que bloquea la visualización y el CSS del contenido de la mitad superior de la página

Este problema surge cuando la aplicación detecta la presencia de algún código JavaScript que impide la visualización del contenido de la mitad superior de la página. Lo que Google busca con esto es que tanto el CSS como el JavaScript se ejecuten al final, una vez que primero se haya mostrado el contenido para a continuación cargar los “extras” que pueda tener el portal.

• Especificar caché del navegador

El uso de caché puede ayudar a mejorar la velocidad de carga de cualquier web, ya que una vez visitada por un usuario, la velocidad para el próximo que acceda a esa misma información será mucho mayor. Si no hacemos uso de ningún tipo de cacheo en nuestro portal, PageSpeed Insights lo detecta informándonos de esta situación.

• Habilitar la compresión

Este punto hace referencia a la posibilidad de haber utilizado algún método para la compresión de las respuestas emitidas a una petición HTTP, pero que no se ha llevado a cabo. Para comprimir estas respuestas, se suele habilitar las tecnologías gzip o deflate, siempre y cuando el servidor las tengan habilitadas.

• Minificar archivos HTML, CSS y JS

El término minificar hace referencia a compactar el código que forma parte de estos archivos. Al compactarlos, lo que se consigue es reducir su tamaño y por tanto tardar menos tiempo en ser procesados, lo que se traduce en una carga más rápida.

• Priorizar el contenido visible

En este caso, lo que Google busca es que se cargue de la forma más rápida posible la información que se mostrará en la mitad superior del portal, y que además sea esta la información más importante para el usuario. De esta forma, mientras que el visitante está visualizando esos datos, el resto del portal se podrá cargar sin afectar al contenido.

• Optimizar el tiempo de carga del servidor

El buen funcionamiento del servidor donde esté alojada nuestra web también influirá a la hora de la valoración de esta herramienta. Google ha establecido que una respuesta superior a 200 ms no es buena, por lo que si se supera ese tiempo, la valoración será negativa.

Elementos que analiza para la versión móvil

En una sociedad donde los dispositivos móviles tienen cada vez mayor importancia, es de esperar que Google también los analice en busca de mejorar la carga de la web. En este caso, además de las explicadas en el punto anterior, nos ofrece otra serie de consejos que nos podrían ayudar a conseguir nuestro objetivo.

• Tamaño adecuado para botones táctiles

 Este mensaje lo suele dar cuando detecta la presencia de botones demasiado pequeños que puede entorpecer la experiencia del usuario. Hay que recordar que nuestros dedos no son tan precisos como puede ser la flecha del ratón, por lo que se recomiendan que este tipo de elementos tengan un tamaño adecuado.

• Diseño responsive

 Se trata de algo muy importante para Google ya que busca que en todo momento el diseño del portal se adapte a la perfección al tamaño del dispositivo. No contar con un diseño responsive, afectará muy negativamente al posicionamiento de nuestro sitio.

• Tamaño de fuente demasiado pequeño

Un tamaño de letra demasiado pequeño puede hacer que el usuario no sea capaz de leer lo que se muestra en el sitio. En este aspecto, Google recomienda hacer uso de un tamaño de letra de 16 px, aunque podría ser mayor en determinados casos.