Website Problem

[Tharmas]

I’m having a website problem. I know HTML reasonably well, and I’m learning CSS. So I’m coding a personal website. I’ve got an image that simply won’t appear on the website when it’s loaded on my server.

It shows up fine when I look at the site on my PC.

I’ve used two different browsers, cleared the cache on the browsers, and can’t think of anything else to try. The image is a JPG and it’s fairly large. I’m using Windows 10. Haven’t tried a different computer yet. Items I’ve added to the site since the JPG show up.

Anybody have any ideas?

 

[Swammerdami]

I've had this problem when I've accidentally turned off read permission. (I don't know how you'd do that, accidentally or otherwise, on Windows.)

If you access the URL of the image itself, do you get a 404 error or a 403 error?

 

[bigfield]

You can try getting some information from your browser's debugger.

If you're using Chrome, Firefox or Edge, do this:
1. Open your server-hosted webpage.
2. Press F12 to open the developer tools (this will become your best friend)
3. Click on the Console tab. If your browser was unable to retrieve the image, you should see a red error printed here, with a status code.
404 ("Not Found") means the image couldn't be found and you need to check the image URL.
403 ("Forbidden") means the image is there but you aren't allowed to access it, which means you need to fix the file permissions.
If you're using Linux hosting (such as a cPanel site) then 644 (-rw-r--r--) should be sufficient, as the HTTP server only needs to be able to read the file.

https://developer.mozilla.org/en-US/docs/Web/HTTP/Status#client_error_responses
https://www.linux.com/training-tutorials/understanding-linux-file-permissions/

 

[Tharmas]

I've had this problem when I've accidentally turned off read permission. (I don't know how you'd do that, accidentally or otherwise, on Windows.)

If you access the URL of the image itself, do you get a 404 error or a 403 error?

This was a good suggestion. Accessing the URL itself brought up the mage with no problem.

 

[Tharmas]

You can try getting some information from your browser's debugger.

If you're using Chrome, Firefox or Edge, do this:
1. Open your server-hosted webpage.
2. Press F12 to open the developer tools (this will become your best friend)
3. Click on the Console tab. If your browser was unable to retrieve the image, you should see a red error printed here, with a status code.
404 ("Not Found") means the image couldn't be found and you need to check the image URL.
403 ("Forbidden") means the image is there but you aren't allowed to access it, which means you need to fix the file permissions.
If you're using Linux hosting (such as a cPanel site) then 644 (-rw-r--r--) should be sufficient, as the HTTP server only needs to be able to read the file.

https://developer.mozilla.org/en-US/docs/Web/HTTP/Status#client_error_responses
https://www.linux.com/training-tutorials/understanding-linux-file-permissions/

Developer tools showed nothing, but they're a great resource. Thanks for turning me on to them!

 

[Tharmas]

I never solved the problem, that is, I never found out why I couldn't see it in the web. But I did find a work-around. I had originally downloaded a free website template, and updated an image by replacing it with one of my own. The image was originally coded in the CSS. I coded it in the HTML portion and presto, it works now. I'll have to work more on CSS to understand what was going on. Thanks for all the help and suggestions.

 

[Loren Pechtel]

I've had this problem when I've accidentally turned off read permission. (I don't know how you'd do that, accidentally or otherwise, on Windows.)

If you access the URL of the image itself, do you get a 404 error or a 403 error?

This was a good suggestion. Accessing the URL itself brought up the mage with no problem.

There's your problem! Your computer is infested with wizards!