Belajar HTML Hyperlink.

ke bawah

Hampir di semua halaman web kita akan menemukan link. Ya, tentu saja internet kan bekerja dari link ke link.
Sebuah link adalah yang apabila kita arahkan kursor diatasnya kemudian diklik maka akan mengarahkan kita pada tempat yang lain.
Dengan kata lain sebuah hyperlink atau disingkat dengan link adalah merupakan akses untuk menuju tempat lain pada halaman web.
Sebuah link dapat berupa text atau gambar.
Link didefinisikan menggunakan tag <a> dengan atribut href:


Tag <a> dapat digunakan untuk 2 tujuan :

• Untuk membuat link ke dokumen lain menggunakan atribut href.
• Untuk membuat bookmark dalam dokumen, menggunakan atribut name:

Contoh berikut adalah pola sederhana cara menulis kode html membuat link :

<a href="url"> text_link </a>

Link ke homepage situs lain.

Untuk membuat link ke homepage (halaman pertama) suatu situs web, kita kita cukup menuliskan alamat url-nya saja.

Sebagai contoh misalnya kita akan membuat link ke situs yahoo mobile , alamatnya adalah: "http://m.yahoo.com/". Maka untuk membuat link-nya adalah seperti berikut ini:

Link menuju situs

<a href="http://m.yahoo.com"> yahoo mobil </a>

hasilnya :
Link menuju situs yahoo mobil

Link ke bagian tertentu halaman yang sama.

Untuk membuat link menuju bagian atas halaman yang sama, caranya cukup mudah yaitu kita cukup menuliskan alamat "#top" setelah atribut href. Cara menulis html nya seperti berikut ini:

<a href="#top">
Kembali ke atas

</a>

hasilnya :

Kembali ke atas



Sedangkan untuk membuat link ke bagian bawah halaman, maka pada tempat yang akan dituju kita harus menempatkan nama dari tempat yang akan dituju oleh link tersebut. Misalnya kita akan memberi nama pada bagian paling bawah halaman dengan nama "bawah", maka pada bagian paling bawah halaman kita harus mencantumkan:

<a name="bawah"> </a>

Dan untuk membuat link nya seperti ini :

<a href="#bawah"> ke bawah </a>

hasilnya : ke bawah .

Link menuju topik tertentu pada situs yang sama.

Seperti halnya pada cara membuat link menuju bagian tertentu pada halaman yang sama di atas, untuk membuat Link menuju topik tertentu pada situs yang sama, kita juga harus menempatkan nama atau id pada judul topik yang akan dituju oleh link tersebut. Misalnya pada topik dengan nama judul: "cara membuat", maka sebelumnya kita harus menuliskan nama topik di sekitar judul topik tersebut (sebelum atau sesudah) seperti ini :

<a name="cara membuat"> </a>

Atau kita juga bisa menambahkan atribut "id" pada tag yang ditempati oleh judul topik tersebut, misalnya judul topik cara membuat berada pada tag h3, maka kita bisa menambahkan atribut id pada tag tersebut seperti ini :

<h3 id="cara membuat"> cara membuat </h3>

Dan untuk membuat linknya ditulis seperti ini :
Kita menuju ke topik :

<a href="#cara membuat"> cara membuat </a>

hasilnya :

Kita menuju ke topik: cara membuat

Cara diatas berlaku apabila tempat yang dituju berada pada folder yang sama dengan dokumen tempat pembuatan link. Tetapi jika folder dokumen yang dituju berbeda folder dengan tempat link dibuat, tetapi masih pada satu situs, maka harus ditulis "nama folder"nya diikuti dengan "nama topik" yang dituju.

<a href="/nama_folder/
#nama topik"> nama topik
</a>

Link menuju ke topik tertentu pada situs lain.

Untuk membuat link menuju topik tertentu pada situs lain, kita harus menulisnya dengan lengkap dan tepat, yaitu "alamat url" dan "nama topik"nya. Dan cara membuat link-nya seperti ini

<a href="http://alamat_url/
nama_topik.htm"> nama topik
</a>

Link menuju situs Aneka Cara dengan topik:
Belajar HTML/CSS

Email link

Email link dimaksudkan untuk akses mengirim pesan email dari alamat email milik pengunjung situs ke alamat email tempat layanan milik situs. Untuk membuat email link digunakan atribut mailto.

<a href="mailto: alamat-email"> link teks </a>

Jika ada pertanyaan, silakan kirim email ke bagian pelayanan kami.

Link dengan gambar.

Selain dengan teks biasa, untuk membuat link juga bisa menggunakan gambar, gambar yang digunakan dapat berformat gif, png jpg atau format lainnya.

<a href="http://url_situs">
<img src="alamat_gambar/
nama_gambar.jpg"
alt="gambar" />
</a>

Klik gambar berikut utuk menuju facebook mobile:

Thumbnail link.

Thumbnail link adalah sebuah link dengan gambar yang diperkecil untuk melihat gambar asli ( ukuran sebenarnya ) yang jauh lebih besar dari gambar yang digunakan pada link. Gambar duplikat yang ukurannya kecil yang digunakan untuk link ini disebut Thumbnail . Ukuran gambar yang sebenarnya itu baru dapat dilihat setelah kita meng-klik linknya.

<a href="lokasi gambar asli">
< img src="lokasi gambar thumbnail" alt="thumbnail" />
</a>

klik gambar ini untuk melihat gambar ukuran sebenarnya.

Target link.

Secara default sebuah link apabila diklik akan menempati jendela yang sama dengan jendela (halaman) tempat link itu berada, artinya halaman yang dituju oleh link tersebut akan menggantikan halaman tempat link yang di klik tadi berada.

Agar halaman dari sebuah link yang apabila di klik muncul di jendela baru ( halaman baru ) maka dalam pembuatan link harus ditambahkan atribut target="_blank" pada tag <a>.

<a href="alamat_url" target="_blank"> halaman-situs </a>

Lebih jelas tentang target link akan dibahas pada topik rmembuat Frame.

ke atas