Optimización de Core Web Vitals en WordPress sin plugins extra
Índice
- ¿Qué son los Core Web Vitals?
- Optimizar LCP
- Optimizar INP
- Optimizar CLS
- Cómo detectar scripts innecesarios
- Conclusión
¿Qué son los Core Web Vitals?
- LCP (Largest Contentful Paint): mide el tiempo que tarda en mostrarse el contenido principal.
- FID (First Input Delay) → ahora INP (Interaction to Next Paint): mide la rapidez de respuesta a la primera interacción del usuario.
- CLS (Cumulative Layout Shift): mide la estabilidad visual (evitar que los elementos “salten” mientras carga la página).
Optimizar LCP
- Optimiza imágenes (
WebP,AVIF, tamaños adecuados). - Usa
loading="lazy"en imágenes no críticas. - Elimina o combina CSS que no uses para reducir peso (con cuidado que la puedes liar).
En WordPress: puedes quitar CSS innecesario en el functions.php de tu tema hijo con wp_dequeue_style():
// functions.php en tu tema hijo
function remove_unused_styles() {
if ( ! is_page('contacto') ) {
wp_dequeue_style('contact-form-7');
}
}
add_action('wp_enqueue_scripts', 'remove_unused_styles', 20);
—
Optimizar INP
- Reduce JavaScript pesado y elimina lo que no uses con
wp_dequeue_script(). (Si algo deja de funcionar vuelve a dejarlo como estaba) - Mueve scripts al footer para que no bloqueen el renderizado inicial.
Ejemplo en functions.php de tu tema hijo:
// functions.php en tu tema hijo
function move_scripts_footer() {
if (is_admin()) return;
remove_action('wp_head', 'wp_print_scripts');
remove_action('wp_head', 'wp_print_head_scripts', 9);
add_action('wp_footer', 'wp_print_scripts', 5);
add_action('wp_footer', 'wp_print_head_scripts', 5);
}
add_action('wp_enqueue_scripts', 'move_scripts_footer', 20);
—
Optimizar CLS
- Reserva espacio en CSS para imágenes y banners (usa
widthyheightoaspect-ratio). - Evita cargar fuentes de Google sin
display=swap.
En tu functions.php del tema hijo añade:
function cargar_fuentes_google() {
echo '<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>' . "\n";
wp_enqueue_style(
'google-fonts-roboto',
'https://fonts.googleapis.com/css2?family=Roboto&display=swap',
false
);
}
add_action('wp_head', 'cargar_fuentes_google', 5);
—
Cómo detectar scripts innecesarios
- Ver código fuente: busca todos los
<script src="...js">. - DevTools > Network > JS: revisa el peso y el origen de cada archivo.
- Query Monitor plugin (solo para auditar): te lista qué plugin o tema añadió cada script y estilo.
Una vez identifiques un script que no necesitas en todas las páginas, puedes desactivarlo con algo como:
// functions.php en tu tema hijo
function optimizar_scripts() {
// Quitar Contact Form 7 excepto en su página
if ( ! is_page('contacto') ) {
wp_dequeue_script('contact-form-7');
wp_dequeue_style('contact-form-7');
}
}
add_action('wp_enqueue_scripts', 'optimizar_scripts', 20);
⚠️ Siempre revisa la web después de quitar un script. Si algo deja de funcionar (un slider, un menú, un formulario), vuelve a activarlo: significa que sí era necesario.
—
Conclusión
Para mejorar los Core Web Vitals, no basta con pegar código: hay que auditar qué se carga y eliminar lo innecesario de forma segura. Hazlo siempre en el functions.php de tu tema hijo, prueba los cambios en un entorno de staging si puedes, y mide después con PageSpeed Insights o Lighthouse para confirmar las mejoras. (si no las notas tampoco te extrañes, el Sr.Google si lo va a notar)
¿A qué esperas?. Ponte Manos a la web para optimizar tu site
Hoy en día, los bots de inteligencia artificial están rastreando miles de webs para llevarse contenido y usarlo en el entrenamiento de modelos. Eso significa que tu trabajo, tus textos o tus imágenes pueden acabar en una base de datos sin que te enteres. Para ayudar con este problema, ImmuniWeb ha sacado una herramienta online gratuita que te dice en segundos si tu web está protegida o no frente a estos bots.
