images.dimensions
Que las imágenes declaren su ancho y su alto.
Por qué importa
Si el navegador no sabe de antemano cuánto ocupa una imagen, no reserva su espacio y el contenido se desplaza al cargarla. Ese salto molesta al visitante y empeora la métrica de estabilidad visual (CLS) de Core Web Vitals.
Cómo se corrige
Indica el ancho y el alto reales en la etiqueta (<img width="800" height="600" …>) o fija la proporción con CSS (aspect-ratio). El navegador reservará el hueco antes de descargar la imagen.
Paso a paso: el prompt para tu IA
Cuando Seotres encuentra este problema en tu web, te da un prompt listo para pegar en la IA que uses, con los datos de tu página. Este es el de esta regla con una web de ejemplo (tudominio.com):
Problema: hay imágenes sin ancho ni alto declarados, lo que provoca saltos al cargar la página.
Datos de tu web: Aquí van la página y la evidencia que ha encontrado Seotres.
Objetivo
Que las imágenes de la página https://tudominio.com/ declaren su ancho y su alto reales para que la página no se desplace al cargar.
Pasos
- Mira en los datos de arriba qué imágenes no declaran su tamaño.
- Añade a cada <img> los atributos width y height con las dimensiones reales de la imagen (o fija la proporción con aspect-ratio en el CSS).
- Comprueba que la imagen sigue viéndose igual en móvil y en escritorio.
- Si la web es código propio: cambia el componente o la plantilla que escribe la etiqueta <img>.
- Si usas WordPress: suele ser un ajuste del tema, del plugin de optimización de imágenes o de carga diferida; WordPress añade ancho y alto a las imágenes del editor.
- Si usas Shopify, Wix, Squarespace u otra plataforma: depende del tema; si la plataforma controla la etiqueta y no se puede cambiar, dímelo.
Límites
- No cambies el tamaño con el que se ven las imágenes: el ancho y el alto de los atributos solo reservan el hueco.
Términos de esta regla
- Cadena de redirecciones
Varias redirecciones seguidas antes de llegar a la página final. Cada paso es un salto.
Ejemplo: http://tudominio.com → https://tudominio.com → https://www.tudominio.com son dos saltos; lo ideal es ir directo.
- CLS
Cuánto se mueve el contenido de la página mientras carga, sin que el visitante haga nada.
Ejemplo: Un banner que aparece arriba al cargar y empuja todo hacia abajo sube el CLS.
- Core Web Vitals
Las tres métricas con las que Google mide la experiencia de carga, respuesta y estabilidad de una página: LCP, INP y CLS.
Ejemplo: Una página con el LCP en 2 s, el INP en 150 ms y el CLS en 0,05 aprueba las tres.
Fuente: web.dev: Web Vitals