Improve Elementor Gallery widget: use <img> tags instead of CSS background images

[mbautista]

Description

Hello,
I'm sorry if this is a duplicate — I couldn’t find an existing discussion about it.

When using the Elementor Gallery Item widget (e-loop-item), we’ve noticed that the widget generates <div> tags with inline style="background-image(...)".

This causes several issues, in my opinion:

1. Semantics & Accessibility

A gallery image is not a decorative image — it’s actual content. Therefore, it should use an <img> tag with an alt attribute so that it can be indexed by search engines and read by screen readers.

2. Performance

Background images are among the last assets loaded by browsers, which often results in a blank area for a significant amount of time. This impacts the Largest Contentful Paint (LCP) and leads to poor PageSpeed scores. Since LCP is an important SEO factor, this can seriously affect website performance.

3. Anchors / Scroll Behavior

When Elementor computes anchors, it doesn’t account for the gallery item’s height because that height is only known after images are loaded — and background images load after the onload event.
As a result, anchors don’t scroll to the correct position.
Currently, our workaround is to manually set a min-height.

Agreement

• I confirm I have read and followed the Editor V4 Discussion Form guidelines, and agree this discussion may be closed without warning.

[nicholaszein]

Hi. Yes, this is a duplicate, and a feature request, not related to Editor V4 in any way at the moment.

Please, next time read the instructions in the form. They are there to ensure we keep this space organized. Posting duplicates also doesn't help. This causes fragmentation, and makes actually implementing those requests super difficult.

Thank you for understanding.

[mbautista]

Hello,
Sorry for that. I have read the form before submitting and I have search for opened issues but I could not find it, please let me know if you find it. Thank you :)
https://github.com/elementor/elementor/issues?q=is%3Aissue%20state%3Aopen%20gallery%20background%20image

[losvincent]

This is an excellent feature request. The Media Carousel and Gallery widgets in Elementor are both implemented as background images, and thus lack SEO-friendly alt text attributes. In contrast, third-party Elementor add-ons that offer slider and gallery widgets use standard tags instead, which come with built-in alt text functionality and are therefore far more favorable for SEO. We hope Elementor will consider optimizing the rendering approach of its native sliders and galleries accordingly.