SEKOLAH TINGGI TEKNOLOGI GARUT fileRizky Ramadhan STT-Garut 3 Hasil program akan tampak seperti gambar dibawah: Ketika meng-klik fotonya, maka akan berpindah halaman, lihat hasilnya

Rizky Ramadhan STT-Garut 1

SEKOLAH TINGGI TEKNOLOGI GARUT

Rizky Ramadhanwww.rizkyramadhansttg.wordpress.com

[email protected]

HiperlinkLink merupakan hubungan antar dokumen atau halaman tertentu dalam suatu dokumen.

Kita sering berpindah – pindah halaman web dengan hanya mengklik suatu huruf , kata, kalimat, bahkan gambar tertentu di dalam halaman web. Agar dokumen kita memiliki kemampuan seperti itu, kita harus memberikan perintah link.

Link Dengan TeksContoh program Link dengan Teks-Buka Notepad dan ketikkan source program berikut:

<HTML><head><title>Hiperlink Teks dan Gambar</title></head><body bgcolor="#d3d3d3"><h2><b>HIPERLINK<b></h2><font size = 4><p> Hiperlink merupakan ciri khas dari world wide web, dimana informasi<br> yang satu dengan yang lainnnya dihubungkan dalam jaringan internet.</p> <hr>Klik pada tulisan<a HREF="D:\Rizky\source1.htm">Link Teks</a> untuk melihat file Teks. <br>Klik pada tulisan<a HREF="D:\Rizky\source2.htm">Link gambar</a> untuk melihat file gambar.<br></HTML>

Simpan dengan nama Source3.htmJalankan dengan browser dan hasilnya akan seperti gambar di bawah ini


Keterangan- Ketika kita meng-klik kata Link Teks, maka kita akan menuju file source1.htm yang berisi

teks.- Ketika kita meng-klik kata Link Gambar, maka kita akan menuju file source2.htm yang

berisi teks dan gambar- File source1.htm dan source2.htm merupakan file yang telah kita buat di latihan

sebelumnya dan tergantung dimana letak anda menyimpannya.

Link dengan GambarSelain Link dengan Teks, kita pun dapat membuat link dengan gambar sehingga kita

tinggal meng-klik gambar tersebut untuk berpindah halaman

Contoh program Link Gambar1- Buka notepad dan ketikkan perintah berikut:

<HTML><head><title>Hiperlink Teks dan Gambar</title></head><body bgcolor="#d3d3d3"><h2><b>HIPERLINK<b></h2><font size = 4><p>Gambar ini adalah foto penulis, untuk ke menu berikutnya<br>silahkan klik foto penulis</p> <hr><a HREF="D:\Education\Web Course\Course 1\Hiperlink\source3c.htm"><IMG SRC="D:\Education\Web Course\Course 1\Hiperlink\Rizky.jpg" align="left" height="150" weight="100"></a> </HTML>

Simpan program pertama dengan nama Source3b.htm , lalu buat file baru

Contoh program Link Gambar2

<HTML><head><title>Hiperlink Teks dan Gambar</title></head><body bgcolor="#d3d3d3"><h2><b>HIPERLINK<b></h2><font size = 4><p>Gambar ini adalah gambar kedua, untuk kembali ke menu sebelumnya<br>silahkan klik foto penulis</p> <hr><a HREF="D:\Rizky\source3b.htm"><IMG SRC="D:\Education\Web Course\Course 1\Hiperlink\Rizky2.jpg" align="left" height="150" weight="100"></a> </HTML>

Simpan dengan nama Source3c.htm dan buka file pertama dengan browser


Hasil program akan tampak seperti gambar dibawah:

Ketika meng-klik fotonya, maka akan berpindah halaman, lihat hasilnya.

Link Dengan E-Mail

Selain dapat dengan cara teks dan gambar, kita juga dapat melakukan link terhadap e-mail tertentu. Yaitu dengan cara menambahkan atribut “mailto:alamat-E-mail” ke dalam tag <a HREF=”…”>

Contoh: <A HREF=mailto:[email protected]>Kirim E-Mail ke Rizky..</A>

Documents

SEKOLAH TINGGI TEKNOLOGI GARUT fileRizky Ramadhan STT-Garut 3 Hasil program akan tampak seperti gambar dibawah: Ketika meng-klik fotonya, maka akan berpindah halaman, lihat hasilnya