The challenge of mobile images - discussion

[Acorn]

Acorn … clarification on your chunk of code ….

Here comes the sleight of hand.
For each resized and placed image in your design, open its Placeholder Body and insert:
<img id="unique image identifier" src="<source path>/<A nice image filename>.jpg" alt="describe the image" loading="lazy" width=100% height=100% />
Change the id, set the src to 'index_html_files/<master-image>.<ext>, describe the image in alt.

The image <a nice image filename> is the name of my file. No changes to the image id correct? Alt is my description of pic.

This is a fascinating solution.

Thanks
W

Bill, say you have a design file, A.xar.
When you publish, you render as .html so you publish your resources to index_html_files. Else we are looking at an index_htm_files folder.
Your image is B.png and you have used the Placeholder > Replace with graphic file option.
When you save your design, B.png is copied into an A_xar_files folder.
When you render, B.png is included in the index_html_files folder.

The <img> Tag should be made with an id value that is solely associated with A.png; the alt text can have a duplicate elsewhere.
The src is then just the render path and filename: index_html_files/A.png.
A and B can be any legal strings for a filename.
png could be jpg, webp, gif or any format a modern browser can handle even is Xara cannot.

Acorn