Pranala (link), disebut juga hyperlink, adalah dasar navigasi internet. Hyperlink digunakan untuk semua hal mulai dari menjelajah bookmark pada halaman yang sama, sampai mengunduh aplikasi dan melompat ke halaman web dari server lain. Misalnya pada contoh berikut ini:

Untuk mempelajari lebih lanjut, silakan lihat: <a href="http://id.wikipedia.org/wiki/Halaman_Utama">Wikipedia</a>.

Perbandingan absolut dan relatif

sunting

Sebelum membuat hyperlink, ada baiknya diketahui perbedaan antara URL absolut dan relatif. Pertama, URL absolut dapat digunakan untuk meneruskan peramban (browser) ke sembarang lokasi. Misalnya, URL absolut adalah seperti:

http://www.google.co.id/

Namun, saat perlu membuat link ke beberapa objek dengan pohon direktori sama dengan halaman web tersebut, langkah ini kurang praktis, dengan mengetikkan seluruh URL pada setiap objek yang dihubungkan dengan link tersebut. Maka ada URL relatif. URL relatif menunjuk ke path (jalur) relatif terhadap direktori saat ini dari halaman web. Contohnya:

index.html
./index.html
../index.html

Ini adalah URL relatif yang akan menunjuk ke berkas HTML yang bernama index.html yang berada di direktori (folder) yang sama dengan halaman web yang sedang dibuka dan mengandung link itu. Dalam contoh yang mirip:

images/top_banner.jpg

Ini adalah URL relatif yang menunjuk ke subdirektori yang disebut images yang mengandung berkas bernama "top_banner.jpg".

Menghubungkan ke sebuah lokasi dalam halaman web dengan Anchor

sunting

Sesekali, menentukan sebuah pranala ke suatu halaman tidak cukup. Anda mungkin ingin menghubungkan ke tempat tertentu dalam dokumen. Hal ini serupa dengan buku, yang disebut "Paragraf ketiga dari halaman 32", dibandingkan dengan hanya mengatakan "halaman 32". Tag anchor (<a>) juga dapat digunakan untuk ini. Misalnya Anda ingin sebuah link dari dokumen a.html ke lokasi tertentu dalam sebuah dokumen b.html. Maka Anda akan mulai dengan menamai lokasi yang dimaksud di b.html. Ini dilakukan dengan menambahkan tag <a name="sebuah_nama"> (dengan sebuah_nama adalah string / kata pilihan Anda) pada lokasi yang dimaksud pada b.html. Sekarang lokasi itu dapat dirujuk dengan <a href="b.html#sebuah_nama"> dari a.html.

Pranala target

sunting

Kini kita telah siap membuat sebuah hyperlink. Ini adalah sintaks dasarnya:

<a href="lokasi URL" target="target">Alias</a>;

Pada sintaks di atas, "lokasi URL" adalah path relatif atau absolut ke objek yang akan dihubungkan. "target" adalah atribut opsional yang menentukan tempat objek yang terhubung akan ditampilkan. Misalnya:

<a href="http://www.google.co.id" target=0>Mesin Pencari Google</a>

Contoh ini menggunakan target "0".