¡Ayuda! Quiero optimizar la puntuación de mi sitio web

Hace poco un cliente se acercó a nosotros porque quería mejorar la velocidad de su sitio web pues en el sitio de google pagespeed insights (una herramienta automatizada de Google para analizar tus sitios web y ayudarte a mejorar "la velocidad de tus páginas web en todos los dispositivos") la puntuación que tenía era pésima. En este artículo quiero explicar un poco más acerca de esta situación que resulta ser muy común.

¿Por qué es importante la velocidad de tu sitio web?

La razón es, en realidad, una única y absoluta:

AFECTA 👏 TUS 👏 VENTAS 👏

Déjame expandir un poco en esto.

UX

Afecta la experiencia de usuario: todos sabemos lo frustrante que es esperar que un sitio web cargue lentamente. Según estudios un tiempo de carga de 1 segundo hace que la experiencia sea optima, pero cualquier tiempo arriba de esto incrementa la probabilidad de perder al usuario. Un usuario que se va es un cliente/venta menos.

SEO

La velocidad de tu sitio también impacta tu SEO. Google ha indicado oficialmente que la velocidad de un sitio afecta a su algoritmo de posicionamiento, e investigaciones han comprobado que quizá específicamente mida el tiempo del primer byte (ver más aquí). Esto quiere decir que si hay dos sitios con exactamente la misma puntuación respecto a todo para una búsqueda, pero uno es más rápido que le otro, el más rápido saldrá en la mejor posición. Quizá llegue un punto donde incluso el más rápido salga antes aun teniendo peor puntuación en otras áreas.

SEM

Al igual que con el SEO, tu publicidad también se ve afectada negativamente si la velocidad de tu sitio web es mala. Esto lo sabemos porque hay 3 factores que google toma en cuenta para la subasta de anuncios y uno de ellos es el "quality score" el cual contempla la experiencia en el landing page o en otras palabras, se ve afectada por la velocidad.

Pero ¿Qué es realmente la velocidad de mi sitio web?

La velocidad de un sitio web es su propia disciplina (quizá un tanto subjetiva) que mide diferentes factores como tiempo al primer byte, tiempo de carga completa, tiempo a interacción y muchos otros. Podemos ver el resultado de un análisis de otra herramienta para medición de velocidad, curiosamente basada en la misma tecnología de google LightHouse: GTmetrix.

Todos estos componentes definen lo que se conoce como velocidad de un sitio. Veamos qué significa uno a uno:

• Duración de redireccionamiento: Este es el tiempo dedicado a redirigir las URL antes de que se cargue la página HTML final.
• Tiempo al primer byte: Esta es la cantidad total de tiempo desde el inicio de la solicitud hasta que recibimos el primer byte de la respuesta.
• Primer pintado: Este momento es el primer punto en el que el navegador realiza algún tipo de representación en la página.
• Tiempo de conexión: Este es el tiempo dedicado a conectarse al servidor, después de todos los redireccionamientos, para realizar la solicitud a la página.
• Tiempo a DOM interactivo: Este momento es cuando el navegador ha terminado de cargar y analizar HTML, y se ha creado el DOM.
• Tiempo a "onload": Este tiempo ocurre cuando se completa el procesamiento de la página y todos los recursos de la página han terminado de descargarse.
• Tiempo en el servidor: Este es el tiempo que tarda el servidor en generar la respuesta inicial.
• Tiempo a carga de DOM: Este es el momento en el que el DOM está listo y no hay hojas de estilo que bloqueen la ejecución de JavaScript.
• Tiempo de carga completa: Este es el tiempo máximo después de que FCP y Onload se hayan activado, y haya estado inactiva la red y la CPU (5,25 s cada una) después de que se haya capturado la última solicitud.

¿Qué debo hacer para mejorar la velocidad de mi sitio web?

Lo primero que quiero dejar claro es que NUNCA se debe establecer como objetivo el "mejorar la velocidad" como tal, el objetivo debe ser hacer el mejor sitio web para vender... y que este sitio sea lo más rápido posible. La diferencia es sutil pero si establecemos como objetivo mejorar la velocidad únicamente, en muchas ocasiones tendremos que sacrificar funcionalidad y otros aspectos. Ejemplos claros de esto son los resultados de sitios (muy) populares de venta:

¡Oh la ironía! Muchos emprendedores, mercadólogos y gerentes se estresan y preocupan mucho por su puntuación de rendimiento en Google PageSpeed Insights, sin embargo esto al final no es indicativo de los resultados comerciales que se estarían obteniendo.

Tips para mejorar la velocidad

Se minimalista

En Webifica somos amantes de la EFICIENCIA, por lo que nos encanta esta frase:

La perfección se alcanza no cuando ya no hay nada que agregar, sino cuando ya no hay nada que pueda quitarse.

Antoine de Saint-Exupery

Lo primero que debes hacer es quitar todo lo que puedas de tu sitio web, si no te ayuda a vender ¡quítalo!

Infraestrucutra

Si tu proveedor de sitio web es experto, o tienes un experto manteniendo tu infraestructura, esto no debería ser un problema. Sin embargo siempre es bueno validar que estés montado sobre una infraestructura sólida de diferentes servicios como por ejemplo:

• Utilizar un VPS o hosting apropiado.
• Utilizar un tecnología de servidor eficiente (apache vs litespeed)
• Utilizar sistemas de Cache

Es muy común que proveedores de sitios web utilicen una infraestructura diseñada para sitios web personales (como godaddy y otros "shared hosting") para alojar sus sitios web para empresas, pero esto es una pésima práctica y casi siempre termina impactando la seguridad, disponibilidad, y velocidad de tu sitio web.

Imágenes y medios

Este es quizá el elemento más pesado en un sitio web. Asegúrate que todas tus imágenes sean optimas

• Comprime tus imágenes utilizando herramientas automatizadas o manuales como squoosh.app
• Recorta tus imágenes al tamaño necesario, no incluyas imágenes grandes si se desplegaran en un área pequeña.
• Integra tus vídeos de plataformas streamming como youtube o vimeo en lugar de alojarlo dentro de tu sitio web.

Diseño

Asegurate que tu sitio web sea diseñado con una herramienta eficaz que permita un buen balance entre flexibilidad de diseño y rendimiento. Recuerda que entre más complejo tu diseño, más pesado será y peor tu velocidad.

CDN

Utiliza un CDN o red de entrega de contenido por sus siglas en inglés. Esto permite que mucho de la carga de tu sitio web sea realizada desde servidores más cercanos a tus clientes y descargará tu servidor web para responder rápidamente a más clientes.

Conclusión

La velocidad de tu sitio web debe importarte, especialmente en tus landing pages y páginas de productos si vendes productos, pero tu sitio web solo debe ser lo más rápido que pueda ser, y no debes preocuparte por lograr una puntuación perfecta.

Utiliza resultados de herramientas como Google PageSpeed Insights y GTmetrix con un granito de sal para implementar lo que es conveniente y lo que no.

Recuerda que siempre debes revisar que tengas bases de infraestructura sólida, un sistema y diseño web óptimo, y utilices medios como imágenes y vídeos de forma correcta.