Link HTML

Link HTML

Link mengarahkan kita pada hampir semua halaman web. Link dapat di klik user dari satu halaman ke halaman lain.

 

Hyperlink (Link) HTML

Link dalam HTML didefinisikan oleh tag <a>.

Hyperlink atau link adalah sebuah kata, gabungan kata, atau gambar yang apabila di klik akan membawa user ke dokumen HTML lain.

Ketika kursor mouse diarahkan di atas sebuah link, maka kursor panah akan berubah menjadi icon tangan kecil.

Atribut paling penting dalam tag <a> adalah href, yang menunjukkan link tujuan.

Secara default, link akan tampak seperti berikut:

۩       Link yang belum pernah di klik/dikunjungi (unvisited link) bergaris bawah dan berwarna biru.

۩       Link yang pernah diklik/dikunjungi (visited link) bergaris bawah dan berwarna ungu.

۩       Link yang sedang aktiv/sedang dikunjungi (active link) bergaris bawah dan berwarna merah.

Sintak Link HTML

Kode link HTML paling sederhana adalah seperti berikut:

<a href=”url_tujuan”>kata yang tampil untuk diklik</a>

Atribut href menunjukkan arah tujuan link.

Contoh:

<a href=www.budairi.com>Kunjungi Budairi</a>

Maka pada browser akan tampil Kunjungi Budairi

Dengan meng-klik link, akan mengarahkan user ke halaman utama situs budairi.com.

 

Link tidak hanya berupa teks, namun bisa juga berupa gambar.

Contoh:

<a href=”www.budairi.com” ><img=”sumber_gambar.jpg/></a>

Maka pada browser akan tampil sebuah gambar “sumber_gambar.jpg” yang apabila di klik akan mengarahkan user ke halaman utama situs budairi.com

 

Atribut Target

Atribut target menunjukkan dimana link akan di buka, di jendela yang sama, jendela baru, atau tab baru.

Contoh:

<a href=”www.budairi.com” target=”_blank”>Kunjungi Budairi</a>

Maka apabila link di atas di klik akan dibuka pada tab baru.

 

Atribut Id

Link dapat digunakan untuk mengarahkan user pada bagian tertentu pada sebuah halaman, misalnya bagian download di pojok kanan atas, bagian tips HTML 5 di pojok kanan bawah, dan lain sebagainya.

 

Sebuah anchor dengan id pada sebuah dokumen HTML.

<a id=”tips”>Tips HTML 5</a>

 

Buat link untuk mengarahkan pada “Tips HTML 5” pada dokumen yang sama.

<a href=”#tips”>Kunjungi Tips HTML 5</a>

Apabila lokasi anchor atau tag HTML yang memiliki id “tips” berada di pojok kanan bawah, maka user akan dibawah ke bagian tersebut.

 

Atau buat sebuah link dari halaman lain.

<a href=”www.budairi.com#tips”> Kunjungi Tips HTML 5</a>

 

Tips:

Selalu tambahkan slash (/) pada setiap sub folder (selain halaman utama), misalnya: href=”www.budairi.com/link_html” maka, akan menghasilkan dua permintaan pada server, server akan menambah slash pada bagian akhir alamat terlebih dahulu, baru kemudian akan membuat permintaan baru seperti ini: href=”www.budairi.com/link_html/”.