SEO de imágenes: texto alt, formatos y velocidad (2026)

Las buenas prácticas de SEO de imágenes se resumen en dos tareas. Primero, ayudar a Google a encontrar y entender tus imágenes: usa elementos <img> reales, texto alternativo (atributo alt) y nombres de archivo descriptivos, y coloca las imágenes junto al texto relacionado. Segundo, que carguen rápido: optimiza las imágenes para SEO con formatos modernos, sirve el tamaño adecuado, reserva su espacio y nunca apliques lazy loading a la imagen principal de la parte visible de la página.

Las imágenes importan por dos motivos. Pueden atraer tráfico propio a través de Google Imágenes y de los resultados visuales. Y además suelen ser lo más pesado de una página, así que deciden si tus páginas superan las Core Web Vitals. Esta guía cubre ambos aspectos, en el orden en que la mayoría de los sitios debería corregirlos.

¿Cómo encuentra y entiende Google las imágenes?

Google encuentra las imágenes a través del atributo src de los elementos HTML <img> y las entiende gracias al texto que las rodea: texto alternativo, nombre de archivo, pies de foto, encabezados cercanos y la propia página. Las imágenes añadidas solo como fondos CSS no se indexan, así que cualquier imagen que quieras posicionar debe ser una etiqueta <img> real.

Las prácticas recomendadas de SEO para imágenes de Google lo dicen claramente: Google puede encontrar imágenes en el atributo src del elemento <img>, pero no indexa imágenes CSS. Esto pilla desprevenidos a muchos sitios. Los banners principales, las fotos de producto en sliders y las fotos del equipo se suelen poner con background-image porque es más fácil darles estilo. Los visitantes las ven bien, pero para Google Imágenes son invisibles.

La misma página recomienda colocar las imágenes cerca del texto relevante y en páginas relacionadas con el tema de la imagen. Una foto de una mesa de comedor de nogal en la ficha de producto de esa mesa, bajo el encabezado y junto a la descripción, tiene mucho contexto. La misma foto en una página genérica de «galería» sin texto apenas tiene ninguno.

Dos reglas más de descubrimiento que conviene conocer:

• Usa una URL por imagen. Google pide que hagas referencia a cada imagen siempre con la misma URL para poder almacenarla en caché y reutilizarla en lugar de descargarla muchas veces. Los parámetros de cache-busting que cambian en cada despliegue van en contra de esto.
• No ocultes imágenes detrás de JavaScript que Google no pueda ejecutar. Si una galería solo inserta las imágenes después de un clic o mediante un script que no se renderiza, puede que Google nunca las vea. Nuestra guía sobre problemas de renderizado de JavaScript muestra cómo comprobar lo que Googlebot renderiza realmente.

¿Cómo escribir el texto alternativo (alt) para SEO?

Un buen texto alternativo describe lo que muestra la imagen, con palabras sencillas y en el contexto de la página. Apunta a una frase corta que tenga sentido leída en voz alta a alguien que no puede ver la imagen. Usa una palabra clave solo cuando describa de verdad la imagen y nunca metas una lista de palabras clave en el atributo.

Las directrices de Google dan un ejemplo claro: «Cachorro de dálmata jugando a buscar la pelota» es un buen texto alternativo, mientras que un atributo vacío, una sola palabra como «cachorro» o una ristra de palabras clave sobre perros no lo son. El texto alternativo cumple dos funciones a la vez: es la principal señal de texto que usa Google para entender una imagen y es lo que anuncian los lectores de pantalla, así que escribir para las personas también sirve para el buscador.

Reglas prácticas:

• Describe, no etiquetes. «Mesa de comedor de roble para seis con patas de metal negro» es mejor que «mesa» o «imagen de producto 3».
• Sé breve. Una frase suele bastar; los párrafos largos van en el pie de foto o en el cuerpo del texto.
• Omite «imagen de» o «foto de». Los lectores de pantalla ya anuncian que es una imagen.
• Deja vacías las imágenes decorativas. Separadores, divisores y patrones de fondo deben usar alt="" para que se ignoren, en lugar de recibir descripciones inventadas.
• No copies el pie de foto palabra por palabra. Usa el pie de foto para el contexto adicional y el alt para lo que se ve.
• En imágenes enlazadas, describe el destino. Si una imagen es el único contenido de un enlace, su texto alternativo actúa como texto ancla del enlace.

¿Importan el nombre de archivo y el formato de las imágenes?

Sí, ambos importan, aunque de forma distinta. Un nombre de archivo descriptivo es una pequeña señal de relevancia; el formato afecta sobre todo a la velocidad de la página. Cambia el nombre de los archivos de la cámara antes de subirlos y sirve las imágenes en un formato moderno como WebP o AVIF con una alternativa razonable.

