Thursday, July 9, 2009

Memahami Tag Anchor

Posted by dav On 4:25 AM
Anchor kalau diterjemahkan kedalam bahasa Indonesia (Prof. Drs. S. Wojowasito, Kamus Lengkap Inggris - Indonesia 1980:6) berarti jangkar; sauh. Entah apa hubungannya antara Tag Anchor pada bahasa HTML dengan Anchor dalam arti sebenarnya? Tetapi kalau ditelaah mengandung tujuan yang sama. Anchor dalam arti sebenarnya adalah jangkar, suatu alat yang digunakan untuk mengkaitkan kapal dipelabuhan atau sebagai alat pengait.
Begitupun anchor dalam bahasa HTML, digunakan untuk mengaitkan/link suatu dokumen/halaman terhadap dokumen/halaman lainnya[1]. Jika suatu kata atau kalimat dalam sebuah halaman web memiliki keterkaitan/link dengan dokumen/halaman lain, maka browser akan menampilkan kata atau kalimat tersebut dengan format berbeda. Secara standar kata atau kalimat anchor (terkait dengan halaman lain) akan berwarna biru dengan garis bawah, hal ini sering pula disebut hyperteks link, hyperlink atau link saja.
Memahami Tag Anchor HTML

Tag Anchor

Sesuai dengan standar bahasa HTML, anchor menggunakan tag <a> untuk membuat suatu link terhadap dokumen lain dalam web. Tag <a> digunakan untuk mendefinisikan suatu kata atau kalimat yang akan dikaitkan dengan halaman lain dalam web. Perhatikan contoh dibawah ini :
Hari minggu aku bertemu <a href="http://dedehendriono.blogspot.com">Hendriono</a>.
Kata Hendriono terletak diantara tag anchor, ini berarti kata Hendriono adalah kata yang dikaitkan dengan halaman lain atau dibuat sebagai anchor. Sedangkan href adalah atribut anchor yang digunakan sebagai referensi halaman yang dituju, halaman yang dituju terletak diantara tanda kutip "http://dedehendriono.blogspot.com".

Atribut href

Atribut href selalu digunakan bersama anchor, karena tag anchor tidak akan lengkap tanpa href. href atau hyperlink refference (ma'af ini tanpa sumber) mempunyai tiga jenis, yaitu :

1. Link Relatif
Jenis link relatif digunakan untuk membuat suatu link halaman yang akan dikaitkan dengan halaman lain dan halaman terkait masih dalam satu komputer. Jika dua halaman terdapat pada direktori yang sama maka tidak perlu menggunakan alamat internet yang lengkap. Cukup dengan menuliskan nama file html tersebut, seperti dibawah ini :
<a href="halaman_2.html">Halaman 2</a>

2. Link Absolute
Jenis Link Absolut digunakan untuk membuat link ke halaman lain yang berada di website lain di Internet. Maka alamat halaman tersebut harus ditulis lengkap, seperti dibawah ini :
<a href="http://dedehendriono.blogspot.com/wulan_guritno_xxx.html">Wulan Guritno tidak berpakaian</a> ketika sedang mandi.

3. Link dalam dokumen yang sama
Link ini digunakan jika halaman tersebut panjang dan ada kalimat yang akan dijelaskan kemudian pada paragraf berikutnya, maka penggunaan link internal page sangat membantu para pembaca. Pembaca tidak perlu mencari artikel mana yang terhubung dengan artikel yang sedang dibaca pada halaman yang sama. Pembaca cukup mengklik kata yang sedang dibaca untuk mengetahui maksud dan penjelasannya pada paragraf berikutnya.
Contoh penggunaan link dalam dokumen yang sama :

Paragraf 1
<a href="#johntitor">John Titor</a> menyebutkan bahwa paradoks itu SALAH. Sebab jika si A balik ke masa lalu ataupun maju ke masa depan, dia akan mendarat di DUNIA LAIN serupa tapi tak sama.
...
...
Paragraf 10
<a name="johntitor">John Titor</a> mengaku sebagai tentara Amrik dari tahun 2036. Dia menge-post foto mesin waktunya dan buku manualnya. John diperintahkan balik ke tahun 1970an untuk mengambil komputer kuno milik kakeknya (IBM 5100).

Perhatikan contoh diatas :
Yang diberikan tag anchor href adalah John Titor paragraf 1 dan ketika pembaca meng-klik John Titor pada paragraf 1, maka artikel akan bergeser ke paragraf 10 yang menjelaskan tentang siapa John Titor.

Target href

Secara default (standar) setiap kita membuat tag anchor href maka ketika pembaca meng-klik link tersebut halaman yang di tuju akan dibuka dan menutup halaman yang sedang dibaca. Kita bisa mengarahkan pembaca ketika mereka meng-klik link tersebut, halaman baru akan terbuka tanpa menutup halaman yang sedang dibaca. Hal seperti ini sering disebut Target Anchor Link, yang terdiri dari;
  • target="_top"; dengan penambahan target="_top" pembaca akan diarahkan pada artikel yang dituju dengan membuka halaman baru dan posisinya diatas halaman yang sedang dibaca tanpa menutup halaman yang sedang dibaca.
  • target="_blank"; dengan penambahan target="_blank" pembaca akan diarahkan pada artikel yang dituju dengan membuka halaman baru dan posisinya dibelakang halaman yang sedang dibaca tanpa menutup halaman yang sedang dibaca.
Mudah-mudahan artikel ini bermanfaat... Happy Blogging :)

Catatan Kaki:
[1] Wikipedia : HTML a tag