Option 1:

Please add an option to render hero background images as a real img/picture instead of only using a CSS background. This would let the browser treat the image as important content and show it sooner, which helps the page feel faster. See tests below.

-I would also want the option to turn lazy load off or on for different sections.

In theory:

I could insert a background image, default is css but I can toggle to 'img' in the toolbar.

Benefits:

For above-the-fold heroes, an 'img' consistently scores better on PageSpeed than a CSS background while looking exactly the same.

My Page Speed Insights test set-up:

1. Normal background hero

2. Row element + 'img' overlay

I used an image above a row element with buttons and text, and toggled the margin sliders on both to do a text over 'img' overlay which I

then expanded to appear as a background image.

Page Speed Insights Test Results:

1. Normal background hero

Mobile: 68

Desktop: 81

2. Row element + 'img' overlay

Mobile: 81

Desktop: 93