Files and assets

Broken Images After Uploading a Website: Fixes

GeminiLaunch · October 4, 2026 · 4 min read

When an image works in a preview but disappears on the published website, inspect the image's URL before generating a replacement. Usually the page is asking for a file that was never uploaded, was uploaded under a different name, or lives at a different path.

The useful diagnostic is the exact address the browser requests. Right-click the broken image and open it separately, or inspect the failed image request in the browser's network panel. A missing file, a blocked external host, and a non-image response require different fixes.

Check whether the file is in your upload

An AI preview can display assets from its own temporary workspace. Your uploaded folder must contain the files your page needs, unless you intentionally reference a stable external image URL.

For example, a page that references images/team.jpg needs an images folder containing team.jpg alongside the relevant HTML structure. Uploading only the HTML file will not bring that photograph with it. A path beginning with a computer's drive or user folder also cannot work for visitors on another device.

Choose the folder that contains the site's entry page and its asset folders. Do not flatten all files into one directory unless you also update every reference. Run the static-site preflight checker to find missing local references before uploading; it checks selected files locally in your browser.

Match the path from the page's location

An address such as images/team.jpg is relative to the page's location. An address beginning with /images/team.jpg starts at the site's root. This difference becomes visible when a page sits inside a directory, such as /about/index.html. MDN's guide to creating links and paths explains relative and absolute references.

Draw the folder tree on paper if necessary. From about/index.html, the sibling root images folder can be reached with ../images/team.jpg. Alternatively, /images/team.jpg works when the website is hosted at the domain root and that asset really exists there. A website hosted under a subdirectory may need a different base path.

Fix the generated page rather than renaming random files until a preview happens to work. An intentional path convention makes future updates much easier to review.

Compare spelling and capitalization exactly

Treat Team.jpg and team.jpg as different filenames for publishing. A local environment may tolerate differences that a hosting environment does not. Check the extension too: .jpeg is different from .jpg, and a renamed extension does not convert the underlying file format.

Prefer simple names containing letters, numbers, and hyphens. If a filename includes spaces or unusual characters, inspect the requested URL and verify its encoding. Renaming an asset is reasonable, but update its HTML and stylesheet references together.

Background images deserve the same review. Their paths are resolved from the stylesheet's location, so a CSS file inside assets/css can require a different relative path from the HTML page. A visible photograph in an image element does not prove the hero background is working.

Remove temporary and local references

Look for localhost, file addresses, temporary preview hosts, and blob addresses in the generated files. A blob address belongs to the browser session that created it; it is not a permanent image URL you can paste into a public page.

For an external image, open its URL in a logged-out browser. If access depends on your session, other visitors may see a broken image. Avoid hotlinking a third-party image unless its terms and delivery setup permit that use. Your own appropriately licensed asset stored with the site is often easier to maintain.

Recheck the published page

Publish the corrected folder, then inspect the homepage and at least one nested page. Test at phone width, because responsive images or mobile-specific backgrounds can reference different files. Confirm the image response is an image rather than an HTML error page.

Keep the corrected folder as the source for the next upload. If a client owns the site, include the asset directory and a short path note in the website handoff checklist. GeminiLaunch provides the public URL; a complete, consistent upload supplies the images that URL needs.

Prepared with AI assistance using the current public product and linked references. Practical checklists and illustrative examples are original planning aids. They do not establish product guarantees or replace a situation-specific review.

Related guides