2.2 KiB
id, title, challengeType, videoUrl, forumTopicId, dashedName
| id | title | challengeType | videoUrl | forumTopicId | dashedName |
|---|---|---|---|---|---|
| 587d774c367417b2b2512a9c | Agregar un texto alternativo a las imágenes para accesibilidad de usuarios con dificultades de la vista | 0 | https://scrimba.com/c/cPp7VfD | 16628 | add-a-text-alternative-to-images-for-visually-impaired-accessibility |
--description--
Probablemente hayas visto un atributo alt en una etiqueta img en otros desafíos. El atributoalt describe el contenido de la imagen y proporciona un texto alternativo. Un atributo alt ayuda en los casos en que la imagen no se carga o un usuario no pueda verla. Los motores de búsqueda también lo utilizan para comprender qué contiene una imagen para incluirla en los resultados de búsqueda. Aquí hay un ejemplo:
<img src="importantLogo.jpeg" alt="Company logo">
Las personas con dificultades visuales dependen de lectores de pantalla para convertir el contenido web a una interfaz de audio. Por esta razón, no podrán recibir la información si solo se les presenta de manera visual. En el caso de las imágenes, los lectores de pantalla pueden acceder el atributo alt y leer su contenido para proporcionar información clave.
Un buen texto alt le brinda al lector una breve descripción de la imagen. Siempre deberías incluir el atributo alt en tus imágenes. De acuerdo con las especificaciones de HTML5, esto ahora se considera obligatorio.
--instructions--
Camper Cat es tanto un ninja de la programación como un ninja de la vida real, y está construyendo un sitio web para compartir sus conocimientos. La foto de perfil que quiere usar es una muestra de sus habilidades y debería poder ser apreciada por todos los visitantes del sitio. Agrega un atributo alt en la etiqueta img para explicar que Camper Cat está practicando karate. (El atributo src de esta imagen no está enlazado a un archivo real, por lo que podrás ver el texto alt en la página.)
--hints--
Tu etiqueta img debe tener un atributo alt, y el mismo no debería estar vacío.
assert($('img').attr('alt'));
--seed--
--seed-contents--
<img src="doingKarateWow.jpeg">
--solutions--
<img src="doingKarateWow.jpeg" alt="Someone doing karate">