Generador de Srcset (Imágenes responsivas)

Genera HTML srcset/sizes a partir de una lista de anchos sin afectar LCP/CLS.

srcset

Descripción general

Genera múltiples tamaños y el HTML correspondiente de srcset/sizes para adoptar imágenes responsivas.

Cómo usar

  1. Carga una imagen de origen.
  2. Especifica la lista de anchos requeridos.
  3. Copia el HTML generado.

Casos de uso

  • Optimizar imágenes de artículos.
  • Proveer múltiples resoluciones para imágenes hero.
  • Reducir transferencia en galerías/tarjetas.

Consejos y conocimientos

  • Haz que sizes coincida con tu layout real.
  • Usa calidad adecuada por ancho para más ahorro.
  • Combina con loading="lazy" para mejor LCP.