Demon Tech Roadmap

HTML

HTML File Paths

HTML file paths locate files within a website.

Read Time

5 min read

Difficulty

Beginner

Last Updated

Jun 15, 2026

Version

v1.0.0

Introduction

HTML needs file paths to link images, styles, and scripts. Absolute URLs point to external websites, while relative paths point to local files. A slash indicates a folder level.

Syntax

1<!-- file path syntax -->
2<img src="/images/photo.jpg" alt="Photo">

Example

1<!-- this uses relative paths -->
2<!DOCTYPE html>
3<html lang="en">
4  <head>
5    <meta charset="UTF-8">
6    <meta name="viewport" content="width=device-width, initial-scale=1.0">
7    <title>Paths</title>
8  </head>
9  <body>
10    <img src="assets/logo.png" alt="Logo">
11    <a href="../index.html">Go Back</a>
12  </body>
13</html>

Try it Yourself

Hands-on Practice

Modify the code below to see how it affects the output. This is the best way to learn!

Interactive Editor

1234567891011121314151617181920

Live Preview

Key Points

Absolute URLs link to other domains.
Relative paths point to local website files.
The `../` syntax moves up one folder.
The `/` syntax starts at the root folder.

Up Next

Continue your journey with the next topic.

Go to HTML Head ❯