Understand the web. Build it yourself.

All six exercises / Exercise 01

Find the bug

The missing picture

Find a one-character difference in an image path.

Observe the evidence

The file is stored at /assets/workshop-picture.svg. The server treats filenames as case-sensitive.

Starting code

HTML / JavaScript · EXAMPLE
<img src="/assets/Workshop-picture.svg" alt="Orange landscape">
Give me a hint

Compare the first letter of the filename in the folder and in src.

Read the solution and corrected code
HTML / JavaScript · EXAMPLE
<img src="/assets/workshop-picture.svg" alt="Orange landscape">

On this case-sensitive server, Workshop-picture.svg and workshop-picture.svg are different paths. Some local setups hide this mistake. Check the requested URL and response in the Network panel; do not remove useful alternative text.

Make the lesson your own

Move a copy of a page into a subfolder. Predict how a relative image path changes, then compare it with a path beginning with /.

Read the related guide →

Original exercise by Mario V.W.B.R. Obst with AI assistance. Technical reference: MDN documentation (new tab). Checked September 2026.

Next exercise →