File Path berfungsi untuk menjelaskan lokasi file dalam struktur folder situs web.
Section Artikel
Contoh File Path
| Path | Deskripsi |
| <img src=”picture.jpg”> | File “picture.jpg” terletak di folder yang sama dengan halaman saat ini |
| <img src=”images/picture.jpg”> | File “picture.jpg” terletak di folder images di folder saat ini |
| <img src=”/images/picture.jpg”> | File “picture.jpg” terletak di folder images pada root web saat ini |
| <img src=”../picture.jpg”> | File “picture.jpg” terletak di folder satu tingkat di atas folder saat ini |
Path File HTML
Path File menjelaskan lokasi file dalam struktur folder pada sebuah situs web.
Path File dapat digunakan pada saat sebuah situs web ingin menautkan ke file eksternal, seperti:
- Halaman web
- Gambar-gambar
- Stylesheet
- JavaScripts
Path File Absolute
Path file absolute menunjukan URL lengkap atau jalur lengkap menuju sebuah file.
Contoh :
<!DOCTYPE html> <html> <body> <h2>Menggunakan URL lengkap sebuah File Path</h2> <img src="https://dosenit.com/wp-content/uploads/2019/03/dosen-ti.png" alt="dosenit" style="width:300px"> </body> </html>
Tag <img> dijelaskan lebih lanjut pada bab Gambar di HTML.
Path File Relative
Path file relatif akan menunjuk ke file yang berhubungan dengan halaman saat ini.
Dalam contoh berikut, path file mengarah ke file di folder gambar yang terletak di root web saat ini.
<!DOCTYPE html> <html> <body> <h2>Menggunakan Relative File Path</h2> <img src="03/dosen-it.jpg" alt="dosen-it.png" style="width:300px"> </body> </html>
Dalam contoh berikut ini path file akan mengarah ke file di folder 03 yang terletak di folder saat ini.
<!DOCTYPE html> <html> <body> <h2>Menggunakan Relative File Path</h2> <img src="03/dosen-it.png" alt="dosen-it.png" style="width:300px"> </body> </html>
Dalam contoh berikut, file path akan mengarah ke file di folder 03 yang terletak di folder satu tingkat di atas dari folder saat ini:
<!DOCTYPE html> <html> <body> <h2>Menggunakan Relative File Path</h2> <img src="../03/dosen-it.png" alt="dosen-it.png" style="width:300px"> </body> </html>
Penerapan Terbaik
Penerapan terbaik untuk menggunakan file path relative (jika memungkinkan) adalah :
Saat menggunakan file path relative, halaman web tidak akan terikat ke URL dasar saat ini. Semua tautan akan berfungsi di komputer (localhost) serta di domain publik saat ini dan domain publik yang akan datang.
