Images not showing in HTML
Missing images are one of the fastest ways for a website draft to look broken.
The problem
An img tag only points to a file. If that file was not included or the path does not match the folder structure, the image remains empty. Nested folders, uppercase extensions and renamed files are common issues.
Simple solution
- Find src attributes in the HTML and confirm that each file exists.
- Keep images in the same relative paths used by the HTML.
- Avoid renaming files after export.
- Check whether images load from external domains and whether that is intentional.
- Add alt text so content remains understandable.
Common mistakes
- Forgetting the images folder.
- HTML expects hero.jpg while the file is hero.JPG.
- Linking to a local desktop folder.
- Shipping huge unoptimized images.
Checklist
- All img files present
- Case matches
- No local machine paths
- Alt text present
- Mobile image sizes checked
- External image sources reviewed
FAQ
Why does the image work for the developer but not the client?
The path probably points to a file that only exists on the developer machine.
Should image names avoid spaces?
Simple names with hyphens are more robust.
Should images be local?
For static handoffs, local images are usually the most reliable.