There are a couple of different issues that could explain why your images are not displaying correctly:
Note: Most of these problems can be solved by transitioning to using Website Projects. For more information about Website Projects, read Working With Website Projects.
If you aren't sure whether you uploaded your images, try to visit the URL of the image. For example, if you have an image saved in the root folder of your server called dog.png, use your favorite browser to visit http://www.yourwebsitename.com/dog.png. If you get a 404 error, you either did not upload the image or uploaded it to a different folder on your server.
To resolve this issue, switch to Website Projects, which you to keep track of where your images are located in your website structure and can insert correct links to the image in your HTML page.
If your image tags are referencing images on your hard drive instead of your server, save your current website files to a new Website Project. Next, correct the code on your webpages so it uses relative paths to your image files. To do this, open the page where your images are being referenced incorrectly. For each image, you will find an image tag () and the src attribute (src="image.png"), which look something like this:
<img src="file://C:\Program _cke_saved_src="file://C:\Program Files\CoffeeCup Software\Working\filename.png" _cke_saved_src="file://C:\Program Files\CoffeeCup Software\Working\filename.png">
That file path is what's causing all the trouble — it tells the web browser to look for a file on your computer. Delete this whole chunk of code and then find the image in your Website Project. Right-click it and select Insert Image Into Current Document. This places an accurate relative link to the file in your page for you. Now just save your work and upload your changes to your server.
- In addition to uploading the HTML page, you also need to upload the images it references. For instance, if you have a page called page.html that displays two images, dog.png and cat.png, you will need to upload all three files: page.html, dog.png, and cat.png.
- The HTML code must reference these images correctly. Your document could be linking to the files on your hard drive or in the wrong location in your Working folder or Website Project, or the links could be formatted incorrectly.
- Make sure the capitalization in the image file name matches the capitalization in the HTML document. For example, if you link to dog.png but the actual file name is Dog.png, the image will not display correctly.