Captured images not rendering in replay

I’ve captured a site using ArchiveWeb.page, but when I load it into ReplayWeb.page (either browser or desktop) there are a number of images that do not render.

Looking at the ‘Resources’ list in RW I can see these files have been captured - in most cases, the images have been captured multiple times. Is this what’s causing the issue? And is there a way to resolve without redoing the capture from scratch?

Looking at the ‘Resources’ list in RW I can see these files have been captured

Can I ask what website this is? Files being in the resources tab but not loading correctly is usually indicative of a replay issue, not an archiving problem.

The website is University of Edinburgh Exhibitions | Art in Mind, and in digging around for an example I think I may have found the issue and answered my own question.

The images auto-resize based on the browser, and this change is reflected in the URL of the file (so e.g. /images/ _1400x680_crop_center-center_none /CLOSEUP-GILLIAN-ARM.png).

When the capture runs it obviously picks up the image as it has been rendered, but when viewed in ReplayWeb with the content sidebar enabled this changes the size of the image required and it doesn’t render. Simple fix is to close the content sidebar.

Apologies for not digging into this more before posting :upside_down_face:

1 Like

Thanks for documenting this! Looks like the images are defined as a source set and different ones are used based on the page width. If you don’t change the window size while archiving, the browser won’t fetch the second image from the server and it won’t be in the archive.

Won’t speculate on future features for ArchiveWeb.page here, but I know Browsertrix will auto-fetch these types of things (code link if anyone is curious).