Cómo tener un sitio web con más de 99 puntos de velocidad

Un sitio con más de 99 puntos de velocidad se consigue con cuatro decisiones claves: servir el HTML de tu sitio ya construido en lugar de armarlo en el navegador, entregar las imágenes en formato moderno y al tamaño exacto en que se muestran (no superar los 300 a 400 kb es nuestra norma), alojar las fuentes (tipografías) en tu propio dominio y cargar solo el JavaScript que la página realmente usa. No es un ajuste que se hace al final, sino que debe ser la forma en que el sitio se construye desde el primer día.

Qué mide realmente el puntaje de PageSpeed

El puntaje de PageSpeed Insights (herramienta oficial de Google) resume las Core Web Vitals, las métricas con las que Google evalúa la experiencia de carga. En resumen, son tres metricas las que mandan:

• LCP (Largest Contentful Paint): cuánto tarda en pintarse el elemento más grande de la pantalla. Un resultado positivo, o en verde, es por debajo de 2,5 segundos.
• INP (Interaction to Next Paint): cuánto tarda la página en responder cuando el usuario toca algo. Verde por debajo de 200 milisegundos.
• CLS (Cumulative Layout Shift): cuánto salta el contenido mientras carga (esos glitches raros que pareciera que hacen “mover” la página mientras carga). Verde por debajo de 0,1.

Un sitio puede «verse rápido» y estar rojo en las tres. Y el costo no es solo de posicionamiento, pues cada segundo extra de carga es una parte de las visitas que abandonan antes de ver la oferta, producto o servicio de tu página, con especial castigo en el celular, donde llega la mayoría del tráfico pagado.

Renderizado estático es la decisión que más pesa

La mayoría de los sitios lentos son lentos por diseño, desde la base; un constructor visual o un tema recargado arma la página en el navegador del visitante, con decenas de scripts que se descargan y ejecutan antes de mostrar nada (muy común en sitios hechos en Wordpress bajo el método equivocado, temas prediseñados, plantillas pesadas y plugins innecesarios).

El enfoque contrario es el renderizado estático, lo que significa que cada página se construye una sola vez, en el servidor, y el visitante recibe HTML terminado. No hay que esperar a ningún script para leer el contenido. Frameworks como Astro o Next.js en modo estático trabajan así, y es la base sobre la que construimos las webs de nuestros clientes.

Imágenes: las peso pesado de los sitios web

En un sitio típico, las imágenes pesan más que todo lo demás junto. Tres reglas las ponen a dieta 😄:

1. Formato moderno. WebP o AVIF pesan una fracción de un JPG o PNG equivalente sin pérdida visible.
2. Tamaño real. Una foto de 4000 píxeles mostrada en una tarjeta de 400 es ancho desperdiciado; hay que servir cada imagen al tamaño en que se ve, con variantes por pantalla (srcset).
3. Carga diferida. Lo que está bajo el pliegue se carga cuando el usuario se acerca (loading="lazy"), no antes. La imagen del hero es la excepción: esa se precarga, porque suele ser el LCP.

Fuentes y JavaScript: los dos frenos silenciosos

Fuentes. Cargarlas desde un servicio externo agrega una conexión más antes de poder pintar texto. Alojarlas en el propio dominio, en formato WOFF2 variable y con font-display: swap, elimina esa espera y el parpadeo de texto invisible.

JavaScript. Cada script adicional compite por el procesador del teléfono del visitante. La regla es cargar solo lo que la página usa, diferir lo que no bloquea y ser implacable con los scripts de terceros: cada píxel de medición, chat y widget se paga en INP. Los que sobreviven a esa revisión pueden cargarse fuera del hilo principal con herramientas como Partytown o el modo de carga diferida del propio gestor de etiquetas.

Cómo comprobarlo (y no engañarse)

Mide con PageSpeed Insights en la pestaña celular, que es la exigente, y mira las dos secciones: el diagnóstico de laboratorio y, cuando existe, los datos reales de usuarios de los últimos 28 días. Un truco que vemos seguido: medir solo la home. Las páginas que reciben el tráfico de campañas y las fichas de producto o servicio importan más que la portada.

Cierre

La velocidad no es una medalla técnica: es la primera condición para que el resto del marketing rinda, porque todo clic que pagas o posicionas aterriza ahí. Si tu web actual no pasa la prueba, en nuestra página del servicio de desarrollo web explicamos cómo construimos sitios que sí lo hacen, y cómo eso se conecta con SEO y campañas que convierten.