¿Cómo medir y mejorar la velocidad de carga de un sitio web?

El WPO o, en español, optimización del rendimiento web, exige un alto nivel de detalle técnico y por ello es considerada una de las especialidades más exigentes dentro del área SEO. Aquí van algunas de las claves para tener la velocidad de carga de tu web y su rendimiento bajo control.

💡 Te puede interesar: WPO para WordPress

¿Qué es el WPO?

WPO son las siglas en inglés de Web Performance Optimization, todas aquellas técnicas aplicadas a un sitio web para mejorar su velocidad de carga web y hacer un uso más eficiente de los recursos que la componen.

Dentro del SEO técnico hay auténticos expertos en esta materia por el nivel de detalle y de dedicación en investigación y ensayos en servidores locales que conlleva (una vez más, en SEO no hay magia, sino muchas horas de prueba y error), así que no es de extrañar que se haya hablado tanto de esta materia.

Sin embargo, sigue siendo un aspecto árido y, quizá por ello, muchos responsables de webs no suelen prestarle la atención que se merece. Esperamos que este post te sirva para aclarar algunos conceptos y perder miedo a implementar mejoras que repercutirán en beneficio de tus usuarios.

¿Para qué sirve el WPO?

Se optimiza el rendimiento de un sitio web porque influye directamente en la experiencia del usuario. De nada sirve obsesionarse con las métricas del pasado: la generalización del uso de smartphones ha conllevado la necesidad de acceder a páginas más veloces, más notoria que cuando se accedía mayoritariamente a través del ordenador con conexiones estables de internet, así que los niveles de optimización han incrementado su exigencia.

Por ello, Google siempre remarca que el centro de la estrategia SEO radique en el usuario y no le falta razón: de nada te sirve buscar atajos para mejorar una puntuación en una herramienta concreta si no va a mejorar la percepción de tu potencial cliente cuando entra a tu web.

Herramientas para optimizar el WPO

Existen múltiples maneras en las que un consultor SEO puede analizar el rendimiento de un sitio web, pero la implementación implica casi siempre la labor de un desarrollador para asegurarse de que los cambios no afecten a otros aspectos de la web. Así que si estás pensando en mejorar el WPO, pero no tienes conocimientos de programación, te aconsejamos que acudas a un SEO experto o a un programador para evaluar el impacto de las modificaciones que te propongan las herramientas de análisis.

En primer lugar, hay que acudir a las herramientas oficiales de Google:

• Google Search Console (en sus apartados de Web Core Vitals, experiencia en la página y usabilidad móvil). Te servirá para tener una primera idea del estado actual de tu web.
• PageSpeed Insights. Otro aliado indispensable con datos recogidos por los navegadores de Chrome de los usuarios de forma anónima. Diagnostica los principales problemas de rendimiento y también ofrece consejos de mejora. Eso sí: no tenemos control de desde dónde se hace la prueba, y si es un sitio alejado de donde está el servidor, puede que la información no sea del todo fiable.
• Lighthouse. Es un software de código abierto que te ayuda a mejorar la calidad de las páginas individuales de la web en términos de rendimiento, accesibilidad y SEO. También resume las principales oportunidades de mejora.

💡 Descubre más sobre estas herramientas: Guía Google Search Console

Pero hay otras muchas herramientas SEO que pueden ayudar a complementar o ver cómo rinde una web desde otros lugares, de especial interés si tienes alojado tu sitio web en un país diferente.

La localización influye y hay que intentar medir desde un lugar lo más cercano a la ubicación del hosting, independientemente de que uses CDN:

• • GTMetrix. Con varias opciones de análisis (ubicaciones y tipos de bot) y una útil visualización por tramos de la carga de la página para ver las diferentes métricas en acción. Si quieres saber más detalles sobre el tema de las ubicaciones te recomendamos este vídeo:
    

• Pingdom. Una de las herramientas clásicas para medir el WPO, su mayor valor actualmente es que permite elegir entre varios países para hacer el test.

Core Web Vitals

Cuando Google empezó a hablar de este concepto en 2020, lo que hizo realmente fue dar más peso a aquellas métricas que considera más importantes de cara al rendimiento, pero no supone en la práctica nada nuevo.

Miden aspectos concretos de la experiencia del usuario (de los que ya hablamos en este post sobre las Core Web Vitals)y aparecen como tal en las herramientas oficiales, aunque algunas sean más propias del campo de UX; de ahí la importancia de estar familiarizados con sus nombres para entender a qué se refieren.

Un punto a favor es que muchas de estas métricas se pueden analizar desde una doble vertiente, ofreciendo una visión más realista del estado de una web. En primer lugar, con datos de laboratorio (la herramienta simula la carga de una página en un entorno controlado) pero también en el campo (en este caso, son usuarios reales que cargan e interactúan con la página).

Principales métricas y sus rangos. Fuente: Web Dev

Métricas a aprender del Core Web Vitals

Estas son las métricas principales:

• LCP (Largest Contentful Paint): Mide rendimiento de carga en sí, el tiempo necesario para el despliegue del contenido más extenso de una página. Para una buena evaluación, debe ser igual o menor a 2,5 segundos desde que la página comienza a cargarse.
• FID (First Input Delay): Mide la interactividad con la página, el tiempo que transcurre desde que un usuario interactúa por primera vez con el sitio web (por ejemplo, haciendo clic en un botón) hasta que el navegador es capaz de responder a dicha interacción. Debe ser menor a 100 milisegundos para obtener una valoración positiva.
• CLS (Cumulative Layout Shift): Mide la estabilidad visual, el tiempo que transcurre sin movimientos inesperados para que el usuario pueda interactuar con la página sin saltos en los elementos que la componen. Una buena puntuación se obtiene con valores iguales o menores a 0,1.