Google recomienda nombres de archivo descriptivos como my-new-black-kitten.jpg (en español, algo como mi-nuevo-gatito-negro.jpg) en lugar de IMG00023.JPG. Usa palabras en minúsculas separadas por guiones, describe el tema y no añadas más. Renombrar no moverá tus posiciones por sí solo, pero no cuesta nada si lo haces al subir el archivo. Cambiar el nombre de miles de imágenes existentes rara vez compensa, salvo que vayas a hacer una migración de todos modos, porque cada URL renombrada tiene que volver a rastrearse.

En cuanto a formatos, la Búsqueda de Google admite BMP, GIF, JPEG, PNG, WebP, SVG y AVIF. Cuál usar:

La calidad sigue contando. Google señala que las fotos de alta calidad atraen más a los usuarios que las imágenes borrosas o poco nítidas. Comprime, pero detente antes de que aparezcan artefactos visibles, sobre todo en las fotos de producto.

¿Cómo afectan las imágenes a la velocidad y a las Core Web Vitals?

En muchas páginas, el elemento visible más grande es una imagen, así que a menudo determina tu Largest Contentful Paint (LCP; lo bueno es 2,5 segundos o menos). Las imágenes sin espacio reservado también provocan desplazamientos de diseño que empeoran el CLS (lo bueno es 0,1 o menos). Las imágenes sobredimensionadas, sin prioridad o con lazy loading mal aplicado son la causa más habitual de ambos problemas.

Corrígelas en este orden:

1. Sirve el tamaño adecuado. No envíes una foto de 4000 píxeles a un hueco de 600 píxeles. Redimensiona al subir o usa un CDN de imágenes, y ofrece varios anchos con srcset y sizes.
2. Define siempre width y height. La guía de lazy loading de web.dev recomienda añadir los atributos width y height a todas las etiquetas <img> para que el navegador reserve el espacio y se eviten desplazamientos de diseño. Con CSS la imagen puede seguir siendo responsive.
3. Nunca apliques lazy loading a la imagen LCP. La misma guía indica que no se deben cargar de forma diferida las imágenes que probablemente estén en el viewport al cargar la página, sobre todo las imágenes LCP, porque el navegador no puede empezar a cargarlas hasta saber dónde se sitúan en la página.
4. Aplica lazy loading a todo lo que esté debajo del pliegue con el atributo nativo loading="lazy" en lugar de un script pesado.
5. Prioriza la imagen principal. El artículo de web.dev sobre Fetch Priority explica que las imágenes suelen empezar con prioridad baja y que marcar una imagen importante con fetchpriority="high" permite cargarla con prioridad alta desde el principio; en su ejemplo de Google Flights, el LCP bajó de 2,6 s a 1,9 s. Úsalo como una pista para una o dos imágenes críticas, no para todas.

Una imagen principal que cumple las cinco reglas tiene este aspecto:

<img
  src="/img/mesa-comedor-roble-800.webp"
  srcset="/img/mesa-comedor-roble-400.webp 400w,
          /img/mesa-comedor-roble-800.webp 800w,
          /img/mesa-comedor-roble-1600.webp 1600w"
  sizes="(max-width: 600px) 100vw, 800px"
  width="800" height="533"
  alt="Mesa de comedor de roble para seis con patas de metal negro"
  fetchpriority="high">

Fíjate en la alternativa en src. Las directrices de Google piden especificar siempre una URL alternativa en src cuando uses srcset o <picture>, para que cualquier rastreador y navegador pueda cargar algo.

Aquí lo que más importa es el móvil, porque Google indexa la versión móvil de tus páginas. Si tu plantilla móvil cambia u oculta imágenes, consulta nuestra checklist de indexación mobile-first.

¿Necesitas un sitemap de imágenes?

El sitemap de imágenes es opcional. Ayuda cuando Google podría no encontrar las imágenes con el rastreo normal, por ejemplo si se cargan mediante JavaScript o están alojadas en el dominio de un CDN. Para la mayoría de los sitios con etiquetas <img> normales en el HTML, basta con un sitemap XML estándar y páginas rastreables.

Si usas uno, mantenlo sencillo. La documentación de Google sobre sitemaps de imágenes ahora solo admite dos etiquetas: <image:image> y <image:loc>. Las antiguas etiquetas <image:caption>, <image:title>, <image:geo_location> e <image:license> están obsoletas, así que añadirlas no sirve de nada. Las imágenes pueden estar alojadas en otro dominio, como un CDN, siempre que verifiques ambos dominios en Search Console.

Puedes añadir las entradas de imágenes a tu sitemap de páginas actual en lugar de crear un archivo aparte. Nuestra guía de sitemaps XML explica qué más debe incluir.

