Haces una prueba de velocidad en tu web y los resultados te dan una puntuación, una lista de recomendaciones y casi ninguna indicación de por dónde empezar. Saber cómo acelerar una web significa entender qué mejoras actúan sobre qué partes de la secuencia de carga y cuáles dan los mejores resultados para el esfuerzo que cuestan. Este artículo explica los cambios más eficaces, en qué orden abordarlos y qué puede esperar de cada mejora una web típica de un pequeño negocio.
La velocidad de una web no se mejora con una sola corrección. Es el resultado de varios factores independientes que actúan juntos: lo pesada que es la página, lo rápido que responde el servidor, lo eficiente que es la entrega de los archivos y cuánto trabajo debe hacer el navegador para mostrar lo que ve el visitante. Atender primero a los mayores contribuyentes da las ganancias más rápidas. Para conocer qué métricas de carga importan y por qué, consulta el artículo sobre qué es el tiempo de carga de una página y cómo se mide.
¿Cuáles son las causas más comunes de los tiempos de carga lentos de una web?
Antes de hacer cambios, conviene entender dónde se está perdiendo realmente el tiempo. Las webs lentas casi siempre tienen en común uno o más de estos puntos.
Imágenes sin optimizar
- Las imágenes son los archivos más grandes de la mayoría de las páginas y la causa más común de tiempos de carga lentos
- Una página con cinco fotografías sin comprimir puede pesar de diez a veinte veces más de lo necesario
- Arreglar las imágenes suele dar la mayor mejora de velocidad de cualquier cambio individual
Sin caché configurada
- Sin caché, cada visita obliga al servidor a reconstruir la página y al navegador a descargar cada archivo desde cero
- La caché permite que los visitantes que vuelven carguen las páginas desde copias guardadas en lugar de volver a descargarlo todo
Archivos de código sin minificar
- Los archivos CSS y JavaScript suelen contener espacios, comentarios y formato que los hacen legibles para los desarrolladores pero añaden peso innecesario para los navegadores
- La minificación elimina ese exceso y reduce el tamaño de los archivos, a veces entre un 30 y un 50 por ciento
Respuesta lenta del servidor
- Todo espera al servidor. Si el servidor tarda más de 800 milisegundos en responder, cualquier otra métrica se retrasa desde el principio
- Los entornos de hosting compartido y las bases de datos sin optimizar son las causas más comunes de un Time to First Byte alto
Recursos que bloquean el renderizado
- Los scripts y hojas de estilo cargados en la cabecera del documento detienen al navegador antes de que pueda mostrar nada
- Mover los scripts no críticos para que carguen después del contenido principal elimina este cuello de botella
¿Cómo se optimizan las imágenes para reducir el peso de la página?
La optimización de imágenes es la solución de mayor impacto para la mayoría de las webs, porque reduce directamente los archivos más grandes de la página. Tres cambios juntos producen la reducción más significativa en el tamaño de las imágenes.
Elige el formato adecuado
- WebP produce archivos más pequeños que JPEG con la misma calidad visual y admite transparencia como PNG
- Pasa a WebP para todas las fotografías y los gráficos generales. Usa PNG solo cuando haga falta transparencia
Redimensiona antes de subir
- Subir una imagen de 4.000 píxeles de ancho para mostrarla a 800 píxeles obliga a cada visitante a descargar cuatro veces más datos de los necesarios
- Redimensiona las imágenes a su ancho máximo de visualización antes de subirlas
Comprime a un nivel de calidad adecuado
- Un ajuste de calidad de 75 a 85 en formatos con pérdida produce archivos entre un 60 y un 80 por ciento más pequeños que el original, sin diferencia de calidad visible en la mayoría de las fotografías
- La combinación del formato correcto, el tamaño correcto y una compresión adecuada puede reducir el peso de las imágenes de una página entre un 80 y un 90 por ciento
Para ver una guía completa sobre formatos de archivo, tipos de compresión, carga diferida e imágenes adaptables, consulta el artículo sobre cómo optimizar las imágenes para que carguen más rápido.
¿Cómo reduce la caché el tiempo de carga?
La caché guarda copias de los recursos de la página para que no haya que descargarlos ni regenerarlos en cada petición. Hay dos tipos que actúan en puntos distintos de la cadena de entrega.
Caché del navegador
- El navegador del visitante guarda CSS, JavaScript, imágenes y fuentes tras la primera visita
- Las visitas siguientes cargan esos archivos desde el dispositivo local en lugar de descargarlos otra vez, lo que reduce mucho el tiempo de carga para los visitantes que repiten
- La caché del navegador se controla con cabeceras de caché configuradas en el servidor. La mayoría de las plataformas de hosting modernas las configuran automáticamente
Caché del servidor
- El servidor guarda versiones de las páginas ya generadas para no tener que reconstruirlas desde cero en cada petición
- Esto acelera el Time to First Byte para todos los visitantes, incluidos los que llegan por primera vez
- La caché del servidor es más eficaz en las webs dinámicas, donde las páginas se generan a partir de consultas a la base de datos
Para ver una explicación detallada de cómo funciona la caché del navegador y cómo configurarla, consulta el artículo sobre qué es la caché del navegador y cómo funciona.
¿Qué hace la minificación por la velocidad de carga?
Los archivos CSS y JavaScript escritos por desarrolladores contienen espacios, saltos de línea y comentarios que hacen el código más fácil de leer y mantener. Los navegadores no necesitan nada de eso. La minificación lo elimina y produce archivos más pequeños que se descargan más rápido sin cambiar su funcionamiento.
- La minificación de CSS suele reducir el tamaño del archivo entre un 20 y un 30 por ciento
- La minificación de JavaScript puede reducir el tamaño entre un 30 y un 50 por ciento, y más en archivos grandes con muchos comentarios y espacios
- La minificación es una de las ganancias más fáciles porque no exige cambios en el aspecto ni en el funcionamiento de la web y a menudo se puede activar con un plugin o un ajuste de la plataforma
Para ver el desglose completo de cómo funciona la minificación en CSS, JavaScript y HTML, consulta el artículo sobre qué es la minificación y cómo ayuda a tu web.
¿Cómo reduce una CDN el tiempo de carga para los visitantes?
Una red de distribución de contenido (CDN) reduce la distancia física entre el visitante y el servidor que entrega tus archivos. Sin una CDN, todos los visitantes se conectan a un servidor en una ubicación. Con una CDN, cada visitante recibe los archivos desde el servidor más cercano a él.
- Para los visitantes cercanos al servidor de origen, la mejora de velocidad de una CDN es modesta
- Para los visitantes de otros países o regiones, una CDN puede reducir el Time to First Byte en cientos de milisegundos
- Las CDN son más eficaces en webs con público internacional o con mucho contenido multimedia
- Algunas plataformas de hosting incluyen la entrega por CDN automáticamente. Cuando está incluida, no hace falta ninguna configuración adicional
Para ver una explicación completa de cómo funcionan las CDN y quién necesita una, consulta el artículo sobre qué es una CDN y cómo ayuda a tu web.
¿Qué es la carga diferida y cómo reduce el tiempo de carga inicial?
La carga diferida (lazy loading) retrasa la descarga de imágenes y otros recursos que quedan por debajo del pliegue hasta que el visitante se desplaza cerca de ellos. Esto reduce la cantidad de datos que el navegador necesita descargar antes de que la página sea utilizable.
- En una página con veinte imágenes, la carga diferida significa que el navegador descarga solo las tres o cuatro imágenes visibles en pantalla cuando la página se abre por primera vez
- Las imágenes restantes cargan a medida que el visitante se desplaza, repartiendo la descarga en el tiempo en lugar de concentrarla al principio
- La carga diferida mejora directamente el Time to Interactive y puede tener un efecto notable en el Largest Contentful Paint cuando el contenido por encima del pliegue no tiene muchas imágenes
- No apliques la carga diferida a las imágenes por encima del pliegue. Esas deben cargar de inmediato
Para ver una guía completa sobre cómo funciona la carga diferida y cómo implementarla, consulta el artículo sobre qué es la carga diferida y cómo funciona.
¿Cómo ralentizan una página los recursos que bloquean el renderizado?
Cuando un navegador encuentra un script o una hoja de estilo en la cabecera del documento, detiene el renderizado hasta que ese archivo termina de cargar. El visitante no ve nada mientras tanto. A esto se le llama recurso que bloquea el renderizado.
Cómo reducir el bloqueo del renderizado
- Mueve el JavaScript no crítico para que cargue al final del documento o usa el atributo
deferoasyncpara que los scripts no detengan el renderizado - Identifica qué CSS se necesita de inmediato (estilos por encima del pliegue) y cuál se puede cargar después
- Elimina o sustituye los scripts de terceros que no sean esenciales. Los widgets de chat, los contenidos incrustados de redes sociales y los scripts de seguimiento añaden tiempo de bloqueo
¿Y el tiempo de respuesta del servidor?
Cualquier otra mejora queda limitada por la rapidez con que responde el servidor desde el principio. Un servidor lento añade retraso antes de que el navegador pueda empezar a cargar ningún recurso.
Qué afecta al tiempo de respuesta del servidor
- Calidad del hosting: los entornos de hosting compartido reparten CPU y memoria entre muchas webs, lo que causa tiempos de respuesta impredecibles
- Rendimiento de la base de datos: las consultas lentas o sin optimizar retrasan la capacidad del servidor de generar una respuesta
- Caché del servidor: sin caché, cada petición provoca una reconstrucción completa de la página desde la base de datos
- Distancia geográfica al servidor: incluso antes de usar una CDN, un servidor lejos del visitante añade latencia
Un buen Time to First Byte es inferior a 800 milisegundos. Si tu TTFB está de forma constante por encima, mejorar el hosting o implementar la caché del servidor dará ganancias que ninguna optimización del lado del visitante puede igualar.
¿Por dónde se empieza a acelerar una web?
Si estás trabajando en mejoras de velocidad por primera vez, este orden da las ganancias más rápidas con el menor esfuerzo en una web típica de un pequeño negocio.
Orden de prioridad para la mayoría de las webs
- Primero: optimiza las imágenes. Esto aborda la mayor fuente de peso de página y suele ser responsable del 60 al 80 por ciento del tiempo de carga evitable
- Segundo: activa la caché. La caché del navegador y la del servidor reducen el trabajo en cada visita, sobre todo para los visitantes que vuelven
- Tercero: minifica CSS y JavaScript. Menos esfuerzo y una mejora fiable en los tiempos de transferencia de archivos
- Cuarto: añade una CDN si tu público está repartido geográficamente o si la entrega de contenido multimedia es una parte importante de tu web
- Quinto: atiende los recursos que bloquean el renderizado y el tiempo de respuesta del servidor si los pasos anteriores ya se han aplicado y las puntuaciones siguen siendo malas
Después de hacer cualquier conjunto de cambios, haz una prueba de velocidad para medir la mejora antes de pasar a la siguiente área. Para ver una guía sobre cómo interpretar con precisión los resultados de las pruebas de velocidad, consulta el artículo sobre cómo probar la velocidad de tu web. Para ver el desglose de las métricas concretas a las que afectan estas mejoras, consulta el artículo sobre qué son los Core Web Vitals.
Cómo reduce WEMASY el tiempo de carga de tu web
El creador de webs de WEMASY se encarga automáticamente de varias de las mejoras de velocidad más comunes. Las imágenes se comprimen y se convierten a WebP al subirlas. Las cabeceras de caché del navegador están configuradas por defecto. Los archivos CSS y JavaScript que sirve la plataforma están minificados. La entrega por CDN está incluida en todos los planes y sirve los archivos estáticos desde la ubicación más cercana a cada visitante.
Las puntuaciones de velocidad de página y los datos de Core Web Vitals se ven en el panel de analítica de WEMASY, con recomendaciones por página que señalan los problemas pendientes. Así puedes vigilar las mejoras tras cualquier cambio de contenido o de diseño sin hacer pruebas externas a mano.
Mira qué incluye en el creador de webs de WEMASY, o consulta las opciones de plan en la página de precios.
Preguntas frecuentes
¿Cuál es la forma más rápida de acelerar una web?
Optimizar las imágenes da la mayor mejora de velocidad con el menor esfuerzo en la mayoría de las webs. Las imágenes sin comprimir son lo que más contribuye al peso de la página, y pasar al formato WebP con una compresión adecuada y las dimensiones correctas puede reducir el tamaño de las imágenes entre un 80 y un 90 por ciento. Después de las imágenes, activar la caché del navegador y minificar los archivos CSS y JavaScript son las siguientes mejoras de más impacto. Con el creador de webs de WEMASY puedes configurarlo directamente en tu web.
¿Afecta la velocidad de una web al posicionamiento en buscadores?
Sí. Los buscadores usan los Core Web Vitals, que miden métricas concretas de carga, interactividad y estabilidad visual, como señales de posicionamiento. Las páginas que puntúan bien en Largest Contentful Paint, Interaction to Next Paint y Cumulative Layout Shift tienen ventaja de posicionamiento sobre las que puntúan mal, sobre todo cuando las páginas competidoras tienen una calidad de contenido parecida. Las mejoras de velocidad que suben las puntuaciones de Core Web Vitals pueden contribuir a una mejor visibilidad en buscadores.
¿Qué es un buen tiempo de carga para una web?
En los Core Web Vitals, el objetivo principal es un Largest Contentful Paint por debajo de 2,5 segundos. En la práctica, una página totalmente interactiva en tres segundos con una conexión móvil cumple el umbral que más importa tanto para la experiencia del visitante como para el posicionamiento. Una carga completa de la página en menos de cinco segundos en móvil es una referencia razonable para la mayoría de las webs de pequeños negocios.
¿Cómo sé qué está ralentizando mi web?
Haz una prueba de velocidad de página con una herramienta que muestre datos de campo junto con datos de laboratorio. Fíjate en las métricas concretas marcadas como fallidas en lugar de centrarte en la puntuación general. Un TTFB por encima de 800 milisegundos apunta a problemas del servidor. Una mala puntuación de LCP suele apuntar a problemas de imágenes o de recursos que bloquean el renderizado. Un Total Blocking Time alto apunta a problemas de ejecución de JavaScript. Cada métrica indica una zona distinta que investigar.
¿Afecta el hosting a la velocidad de una web?
Sí, y mucho. La calidad del hosting afecta al Time to First Byte, que determina lo rápido que el navegador puede empezar a cargar cualquier recurso. Los entornos de hosting compartido reparten la potencia de procesamiento entre muchas webs, lo que da tiempos de respuesta irregulares. Un hosting que incluya caché del servidor y entrega por CDN reduce el TTFB y mejora la velocidad de entrega para todos los visitantes, sea cual sea el resto de optimizaciones hechas en la propia página.
¿Puedo acelerar mi web sin un desarrollador?
Sí, en la mayoría de las mejoras que más diferencia marcan. Optimizar imágenes, elegir los formatos de archivo adecuados y añadir texto alternativo se puede hacer sin tocar código. La caché del navegador y la minificación suelen gestionarse automáticamente desde la plataforma web o se pueden activar con ajustes. Un desarrollador suele hacer falta solo para cambios avanzados, como la configuración personalizada del servidor, eliminar recursos que bloquean el renderizado en webs programadas a mano u optimizar consultas a la base de datos.