Tutorial HTML

Membuat Tautan atau Hyperlink dalam HTML

Hyperlink atau tautan dalam HTMl sangatlah penting karena ia yang menghubungkan antara satu alaman dengan halaman lain. Untuk membuat Hyperlink, bahan yang diperlukan adalah <a>. Tag ini kependekan dari anchor. Lihat kode di bawah ini.

kode diatas hasilnya akan seperti dibawah ini

Klik Saya

Atribut href pada tag <a> berfungsi sebagai tempat informasi alamat yang dituju. Apabila kalian ingin alamat yang dituju adalah google maka tuliskan href="http://www.google.com". Cara penulisan alamat ini ada dua macam yaitu absolut dan relatif. Penulisan alamat absolut adalah penulisan alamat yang lengkap sedangkan relatif yang alamat singkatnya. Sekarang begini anggap kalian tinggal di daerah terpencil di pulau Rote (ada yang tahu pulau Rote?). Kalian berniat mengirim surat ke Jakarta melalui pos. Kalian pasti akan menuliskan alamat lengkapnya besert RT RW dan Kelurahannya untuk memastikan surat tersebut sampai di tujuan bukan? Namun apabila kalian akan mengirim surat ke teman yang rumahnya hanya berbeda 3 rumah dari rumah kalian, kalian dapat menuliskan nomor rumah dan menitipkannya pada ketua RT untuk menyampaikannya bukan?

Hal yang sama dapat kalian analogikan ke dalam tipe penulisan alamat href. Tipe Absolut adalah penulisan alamat lengkap menggunakan RT RW dan Kelurahan yang dalam html contohnya seperti ini,

Tipe absolut ini digunakan apabila alamat yang dituju jauh diluar tempat penyimpanan halaman yang kalian edit sekarang. Namun apabila kalian mempunyai dua file dalam satu folder yaitu coba1.html dan coba2.html, dan kalian sekarang sedang mengedit halaman coba1.html. Apabila kalian ingin menaruh tautan ke halaman coba2.html maka kalian cukup menulis sebagai berikut

<a href="coba2.html">Klik untuk menuju halaman coba2</a>

Lihat perbedaannya, yang absolut menggunakan http:// dan juga menuliskan folder-folder yang menyertainya, sedangkan yang relatif cukup menuliskan nama file yang dituju karena berada dalam satu folder.

Hyperlink juga bisa diletakkan dalam gambar. Caranya sama persis seperti menaruh hyperlink pada tulisan hanya saja tag <a> dan </a> menjepit tag gambar <img>. Sekarang perhatikan kode di bawah ini.

Kode diatas adalah contoh hyperlink dimana ketika gambar kodok di klik maka halaman coba2.html akan terbuka. Karena gambar "gambarkodok.jpg" ditulis dalam bentuk relatif maka gambar kodok tersebut diletakkan dalam satu folder yang sama. Jika tidak maka gambar kodok tersebut tidak akan muncul. Untuk belajar lebih lanjut tentang penempatan gambar pada halaman web silahkan buka pelajaran sebelumnya "Meletakkan Gambar pada halaman HTML".

Dalam membuat hyperlink juga ada pilihan untuk jendela pembukanya, apakah di halaman yang sama atau di halaman baru sehingga halaman sebelumnya tidak tertutup. Untuk membuat pilihan seperti ini tambahkan atribut target pada tag <a>. Lihat kode dibawah ini.

<a href="http://klikbelajar.com" target="_blank">Munculkan

Klikbelajar.com di halaman baru</a>

<a href="http://klikbelajar.com">Munculkan

Klikbelajar.com di halaman ini</a>

Apabila kalian menginginkan halaman baru dibuka di jendela yang lain maka gunakan target="_blank" sedangkan apabila kalian menginginkan halaman yang dibuka pada halaman itu juga maka hilangkan atribut target maka ia secara default akan membuka pada halaman itu sendiri.

oke Gan silahkan di coba. jika ada kesulitan YM aja ya. thx