2.7 KiB
2.7 KiB
id | title | challengeType | videoUrl | localeTitle |
---|---|---|---|---|
587d774c367417b2b2512a9d | Know When Alt Text Should be Left Blank | 0 | Sepa cuándo el texto alternativo debe dejarse en blanco |
Description
alt
en las etiquetas img es obligatorio. 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, el texto alt
puede parecer redundante o innecesario. En situaciones en las que una imagen ya está explicada con contenido de texto o no agrega un significado a una página, el img
aún 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 también suelen caer bajo la etiqueta 'decorativa'. Sin embargo, normalmente se aplican con reglas CSS y, por lo tanto, no forman parte del proceso de los lectores de pantalla de marcado. Nota Para imágenes con un título, es posible que desee incluir texto
alt
, ya que ayuda a los motores de búsqueda a catalogar el contenido de la imagen. Instructions
alt
a la etiqueta img
y establézcalo en una cadena vacía. (Tenga en cuenta que la imagen src
no se enlaza con un archivo real, no se preocupe si no se ven espadas en la pantalla). Tests
tests:
- text: Su etiqueta <code>img</code> debe tener un atributo <code>alt</code> .
testString: 'assert(!($("img").attr("alt") == undefined), "Your <code>img</code> tag should have an <code>alt</code> attribute.");'
- text: El atributo <code>alt</code> debe establecer en una cadena vacía.
testString: 'assert($("img").attr("alt") == "", "The <code>alt</code> attribute should be set to an empty string.");'
Challenge Seed
<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>
Solution
// solution required