¿Qué datos estructurados y metaetiquetas ayudan a las imágenes?

Los datos estructurados y las etiquetas Open Graph le indican a Google qué imagen representa mejor una página. Esa imagen puede aparecer después en resultados enriquecidos, en Discover y al compartir en redes sociales. En páginas de producto, receta y artículo, la propiedad image suele ser obligatoria para las funciones de resultados enriquecidos, así que si falta puedes perder visibilidad.

Las directrices de Google sobre imágenes mencionan la propiedad primaryImageOfPage de schema.org y la metaetiqueta og:image como formas de indicar tu imagen preferida, y señalan que el atributo image es un campo obligatorio para las insignias de resultados enriquecidos. En la práctica:

• Marcado Product, Article y Recipe: incluye image con URL completas y rastreables, idealmente en varias relaciones de aspecto.
• og:image: defínela en todas las páginas importantes; la usan las redes sociales y puede orientar la elección de miniatura de Google.
• Discover: la documentación de Google sobre Discover recomienda imágenes grandes de al menos 1200 px de ancho, con más de 300.000 píxeles en total, habilitadas mediante la directiva de robots max-image-preview:large (o AMP). Sin esa directiva, puede que tus artículos solo muestren una miniatura pequeña.

Comprueba que la metaetiqueta robots de tus páginas no limite por accidente las vistas previas de imágenes. Un max-image-preview:none o un noimageindex heredado de una plantilla de staging eliminará silenciosamente tus imágenes de los resultados. Asegúrate también de que el robots.txt no bloquee tu carpeta de imágenes ni tu CDN; nuestra guía de robots.txt muestra cómo comprobarlo.

¿Cómo detectar problemas de SEO de imágenes en tu web?

Combina un crawler con Lighthouse y Search Console. El crawler encuentra imágenes sin texto alternativo, URL de imágenes rotas, imágenes solo en CSS y archivos sobredimensionados en todas las páginas. Lighthouse muestra qué imagen es el elemento LCP y si tiene lazy loading o está sobredimensionada. Search Console muestra el tráfico de búsqueda de imágenes y las Core Web Vitals por grupo de páginas.

Una rutina rápida de auditoría:

1. Search Console → Rendimiento → Tipo de búsqueda: Imagen. Mira qué páginas ya consiguen clics desde imágenes y qué páginas importantes no consiguen ninguno.
2. Rastrea el sitio y exporta las imágenes con alt vacío o ausente, archivos muy pesados, URL de imagen rotas (4xx/5xx) e imágenes sin width/height.
3. Ejecuta Lighthouse en las plantillas clave (inicio, categoría, producto, artículo). Busca avisos como «La imagen del Largest Contentful Paint se ha cargado de forma diferida», «Usa un tamaño adecuado para las imágenes» y «Publica imágenes con formatos de próxima generación».
4. Revisa el HTML renderizado en las plantillas con mucho JavaScript para confirmar que las imágenes aparecen como elementos <img> tras el renderizado.
5. Valida los datos estructurados en las páginas de producto y artículo para confirmar que image está presente y que la URL carga.

Si prefieres no combinar todas estas herramientas a mano, una auditoría SEO gratuita de SEORecheck rastrea tus páginas, señala las imágenes sin texto alternativo y las imágenes rotas, y usa Lighthouse en un navegador real para mostrar qué imágenes ralentizan tu LCP, con URL de ejemplo de tu propio sitio. Puedes ver cómo es en el informe de ejemplo.

¿Qué deberías corregir primero?

Corrige primero lo que bloquea la visibilidad y la velocidad en tus páginas más valiosas y después ocúpate de la higiene general del sitio. Una imagen principal con lazy loading en tu plantilla de producto más importante cuesta más que mil imágenes del blog con nombres de archivo mejorables.

Para un método más amplio de ordenar las correcciones por impacto y esfuerzo, consulta cómo priorizar las correcciones SEO.

Conclusiones clave

• Usa elementos <img> reales; Google no indexa imágenes de fondo CSS.
• Escribe un texto alternativo breve y descriptivo pensando primero en las personas; usa alt="" en las imágenes decorativas.
• Pon nombres descriptivos a los archivos al subirlos y prioriza WebP o AVIF, con una alternativa en src cuando uses srcset.
• Define width y height en todas las imágenes, aplica lazy loading debajo del pliegue y nunca a la imagen LCP.
• Los sitemaps de imágenes solo necesitan <image:loc>; las etiquetas de pie de foto, título, ubicación y licencia están obsoletas.
• Añade image a los datos estructurados y og:image, y permite max-image-preview:large para Discover.
• Empieza por las plantillas que generan ingresos, no por renombrar archivos antiguos.