Abres PageSpeed Insights y el FCP aparece en rojo: tu web tarda demasiado en mostrar el primer texto, imagen o bloque visible.
Diagnostica el origen antes de tocar plugins
Abre PageSpeed Insights y detecta qué frena el primer contenido visible.
Un FCP lento no siempre señala el mismo problema: el servidor puede tardar en responder, el CSS puede bloquear la pantalla o una fuente externa puede retrasar el texto. El aviso que aparece primero en PageSpeed Insights suele ser el mejor punto para empezar, no la lista completa de avisos.
Distingue FCP, LCP y TTFB
Separa FCP, LCP y TTFB para no arreglar el indicador equivocado.
Si el TTFB es alto, la web tarda en abrir la puerta. Si el TTFB es aceptable pero el FCP sigue alto, alguien ha dejado muebles delante de esa puerta: suele ser CSS, fuentes o JavaScript. Esta diferencia evita perder una tarde tocando imágenes cuando el problema está en el alojamiento.
Lee las alertas que afectan al FCP
Busca avisos sobre respuesta inicial, recursos bloqueantes y fuentes.
La mayoría de guías dicen que hay que perseguir una puntuación alta. Lo que no mencionan es que una puntuación puede variar entre 5 y 15 puntos sin cambios reales en tu sitio. Mira los segundos del FCP y el listado de recursos, que te dicen qué archivo está retrasando la pantalla.
Para optimizar FCP sin complicarte, sigue un orden de menor riesgo a mayor coste. Primero, con coste cero y en unos minutos, mide en PageSpeed Insights, elimina plugins que no uses y comprueba que no haya conflictos de caché. Después activa una sola caché de página y revisa la compresión, la caché del navegador y las imágenes visibles; estos cambios suelen tener un impacto alto cuando el TTFB de WordPress es elevado o la página genera contenido en cada visita.
Deja para una segunda fase el CSS crítico, las fuentes web, aplazar JavaScript y una CDN como Cloudflare, porque requieren más pruebas. Cambiar de hosting o de tema es el último paso: puede resolver un problema importante, pero implica más coste y trabajo.
Usa este árbol rápido en PageSpeed Insights:
si el informe marca una respuesta inicial lenta y el documento tarda en empezar a recibirse, revisa hosting, caché de página, base de datos y plugins antes de minificar nada. Si el servidor responde con rapidez pero aparecen recursos bloqueantes, identifica los archivos CSS o JavaScript que se cargan antes del primer texto y reduce los que no pertenecen a esa URL
en este último caso puede ayudar el CSS crítico. Si el aviso señala fuentes web, reduce familias y grosores, usa formatos modernos y evita que el texto quede oculto mientras se descargan. Si la imagen visible pesa demasiado o tiene lazy load, exclúyela
si el problema aparece tras scripts de terceros, prueba a aplazar JavaScript no esencial
Confirma siempre la hipótesis en el listado de recursos y no solo en la puntuación.
Conviene no confundir las métricas:
el First Contentful Paint indica cuándo se pinta el primer contenido, mientras que el TTFB mide el tiempo hasta que el navegador recibe el primer byte del servidor. Ninguna de las dos forma parte actualmente de los Core Web Vitals. Estos son:
LCP, que evalúa la carga del elemento principal
INP, que mide la capacidad de respuesta ante interacciones
y CLS, que refleja los cambios visuales inesperados
Por ejemplo, puedes mejorar el FCP al mostrar pronto un título, pero mantener un LCP lento si la imagen principal tarda demasiado. Por eso, al medir con PageSpeed Insights, usa el FCP para diagnosticar el primer renderizado y revisa los Core Web Vitals para valorar la experiencia completa.
✉
¿Quieres más información? Escríbenos y te orientamos
Corrige un servidor lento antes de minificar archivos
Activa la caché de página cuando el servidor responda tarde.
La caché de página guarda una copia ya preparada de cada URL pública. Es como dejar varios platos listos antes de que lleguen los clientes, en vez de cocinar cada pedido desde cero. Un visitante no conectado recibe esa copia y el servidor trabaja menos.
Elige caché según tu alojamiento
Comprueba el tipo de servidor antes de elegir LiteSpeed Cache.
Si tu alojamiento no usa LiteSpeed y quieres una configuración más guiada, WP Rocket suele ser más fácil para una primera web, aunque es de pago. W3 Total Cache es gratis, pero tiene más pantallas y más opciones que pueden confundir. No instales los tres para comparar resultados.
Valora una CDN solo si te conviene
Activa Cloudflare si tus visitas están lejos del servidor o tu hosting lo recomienda.
Una CDN ayuda más cuando el público está repartido entre España, la Unión Europea y otros países. Si casi todas las visitas están cerca del servidor y el TTFB sigue alto, revisa antes el plan de hosting, los plugins activos y el tema. Matt Mullenweg y el proyecto WordPress recomiendan mantener WordPress actualizado, pero una actualización no sustituye recursos de servidor suficientes.
Elimina bloqueos de CSS, fuentes y JavaScript
Reduce los archivos que impiden dibujar la parte superior de la página.
El navegador necesita leer ciertos archivos CSS antes de mostrar texto, colores y estructura. Ese CSS es como el plano de una casa: sin él, el navegador no sabe dónde poner cada pared. El problema aparece cuando carga archivos grandes que no hacen falta al abrir esa URL.
Carga las fuentes sin retrasar el texto
Deja solo las fuentes y grosores que realmente se ven al abrir la página.
En el personalizador del tema o constructor visual, deja una fuente para texto y otra para títulos como máximo. Mantén entre dos y cuatro grosores en total, por ejemplo normal y negrita. Este ajuste suele tardar entre 15 y 30 minutos porque debes revisar encabezados, botones y textos en móvil.
Aplaza scripts que no abren la página
Retrasa solo el JavaScript que no necesita funcionar en el primer segundo.
Activa «defer» o «aplazar JavaScript» solo en el plugin de caché que hayas elegido. Después abre la web en incógnito, pulsa el menú móvil, envía un formulario y, si vendes, añade un producto al carrito. Haz estas pruebas en escritorio y móvil.
✉
¿Quieres más información? Escríbenos y te orientamos
Corrige imágenes visibles sin aplicar lazy load al logo
Comprime las imágenes grandes y excluye las que aparecen al abrir la página.
La carga diferida o lazy loading espera para descargar imágenes que están más abajo. Es útil para una galería larga, pero perjudica al logo y a la imagen destacada que el visitante ve de inmediato. Es como guardar la llave de la puerta en una caja al fondo del trastero.
Elige una herramienta de imágenes
Usa un solo plugin de imágenes si tu caché no convierte formatos.
Situación Opción Coste Prueba necesaria Pocas imágenes y presupuesto cero Smush gratuito Gratis con límites Revisar calidad y lazy load Muchas fotos o WebP/AVIF ShortPixel o Imagify Créditos o plan de pago Probar diez imágenes Servidor LiteSpeed LiteSpeed Cache Gratis Confirmar exclusiones visibles
Mantén el contenido principal disponible
Comprueba que la imagen principal no espera a que el visitante se desplace.
No uses imágenes de 3.000 píxeles de ancho en un hueco que se muestra a 800 píxeles. Sube una imagen ajustada al tamaño visual y deja que WordPress cree sus miniaturas. La diferencia de peso puede ser de varios cientos de KB, según la foto y el formato.
Elige un solo plugin principal de caché
Instala una sola herramienta principal y evita funciones repetidas.
Para una web sencilla, elige según tu servidor y presupuesto. WP Rocket encaja si quieres menos decisiones y aceptas pagar. LiteSpeed Cache encaja si tu hosting usa LiteSpeed. W3 Total Cache es una alternativa gratuita, pero requiere más cuidado al activar opciones.
Evita combinaciones que generan conflictos
Desactiva antes las funciones duplicadas que ya tenga otro plugin.
No uses WP Rocket con LiteSpeed Cache o W3 Total Cache como cachés de página simultáneas. Tampoco actives minificación en Autoptimize y en el plugin principal al mismo tiempo.
Aplica una configuración inicial segura
Activa caché de página y deja las opciones delicadas para el final.
En tu plugin principal, activa caché para visitantes no conectados, compresión GZIP o Brotli si aparece disponible y caché del navegador. Guarda los cambios, vacía la caché y revisa tres URLs: portada, una entrada y contacto.
Preguntas frecuentes
Resuelve las dudas habituales antes de activar ajustes avanzados.
¿Qué es el first contentful paint?
El First Contentful Paint mide cuánto tarda en aparecer el primer contenido visible de una página. Puede ser texto, un icono, una imagen o una parte visual del contenido, y una referencia buena es hasta 1,8 segundos.
¿Cómo puedo reducir el FCP en WordPress?
Reduce el FCP midiendo primero la URL y corrigiendo la causa principal, como TTFB alto, CSS bloqueante, fuentes o JavaScript. Activa un solo plugin de caché y prueba cada cambio en incógnito, móvil y escritorio.
¿Debo instalar WP rocket y LiteSpeed cache?
No, no debes instalar WP Rocket y LiteSpeed Cache como cachés principales a la vez. Elige LiteSpeed Cache si tu servidor usa LiteSpeed; en otro caso, WP Rocket puede ser más simple si aceptas su coste.
¿El lazy load mejora siempre la velocidad?
No, el lazy load mejora la carga de imágenes que están por debajo del primer pantallazo. Debes excluir el logo, la imagen principal visible y cualquier recurso que PageSpeed Insights detecte como LCP.
¿Cuál es la diferencia entre FCP y LCP?
El FCP indica cuándo aparece el primer elemento visible y el LCP cuándo está listo el elemento más grande de la parte inicial. Una página puede tener FCP rápido y LCP lento si su imagen principal pesa demasiado.
¿Qué plugin sirve para optimizar imágenes?
Smush ofrece una opción gratuita para comprimir imágenes, aunque tiene límites según la función. LiteSpeed Cache también puede servir si tu hosting usa LiteSpeed y configuras bien WebP y las exclusiones de lazy load.
✉
¿Quieres más información? Escríbenos y te orientamos
Verifica cada cambio y conserva lo que funciona
Repite las pruebas en las mismas condiciones y conserva solo los cambios seguros.
Mide de nuevo en PageSpeed Insights para móvil y escritorio. Haz entre dos y tres pruebas por dispositivo y apunta el rango de FCP, no solo el mejor resultado. Si usas Cloudflare o una CDN, prueba también con GTmetrix desde una ubicación cercana a tu público principal.
Guarda una lista de cambios reversibles
Anota el plugin, ajuste y resultado antes de continuar.
Mantén una copia de seguridad reciente antes de actualizar WordPress, el tema o plugins de caché. El Reglamento General de Protección de Datos y la LSSI-CE no cambian el FCP, pero un aviso de cookies mal configurado puede bloquear contenido o scripts esenciales, por lo que también debe probarse.
Decide cuándo pedir ayuda técnica
Pide una revisión cuando el TTFB siga alto tras aplicar caché y reducir plugins.
Un profesional puede revisar consultas lentas de base de datos, errores PHP, tareas automáticas y archivos del tema que no se ven desde PageSpeed Insights. No hace falta contratar ayuda por un aviso pequeño, pero sí cuando la web falla o mantiene tiempos lentos tras las pruebas básicas.
⚠️ No midas justo después de vaciar toda la caché y des por definitivo el primer resultado. Espera a que se regenere, repite la prueba y revisa la web como visitante nuevo.
Fuentes de interés
Otros artículos que pueden complementar lo que acabas de leer:
