Asset Paths and Why They Break

An image can exist perfectly in source and still fail in the browser.

The missing piece is often the generated URL.

Basic source

<img src="/assets/images/robot.jpg" alt="Small line-following robot on a test track">

Locally at the domain root, that path may work.

Deploy under a repository subpath and the same root-relative assumption can fail.

Use the deployment model

If your site must respect baseurl, use Jekyll's URL helpers for internal assets where appropriate:

<img src="{{ '/assets/images/robot.jpg' | relative_url }}"
     alt="Small line-following robot on a test track">

Build and inspect the generated src.

Diagnostic sequence

When an image is missing:

1. Does the source asset exist?
2. Did Jekyll copy/process it into _site?
3. What src did the template generate?
4. What URL did the browser request?
5. Does that generated path match the deployment root?

Controlled failure

Intentionally reference:

/assets/images/ROBOT.jpg

when the file is actually lowercase.

On some filesystems, case assumptions may be exposed differently than on others.

Record what your environment does and remember that production may be less forgiving.

Portfolio action

Audit all current image/style/script references.

Mark every path as:

external
internal-relative
root-relative
Jekyll-generated relative URL
absolute URL

Checkpoint

Explain why "the image is in the repo" does not prove "the browser can request the generated image URL."