2.4 KiB

Raw Blame History

id	title	challengeType	videoUrl	forumTopicId	dashedName
587d774c367417b2b2512a9d	Saber Cuando el Texto Alt Debe Dejarse en Blanco	0	https://scrimba.com/c/cM9P4t2	301019	know-when-alt-text-should-be-left-blank

--description--

En el último desafío, aprendiste que es obligatorio incluir un atributo alt al usar etiquetas img. Sin embargo, a veces las imágenes se agrupan con un título que ya las describe, o se usan solo para decoración. En estos casos alt el texto puede parecer redundante o innecesario.

En situaciones en las que una ya está explicada con contenido de texto, o no agrega significado a una página, el img todavía necesita un atributo alt, pero se puede establecer en una cadena vacía. Aquí hay un ejemplo:

<img src="visualDecoration.jpeg" alt="">

Las imágenes de fondo generalmente también caen bajo la etiqueta "decorativa". Sin embargo, normalmente se aplican con reglas CSS y, por lo tanto, no forman parte del proceso de lectores de pantalla del lenguaje de marcado.

Nota: Para imágenes con subtítulos, es posible que desees incluir texto alt, ya que ayuda a los motores de búsqueda a catalogar el contenido de la imagen.

--instructions--

Camper Cat ha programado una página esqueleto para la parte del blog de su sitio web. Está planeando agregar una ruptura visual entre sus dos artículos con una imagen decorativa de una espada samurái. Agrega un atributo alt a la etiqueta img y establezca una cadena vacía. (Ten en cuenta que la imagen src no enlace a un archivo real - no te preocupes de que no hay espadas que aparece en la pantalla.)

--hints--

Tu etiqueta img debe tener un atributo alt.

assert(!($('img').attr('alt') == undefined));

El atributo alt debe establecerse en una cadena vacía.

assert($('img').attr('alt') == '');

--seed--

--seed-contents--

<h1>Deep Thoughts with Master Camper Cat</h1>
<article>
  <h2>Defeating your Foe: the Red Dot is Ours!</h2>
  <p>To Come...</p>
</article>

<img src="samuraiSwords.jpeg">

<article>
  <h2>Is Chuck Norris a Cat Person?</h2>
  <p>To Come...</p>
</article>

--solutions--

<h1>Deep Thoughts with Master Camper Cat</h1>
<article>
  <h2>Defeating your Foe: the Red Dot is Ours!</h2>
  <p>To Come...</p>
</article>

<img src="samuraiSwords.jpeg" alt="">

<article>
  <h2>Is Chuck Norris a Cat Person?</h2>
  <p>To Come...</p>
</article>

2.4 KiB Raw Blame History