HTML File Paths

HTML File Paths का उपयोग files और resources (images, CSS, JavaScript, pages) को सही location से load करने के लिए किया जाता है।
सही file path न होने पर image, script या page load नहीं होता।

File Path क्या होता है

File path यह बताता है कि कोई file कहाँ स्थित है और browser उसे कहाँ से load करे।
HTML में file paths mainly src और href attributes के साथ use होते हैं।

File Paths के Types

HTML में दो प्रकार के file paths होते हैं:

Absolute File Paths
Relative File Paths

Absolute File Path क्या होता है

Absolute file path में पूरी URL या complete location दी जाती है।

<img src="https://www.example.com/images/logo.png">

यह file internet पर किसी specific location से load होती है।

Absolute Path के Features

Full URL होता है
External resources के लिए useful
Internet dependency होती है

Relative File Path क्या होता है

Relative file path current HTML file की location के according होता है।

<img src="images/logo.png">

यह image उसी folder के अंदर images directory से load होगी।

Same Folder से File Load करना

अगर HTML file और resource same folder में हैं:

<img src="photo.jpg">

Browser current directory में file search करेगा।

Subfolder से File Load करना

अगर file किसी subfolder में है:

<img src="assets/image.png">

यह assets folder के अंदर image.png load करेगा।

Parent Folder से File Load करना

Parent folder से file load करने के लिए ../ use किया जाता है।

<img src="../images/pic.jpg">

../ एक level ऊपर के folder को represent करता है।

Multiple Levels Up जाना

<img src="../../images/logo.png">

यह दो folder levels ऊपर जाकर file search करेगा।

Root Relative Path

Root relative path website के root folder से start होता है।

<img src="/images/logo.png">

यह path domain के root से start होता है, current folder से नहीं।

File Paths with CSS

CSS file link करने के लिए:

<link rel="stylesheet" href="css/style.css">

यह css folder के अंदर style.css load करेगा।

File Paths with JavaScript

JavaScript file include करने के लिए:

<script src="js/script.js"></script>

Correct path न होने पर script run नहीं करेगी।

File Paths in Links

HTML pages के बीच navigation के लिए:

<a href="about.html">About Us</a>

या subfolder page के लिए:

<a href="pages/contact.html">Contact</a>

Case Sensitivity का ध्यान रखें

Linux servers पर file paths case-sensitive होते हैं।

Wrong:

<img src="Images/photo.jpg">

Correct:

<img src="images/photo.jpg">

Common File Path Mistakes

Wrong folder name
Extra or missing ../
Case mismatch
Absolute path unnecessarily use करना

Best Practices

Relative paths prefer करें
Clear folder structure रखें
Lowercase file names use करें
Root-relative paths carefully use करें

Real World Folder Structure Example

website/
├── index.html
├── images/
│   └── logo.png
├── css/
│   └── style.css
└── js/
    └── script.js

HTML file से:
images → images/logo.png
CSS → css/style.css
JS → js/script.js

Summary

HTML File Paths resources को locate करने का तरीका बताते हैं।
Relative paths website development में सबसे ज्यादा use होते हैं।
Correct file paths से pages fast, clean और error-free load होते हैं।