Ada dua cara untuk menuliskan "alamat" suatu file dalam komputer. Pada aplikasi console, perbedaan kedua cara tersebut terkait dengan letak dari "direktori atau folder yang aktif" saat aplikasi mengakses file tersebut. Sedangkan pada file HTML, acuan yang digunakan adalah posisi file HTML yang mengakses file tersebut.
"Alamat lengkap (dan unik)" dari suatu file disebut sebagai "absolute path". Absolute path dimulai dengan nama partisi atau nama domain. Absolute path bisa diubah menjadi relative path dangan membuang sebagian dari nama "alamat absolute"-nya.
"Alamat lengkap (dan unik)" dari suatu file disebut sebagai "absolute path". Absolute path dimulai dengan nama partisi atau nama domain. Absolute path bisa diubah menjadi relative path dangan membuang sebagian dari nama "alamat absolute"-nya.
Saat kalian hanya menuliskan nama file sebagai nilai atribut href atau src, nama file tersebut dianggap sebagai alamat relatif. Alamat atau posisi file ditentukan oleh folder tempat file HTML yang menggunakannya.
Misalnya :
Misalnya => B:\Indonesia\Lampung\Pringsewu\Gadingrejo\Wates_Selatan\
Jika kita mengakses data milik folder "Wates Selatan" dari wilayah Pringsewu, maka kita cukup menulis "Gadingrejo\Wates Selatan\....". Atau, jika seseorang bertanya di mana wilayah Wates selatan yang ada di Pringsewu, kita cukup menyebut "kecamatan Gadingrejo, desa Wates Selatan".
Mari kita praktekkan dengan membuat satu proyek yang berisi satu kode HTML dan 2 gambar yang berbeda.
Misalnya :
- Absolute path gambar yg akan diakses : "D:\proyekku\gambar\gambarku.jpg"
- Letak file HTML yg mengakses gambar : "D:\proyekku\fileku.html"
- Karena file HTML-nya ada di folder "D:\proyekku", maka relative path dari gambar berdasarkan posisi file HTML yang mengaksesnya : "gambar\gambarku.jpg"
- {Folder tempat file html}+{relative path} => {absolute path}
- "D:\proyekku\"+"gambar\gambarku.jpg" => "D:\proyekku\gambar\gambarku.jpg
Misalnya => B:\Indonesia\Lampung\Pringsewu\Gadingrejo\Wates_Selatan\
Jika kita mengakses data milik folder "Wates Selatan" dari wilayah Pringsewu, maka kita cukup menulis "Gadingrejo\Wates Selatan\....". Atau, jika seseorang bertanya di mana wilayah Wates selatan yang ada di Pringsewu, kita cukup menyebut "kecamatan Gadingrejo, desa Wates Selatan".
Mari kita praktekkan dengan membuat satu proyek yang berisi satu kode HTML dan 2 gambar yang berbeda.
- Buat satu folder kosong dengan nama "ortu".
- Isi dengan gambar berformat jpg, lalu beri nama "gambarku.jpg".
- Buat folder baru dalam folder "ortu" yang sudah kita buat, dan beri folder tesebut nama dengan nama "anak".
- Kemudian, isi folder kosong tersebut dengan gambar yang berbeda dengan gambar pertama. Beri nama gambar tersebut dengan nama "gambarku.jpg".
- Sekarang, ketiklah kode HTML dibawah ini dan simpan di folder "ortu".
<HTML>
<HEAD>
<TITLE>Belajar HTML</TITLE>
</HEAD>
<BODY>
<IMG src='gambarku.jpg' />
<IMG src='anak/gambarku.jpg' />
</BODY>
</HTML>Setelah menyimpan, silakan jalankan kode HTML-nya, dan lihat hasilnya!!! Gambar mana yang terlihat paling atas? Jika penulisan alamat filenya salah, maka gambar tidak akan terlihat.
Tag <Base>
Alamat relatif seharusnya mendapat awalan sesuai folder dari program, script, atau file HTML yang mengaksesnya. Tapi, itu tidak berlaku jika ada tag <base>.
<HTML>
<HEAD>
<TITLE>Belajar HTML</TITLE>
<base href="https://www.codelogi.com/p/">
</HEAD>
<BODY>
<a href='css.html' />Klik di sini</a>
</BODY>
</HTML>Saat diklik, link tersebut akan menuju "https://www.codelogi.com/p/css.html". Itu karena nilai dari href di dalam tag <base> ditambahkan sebagai awalan dari href di dalam tag <a>. Jika kalian menghilangkan tag <base>, maka file yang dituju adalah file "css.html" yang terletak di dalam folder yang sama dengan file yang berisi kode html di atas. Selain atribut href, kalian juga bisa menambahkan atribut target pada tag <base>.