Why do my images not load consistently in my HTML page?

Question

I currently have a website which contains on the main page a list of articles that each one of them has an image next to it. the images are from various different websites. sometimes some images are not loaded, when i check the url of that images it's fine, and when i refresh the page it loads all of them.

Is there a way to ensure that they are loaded (even with js)?

The URLs are definitely fine, I suspect the sites which the images are from are not responding too well, but still, when I try myself it's working.

Answer 1

It could be that the sites you are linking to have image hotlinking protection mechanisms in place or such, to reduce the load on their servers.

If you have permission to be showing those images on your site, then download them to your server.

Answer 2

I encountered that error, before, are you resizing them with javascript, or changing the width of the parent div?

Answer 3

Your web host might be having trouble. Shared hosting means you're sharing that server with many other people and it could be overloaded one minute and not overloaded the next. You might want to switch hosting companies or ask your host to move you to another server.

Answer 4

If you can't host the images yourself, maybe try using the error event to attempt to reload the failed images: www.quirksmode.org/dom/events/error.html

I've never used it myself, but that's the way I'd attempt to go.