Is ALT attribute within span tag valid?
I bought a wordpress template that inserts the highlighted image of this amenira:
<span class="fullimage cover" role="img" alt="O que significa sonhar com abacaxi" aria-label="O que significa sonhar com abacaxi" style="background: url('//i2.wp.com/www.segredosdosonho.com.br/wp-content/uploads/2018/10/Significado-de-sonhar-com-abacaxi.jpg');"></span>
However, when you saw analyze the SEO of the site, only some systems identify the ALt of the image.
Should I worry or is this way correct ?
1 answers
No, much less makes sense.
The <span> element allows only the global HTML attributes and alt is not one of them. Other than that, apparently this image is part of the content of the page, unlike that it would not require an alternative message, which is what the alt attribute defines. Being the image part of the content it must necessarily be in an element <img>. Putting it as the bottom of a <span> is what we call gambiarra.
However, if the image itself is not part of the content and it is merely an aesthetic detail, so you will have no problem leaving it as a background, but then the alternative message is completely unnecessary - in fact, why would you define an alternative content for what does not belong to the content?
It will be up to you to evaluate. If it is part of the content, remove this element <span> and redo correctly using the element <img>. If it is merely aesthetic, remove the alt attribute from the element. Even the attributes role and aria-label will not make sense in this case either.