JPG file not loading in webpage

Question

I have a basic webpage that references four image files using the following code:

<img src="/images/SanFran.jpg" name="urbanForm" alt="urbanFormA" width="150" height="100"/>

(I change SanFran.jpg, to London.jpg, NewYork.jpg and Barcelona.jpg - just replacing the filename)

However, although the 4 jpegs are very similar (200 x 150 pixels) and made using a similar technique (cropping an image in Picassa), only one of the files will load (London.jpg). The other three give me a broken link message. I have checked that I am do not have misspellings numerous times, and cannot find the problem.

Is there anything that I have not considered?

(I'm using Aptana Studio on OSX and viewing it using Safari as a previewer; the same problem exists if I look at it using Firefox or Chrome)

Answer 1

1. Try naming one of the others SanFran.jpg. See what happens. Might give you a clue.

2. Open them all in windows explorer, confirm the images themselves load normally and aren't corrupt.

3. Check all are in /images/

4. right click on the broken link and choose view image or copy image location. See if where it's trying to access is definitely the right place.

5. Do the same with the working one. Compare and see if any differences.

6. change everything to lowercase, just in case (excuse pun)

7. hit ctrl+shift+reload a few times, and F5 a few times.

8. clear cache manually if you know how or have the tools.

9. Copy it to a different loacation and try loading them there. Ideally a different computer.

10. Upload it somewhere and see if it works in your browser when online

Hopefully one of those may help...

Answer 2

Are all the images in the same directory?

Make all the file names lowercase, so you know that isn't the issue.

double check extensions, "jpg or jpeg or JPG or JPEG"

take it back to basics <img src="images/filename.jpg" />

Answer 3

If you know the files are there, make sure the case of the filename matches (s is different than S on Linux), and then make sure .jpg is the proper extension and not .jpeg.

Answer 4

It could be because your Jpegs are saved as CMYK as oppose to RGB. See this link for more detail. However this would only affect some browsers

http://www.plaveb.com/blog/cmyk-images-not-displayed-in-internet-explorer

Answer 5

Open the images in Photoshop and resave in RGB color format (just incase it's CMYK). Known issue in some legacy browsers, not sure when or if it went away.