Domina los Core Web Vitals en directo. Aprende a localizar el elemento LCP con el inspector y detecta saltos visuales de CLS activando el destacado de regiones. Identifica cómo imágenes sin dimensiones o fuentes lentas afectan la estabilidad visual sin depender de herramientas automáticas.
Accede a la lección en vídeo de la membresía. Cada martes, jueves y sábado aprende con una clase nueva. Puedes identificarte en este enlace o suscribirte a los cursos.
Contenido de la lección
(Recordar que este contenido es la escaleta)
- Cazando el LCP: Cómo usar el inspector para que Chrome te señale exactamente qué imagen o bloque de texto es el elemento más grande (y por qué tarda en aparecer).
- Visualizando el CLS: Activar el «Layout Shift Region Highlighting» para ver en azul qué elementos «saltan» mientras la página carga.
- El problema de las fuentes y las imágenes: Detectar imágenes sin atributos width y height que causan inestabilidad visual.
Objetivo de la lección
El alumno será capaz de poner «nombre y apellidos» a los problemas de Core Web Vitals, dejando de depender de herramientas automáticas para hacer un análisis visual real.
Recursos
Documentación: Guía de Web.dev sobre la optimización de elementos LCP.