Technical SEO

Cómo mejorar la velocidad de página

13 min de lectura

La velocidad de página es un factor tanto de ranking como de experiencia de usuario. Las páginas lentas pierden visitantes, reducen conversiones y tienen un ranking más bajo en los resultados de búsqueda. Las investigaciones de Google muestran que cuando el tiempo de carga pasa de 1 a 3 segundos, la probabilidad de rebote aumenta en un 32%. Esta guía cubre las optimizaciones de mayor impacto para hacer que tu sitio sea más rápido.

learn.sections.stepByStep

Benchmark Current Performance

Test your key pages using PageSpeed Insights, WebPageTest, and Chrome DevTools. Record your current metrics: Time to First Byte (TTFB), Largest Contentful Paint (LCP), total page weight, and number of requests. Test multiple page types: homepage, category pages, product pages, and blog posts.

Optimize Images

Images typically account for 50-70% of page weight. Convert to WebP or AVIF formats, serve responsive sizes using srcset, compress without visible quality loss, and lazy-load below-the-fold images. A single unoptimized hero image can add 2-3 seconds to your LCP.

Reduce and Optimize JavaScript

Audit your JavaScript bundles to identify and remove unused code. Split large bundles with code splitting so users only download what they need. Defer non-critical scripts, move analytics and tracking to load after the page is interactive, and consider lighter alternatives to heavy libraries.

Optimize CSS Delivery

Inline critical CSS needed for above-the-fold rendering directly in the HTML. Load the rest asynchronously. Remove unused CSS rules -- most sites ship 10-20x more CSS than any single page uses. Minify all stylesheets and combine small files to reduce HTTP requests.

Implement Server-Side Optimizations

Reduce Time to First Byte by enabling server-level caching, using a CDN, and optimizing database queries. Enable gzip or Brotli compression for text-based assets. Set proper cache headers so returning visitors don't re-download unchanged resources.

Optimize Web Fonts

Fonts can block text rendering for seconds. Use font-display: swap to show fallback text immediately. Subset fonts to include only the characters you use. Self-host fonts instead of loading from third-party CDNs to reduce DNS lookups and leverage your existing caching.

Evaluar el rendimiento actual

Prueba tus páginas clave usando PageSpeed Insights, WebPageTest y Chrome DevTools. Registra tus métricas actuales: Time to First Byte (TTFB), Largest Contentful Paint (LCP), peso total de la página y número de peticiones. Prueba múltiples tipos de páginas: página de inicio, páginas de categorías, páginas de productos y entradas de blog.

Optimizar imágenes

Las imágenes suelen representar entre el 50 y el 70% del peso de la página. Convierte a formatos WebP o AVIF, sirve tamaños responsivos usando srcset, comprime sin pérdida de calidad visible y utiliza lazy-load para las imágenes que están debajo del pliegue (below-the-fold). Una sola imagen hero sin optimizar puede añadir de 2 a 3 segundos a tu LCP.

Reducir y optimizar JavaScript

Audita tus bundles de JavaScript para identificar y eliminar código sin usar. Divide los bundles grandes mediante code splitting para que los usuarios solo descarguen lo que necesitan. Aplaza scripts no críticos, carga el análisis y rastreo después de que la página sea interactiva, y considera alternativas más ligeras a las librerías pesadas.

Optimizar la entrega de CSS

Inlinea el CSS crítico necesario para el renderizado inicial (above-the-fold) directamente en el HTML. Carga el resto de forma asíncrona. Elimina las reglas CSS no utilizadas: la mayoría de los sitios envían de 10 a 20 veces más CSS del que usa cualquier página individual. Minifica todas las hojas de estilo y combina archivos pequeños para reducir las peticiones HTTP.

Implementar optimizaciones del lado del servidor

Reduce el Time to First Byte habilitando caché a nivel de servidor, usando una CDN y optimizando las consultas a la base de datos. Habilita la compresión gzip o Brotli para recursos basados en texto. Configura encabezados de caché adecuados para que los usuarios recurrentes no tengan que volver a descargar los recursos que no han cambiado.

Optimizar las web fonts

Las fuentes pueden bloquear el renderizado de texto durante segundos. Usa font-display: swap para mostrar texto de respaldo inmediatamente. Crea subconjuntos de fuentes para incluir solo los caracteres que utilizas. Aloja las fuentes localmente en lugar de cargarlas desde CDNs de terceros para reducir las búsquedas DNS y aprovechar tu caché existente.

Consejos pro

