Las imágenes de producto necesitan un texto alternativo significativo

Los clientes ciegos dependen del texto alternativo para saber cómo es un producto. Un nombre de archivo como «IMG_4021_final.jpg», una descripción vacía o el mismo texto en todas las imágenes de la galería no les dice nada del color, el corte o los detalles, así que no pueden elegir con seguridad y compran en otra parte.

ID de la regla
vs-product-images
Origen
Comprobación de Validiscan
Impacto
Grave
Nivel de corrección
ASSISTED
en Shopify, Shopware, WooCommerce y Magento
Estado
se ejecuta

Qué hace la comprobación

Revisa las imágenes de producto en busca de textos alternativos iguales al nombre del archivo, un alt vacío en la imagen principal del producto, el mismo alt en todas las imágenes de una galería, textos alternativos de más de 150 caracteres y prefijos redundantes como «imagen de» o «foto de» (1.1.1).

La comprobación lee los elementos img y role="img", y omite los que están dentro de aria-hidden="true" o de diapositivas clonadas de un carrusel. Un img sin alt se deja en manos de la regla image-alt de axe-core.

  • Nombre de archivo: el texto alternativo es igual al nombre del archivo que figura en src, en data-src o en la primera entrada de srcset, o bien, si ese nombre contiene dígitos, guiones o guiones bajos, es igual a él sin la extensión ni el sufijo de tamaño (_1024x1024). También cuenta un texto alternativo que termina en una extensión de imagen o del estilo de IMG_1234.
  • Imagen principal (páginas de producto): el img visible más grande, de 10 000 píxeles CSS cuadrados o más, que empieza en las primeras 1,5 alturas de viewport dentro de un contenedor de producto o de galería o, en su defecto, en la primera altura de viewport. Las imágenes de la cabecera, de la navegación y del pie de página nunca cuentan como imagen principal; role="presentation" o "none" cuenta como texto alternativo vacío, incluso sin alt.
  • Galería: en el contenedor más cercano que reúne tres o más imágenes visibles con texto alternativo, tres o más de ellas, con archivos distintos, comparten el mismo texto alternativo.
  • Genérico: el texto alternativo es solo una palabra como «foto» o «icon».

La comprobación no juzga si el texto describe la imagen.

Cómo corregirlo

Escriba para cada imagen de producto un texto alternativo breve y concreto que diga lo que muestra esa imagen (color, ángulo, detalle), manténgalo por debajo de unos 150 caracteres, omita «imagen de» y haga que los textos de una misma galería sean distintos. La mayoría de las plataformas guardan el texto alternativo de cada imagen de producto en el panel de administración; asegúrese de que el tema lo muestre en lugar del nombre del archivo o del título del producto.

Criterios de conformidad de las WCAG

Apartados de la norma EN 301 549

El apartado de la norma EN 301 549 que corresponde a cada criterio, por versión de la norma
Criterio de las WCAG Versión 3.2.1 Versión 4.1.1
1.1.1 9.1.1.1 9.1.1.1

Empiece con una revisión gratuita de su tienda.

Envíe la dirección de su tienda. Validiscan la escanea y le responde con cada fallo que el escaneo pueda demostrar, con la página y el código.

Solicitar revisión gratuita

O escriba a info@validiscan.com.

Qué cubre la revisión gratuita y qué deja fuera
Usted envía
la dirección de su tienda
Páginas escaneadas
hasta 15
Usted recibe
todos los fallos que el escaneo puede demostrar, con la página y el código
En su tienda
solo páginas públicas; sin inicio de sesión, nada comprado, ningún formulario enviado
Lo que no es
una auditoría completa

Escribir a Validiscan

Para una revisión gratuita, indique la dirección web de su tienda y su plataforma.

Validiscan utiliza lo que usted envía para responderle. Política de privacidad