2.4 KiB

Raw Blame History

id	title	challengeType	videoUrl	forumTopicId	dashedName
587d774c367417b2b2512a9d	Sapere quando il testo alternativo dovrebbe essere lasciato vuoto	0	https://scrimba.com/c/cM9P4t2	301019	know-when-alt-text-should-be-left-blank

--description--

Nell'ultima sfida, hai imparato che usando i tag img, è obbligatorio includere un attributo alt. Tuttavia, a volte le immagini sono già raggruppate con una didascalia che le descrive, o sono utilizzate solo a scopo decorativo. In questi casi, il testo alt può sembrare ridondante o inutile.

Quando un'immagine è già spiegata con del contenuto testuale o non aggiunge altro significato alla pagina, il tag img ha ancora bisogno di un attributo alt, ma esso può essere impostato su una stringa vuota. Un esempio:

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

Le immagini di sfondo solitamente cadono nella categoria 'decorativo'. Tuttavia, sono tipicamente applicate con regole CSS e quindi sono escluse dal processo di lettura dello schermo.

Nota: Per le immagini con didascalia, potresti voler includere comunque il testo alt poiché aiuta i motori di ricerca a catalogare il contenuto dell'immagine.

--instructions--

Camper Cat ha scritto lo scheletro della pagina per la sezione blog del suo sito. Vuole aggiungere una separazione visiva tra i suoi due articoli usando l'immagine decorativa di una spada samurai. Aggiungi un attributo alt al tag img e impostalo su una stringa vuota. (Nota che il link all'immagine sorgente src non punta ad un file reale - non preoccuparti che non ci siano spade mostrate nella pagina.)

--hints--

Il tuo tag img dovrebbe avere un attributo alt.

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

L'attributo alt dovrebbe essere impostato su una stringa vuota.

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