12. المسارات المطلقة مقابل المسارات النسبية
يعد فهم كيفية الإشارة إلى الملفات (الصور، CSS، أو صفحات HTML الأخرى) أمراً بالغ الأهمية.
12.1 المسارات المطلقة (Absolute Paths)
المسار المطلق هو رابط URL كامل، بما في ذلك البروتوكول (http:// أو https://) واسم النطاق (domain name). يستخدم هذا للربط بمواقع الويب الخارجية.
html
<!-- مسار مطلق لصورة خارجية --> <img src="https://example.com/images/logo.png" alt="Company Logo">12.2 المسارات النسبية (Relative Paths) (الربط الداخلي)
يصف المسار النسبي موقع الملف بالنسبة للمستند الحالي. يستخدم هذا للربط بين الصفحات والموارد داخل مشروعك الخاص.
لنفترض أن الملف الحالي هو my-project/pages/about.html.
| الرمز (Notation) | المعنى | مثال |
|---|---|---|
filename.ext | في نفس دليل (directory) الملف الحالي. | <a href="contact.html"> |
directory/filename.ext | داخل دليل فرعي (subdirectory). | <a href="blog/post-1.html"> |
../filename.ext | صعود مستوى دليل واحد للأعلى. | <a href="../index.html"> |
مثال على هيكل الملفات:
إذا كنت على about.html (داخل مجلد pages) وتريد الربط بـ home.html (في المجلد الجذر):
html
<!-- ارتقِ مستوى واحداً (..) إلى الجذر، ثم ابحث عن home.html --><a href="../home.html">العودة إلى الصفحة الرئيسية</a>