Start with your highest-traffic pages. Optimizing your top 10 pages by traffic usually delivers more impact than optimizing your entire site, and you learn which techniques work best for your stack.
Set a performance budget: maximum 200KB JavaScript, 500KB total page weight, and 3-second LCP. Enforce these in your build pipeline to prevent regressions.
Use the Coverage tab in Chrome DevTools to find unused CSS and JavaScript. Most sites can eliminate 30-50% of their CSS payload this way.
Comienza por las páginas con más tráfico. Optimizar tus 10 páginas principales por tráfico suele tener más impacto que optimizar todo el sitio, y así aprenderás qué técnicas funcionan mejor para tu stack tecnológico.
Establece un presupuesto de rendimiento: máximo 200KB de JavaScript, 500KB de peso total de página y un LCP de 3 segundos. Aplica esto en tu pipeline de construcción para evitar regresiones.
Usa la pestaña Coverage en Chrome DevTools para encontrar CSS y JavaScript sin usar. La mayoría de los sitios pueden eliminar del 30 al 50% de su carga CSS de esta manera.

Errores comunes a evitar

Compressing without resizing images

Compressing a 4000x3000 pixel image to WebP helps, but serving a 400x300 pixel version saves 10x more bandwidth. Always resize images to the maximum display size before compressing.

Loading everything in the head

Placing all scripts and stylesheets in the HTML head blocks rendering. Only critical resources should load in the head. Move everything else to the end of the body or load it asynchronously.

Over-relying on CDN caching

A CDN speeds up delivery but doesn't fix a slow origin server or bloated page. If your page generates in 2 seconds on the server and the CDN cache expires every 5 minutes, most users still experience the slow origin response.

Comprimir sin redimensionar imágenes

Comprimir una imagen de 4000x3000 píxeles a WebP ayuda, pero servir una versión de 400x300 píxeles ahorra 10 veces más ancho de banda. Redimensiona siempre las imágenes al tamaño máximo de visualización antes de comprimir.

Cargarlo todo en el head

Colocar todos los scripts y hojas de estilo en el head del HTML bloquea el renderizado. Solo los recursos críticos deben cargarse en el head. Mueve todo lo demás al final del body o cárgalo de forma asíncrona.

Depender demasiado del caché de CDN

Una CDN acelera la entrega pero no soluciona un servidor de origen lento o una página pesada. Si tu página se genera en 2 segundos en el servidor y el caché de la CDN expira cada 5 minutos, la mayoría de los usuarios seguirán experimentando la respuesta lenta del origen.

Cómo Keyword Kick lo hace sencillo

Automated page speed testing across all site pages with specific optimization recommendations
Historical performance tracking to measure the impact of speed improvements over time
Core Web Vitals monitoring that connects speed metrics to ranking changes
Pruebas de velocidad de página automatizadas en todas las páginas con recomendaciones de optimización específicas
Seguimiento histórico del rendimiento para medir el impacto de las mejoras de velocidad a lo largo del tiempo
Monitoreo de Core Web Vitals que conecta las métricas de velocidad con los cambios en el ranking

learn.sections.faq

How fast should my website load?

Aim for a Largest Contentful Paint under 2.5 seconds and a Time to First Byte under 600 milliseconds. For e-commerce sites, every additional second of load time reduces conversions by approximately 7%. Faster is always better, but these thresholds satisfy Google's performance requirements.

Does page speed really affect SEO rankings?

Yes. Page speed is a confirmed ranking factor, and Core Web Vitals are part of Google's Page Experience signals. In competitive niches where content quality is similar, faster sites consistently outrank slower ones.

Which has more impact: server speed or front-end optimization?

It depends on your current bottleneck. If your TTFB is over 1 second, server optimization will have the biggest impact. If TTFB is fast but LCP is slow, front-end optimizations (images, CSS, JavaScript) will help more. Test both to identify your specific bottleneck.

¿Qué tan rápido debería cargar mi sitio web?

Intenta lograr un Largest Contentful Paint menor a 2.5 segundos y un Time to First Byte menor a 600 milisegundos. Para sitios de e-commerce, cada segundo adicional de tiempo de carga reduce las conversiones aproximadamente en un 7%. Más rápido siempre es mejor, pero estos umbrales satisfacen los requisitos de rendimiento de Google.

¿La velocidad de página realmente afecta los rankings de SEO?

Sí. La velocidad de página es un factor de ranking confirmado, y los Core Web Vitals son parte de las señales de Page Experience de Google. En nichos competitivos donde la calidad del contenido es similar, los sitios más rápidos superan constantemente a los más lentos.

¿Qué tiene más impacto: la velocidad del servidor o la optimización del front-end?

Depende de tu cuello de botella actual. Si tu TTFB es mayor a 1 segundo, la optimización del servidor tendrá el mayor impacto. Si el TTFB es rápido pero el LCP es lento, las optimizaciones del front-end (imágenes, CSS, JavaScript) ayudarán más. Prueba ambos para identificar tu cuello de botella específico.

learn.cta.button