Is the ALT attribute inside the SPAN tag valid?

Asked

Viewed 291 times

1

bought a wordpress template that inserts the highlighted image of this almond tree:

<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 saw analyze the site SEO, only some system identify the image Alt.

I must worry or this way is correct ?

  • I think you’ll be interested! https://answall.com/questions/341096/como-colocar-alt-em-uma-background-image-como-deixar-uma-background-image-mais

1 answer

2


No, much less makes sense.

The element <span> allows only the global attributes of HTML and alt You’re not one of them. Otherwise, apparently this image is part of the content of the page, unlike it would not need an alternative message, which is what the attribute alt define. Since the image is part of the content it should necessarily be in an element <img>. Put it as the bottom of a <span> is what we call gambiarra.

However, if the image itself is not part of the content and is merely an aesthetic detail, then you will have no problem leaving it as the background, but then the alternative message is completely unnecessary - by the way, why would 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 remake correctly using the element <img>. If it is merely aesthetic, remove the attribute alt element. Including the attributes role and aria-label will not make sense in that case either.

  • The image is relevant, it’s the highlight image of the article. I don’t understand why the template inserts the highlight image in this way. I think it’s best to correct and insert the img tag. I’ll see what I can do here. thanks

Browser other questions tagged

You are not signed in. Login or sign up in order to post.