Existen otras métricas relacionadas que también es interesante conocer como las siguientes:

• FCP (First Contentful Paint): Mide el tiempo que transcurre desde que la página comienza a cargar hasta que cualquier parte del contenido de la página se renderiza en la pantalla.
• TTI (Time To Interactive): Mide el tiempo que transcurre desde que la página comienza a cargarse hasta que se renderiza visualmente.
• TBT (Total Blocking Time): Mide el tiempo transcurrido entre la primera carga (FCP) y la renderización (TTI).

¿A cuál prestar más atención? Una vez más acudimos a Google para decidirlo. Si quieres empezar con buen pie, revisa el LCP, aunque ten en cuenta que cualquier script habitual (como puede ser Hotjar) te dará peores valores. Y si tu web contiene mucho código en JavaScript, tendrás que fijarte más en el FID.

Vale, hay un montón de herramientas para medir. Pero, ¿a quién hago caso?

Como todo en SEO, lo mejor es no abrumarse y usar la mejor herramienta de todas: la lógica.

Cuidado con las puntuaciones: cabe recordar que cada herramienta se aproxima de una forma distinta (dando más valor a unos aspectos que otros y analizando de formas diferentes (como hemos visto al hablar de los análisis de campo y de laboratorio pero también en relación a las ubicaciones) y de ahí la diferencia.

Por ello, el principal consejo es reducir el tiempo de carga (de forma objetiva y contrastada) sin preocuparse en exceso por los valores que, a veces, mejoran, pero no tienen por qué tener un impacto real a nivel de posicionamiento SEO web.

Recordamos de nuevo: El WPO se hace para mejorar la experiencia de los usuarios, no para conseguir un 10. Si tienes que anteponer una acción para mejorar la puntuación de WPO perdiendo funcionalidades útiles, no lo hagas.

En su propia documentación oficial, Google hace alusión a esto: haz que tu sitio web cargue mejor para los usuarios. Si tienes curiosidad, puedes consultarlo en este vídeo:

Velocidad de carga: lo que los SEO tienen que saber

Algunas técnicas para mejorar la velocidad de carga de tu web…

…Sin ser un experto.

Estas son las implementaciones básicas que por norma general mejor funcionan y si tienes un CMS tipo WordPress encontrarás varios plugins SEO que te ayudarán:

1. Contrata un servidor web rápido. No castigues a tus usuarios con una experiencia de carga y navegación lenta. Antes de contratar un hosting, infórmate bien de las condiciones para que te garantice una velocidad óptima.
2. Implementar caché. Almacenar las páginas en el caché puede acelerar el tiempo de carga de su página en las visitas habituales. Así, el navegador utilizará su propia copia local en vez de obtenerla de la red. Actívalo en todas aquellas partes de la web donde sea posible (elementos recurrentes sin actualizaciones frecuentes, por ejemplo).
3. Imágenes optimizadas. Recuerda comprimir las imágenes antes de subirlas a la web y recortarlas al tamaño adecuado para que no se pierda tiempo cargando recursos mayores a lo necesario. Especifica sus dimensiones en el código fuente( atributos width y height). Y no te olvides del responsive:
   
4. Lazy load. Pospón la carga de todas las imágenes que no se vean en pantalla y evitarás un gasto innecesario de recursos.
5. CDN. Se trata de una red de distribución de contenido que balancea la carga de los recursos mediante un conjunto de servidores ubicados en diferentes puntos de una red con copias locales. Si un usuario se conecta, se llama al servidor más cercano a él y esto agiliza la carga.

Existen otras optimizaciones de mayor carácter técnico que son recomendables que supervise un experto, como los que aplican a:

• Archivos CSS (se pueden minimizar, pero también posponer su carga siempre y cuando no afecte a la experiencia del usuario).
• Archivos JavaScript (similar al anterior, para profundizar en este concepto te dejamos dos vídeos oficiales:
  

• Compresión GZIP (para comprimir los recursos de una página web antes de que se sirvan al navegador, esto se puede hacer a través del panel de control del hosting o accediendo directamente al archivo .htaccess, de ahí la importancia de que lo haga un especialista).

Dependiendo del tipo de tecnología (CMS o desarrollo a medida) no se optimiza de igual manera una web que otra, así que es importante elegir aquellas acciones con mayor impacto para cada caso y asumir las limitaciones que pueda haber.

En agenciaSEO.eu trabajamos de forma habitual todas las áreas SEO técnicas, incluido el WPO para que nuestros clientes ofrezcan la mejor experiencia a sus usuarios analizando cada sitio web de forma individualizada. ¿Te echamos una mano para lograr tus objetivos? ¡Contacta con nosotros!

Bibliografía adicional:
Definición de los umbrales de las métricas de Core Web Vitals (documentación oficial de Google)

Cómo obtener tiempos de carga rápidos (documentación oficial de Google)

¿Cómo calcula Lighthouse la puntuación global de rendimiento? (documentación oficial de Google -inglés-)

Optimización de métricas concretas (blog de Álvaro Fontela, uno de los máximos expertos de WPO de España)