 |
Hay kawan E-Weblog?
Admin punya ilmu baru nih, kali ini tentang cara membuat link pada web. Oh ya sebagian besar pasti udah tau apa itu link, namun disini admin akan menjelaskan lebih lanjut agar para newbie lebih paham lagi tentang link. Oke, kita langsung aja ke materi.
Link HTML
Dokumen HTML menggunakan hyperlink (anchor) untuk menghubungkan kepada dokumen lain. Dokumen ini bisa berupa teks dan / atau gambar yang saling menghubungkan menuju ke dokumen atau bagian lain dalam suatu dokumen. Browser web akan menyorot teks atau gambar yang di identifikasi sebagai link dengan warna atau garis bawah untuk menunjukkan bahwa itu adalah hyperteks link sering di singkat hyperlink atau link saja.
- Tag Anchor : Tag <a> untuk membuat suatu link kepada dokumen lain dalam web. Atribut pada tag <a> diantaranya: atribut href="url" untuk mendefinisikan lokasi link, atribut name="name" untuk mendefinisikan nama link, dan atribut target="_blank"|"_parent"|"_top"|"_self". untuk _blank akan membuka pada window baru, _parent/_top akan keluar dari frame, _self akan tetap di window browser.
<!DOCTYPE html>
- Link Relatif : Dibuat untuk membuat suatu link pada page anda ke page lain pada komputer yang sama, tidak memerlukan menggunakan alamat internet yang lengkap. Jika kedua page pada direktori yang sama, anda dapat menuliskan nama file html sebagai berikut:
<html>
<head>
<title>Contoh Penggunaan Link Relatif</title>
</head>
<body>
Anda ingin melihat format font pada latihan5.html, silahkan klik <a href="latihan5.html">link berikut</a>.
</body>
</html>
maka hasilnya akan seperti ini:
 |
<!DOCTYPE html>
Link Absolut Dibuat untuk membuat link ke page web lain yang berada pada web site lain di internet. Dalam hal ini kalian harus menuliskan alamat internet secara lengkap. Berikut adalah contohnya:
<html>
<head>
<title>Contoh Penggunaan Link Absolut</title>
</head>
<body>
Anda ingin mengunjungi situs resmi amikom. Silahkan klik <a href="http://www.amikom.ac.id">link berikut</a>.
</body>
</html>
maka hasilnya akan seperti ini:
Apabila link diklik maka akan langsung pergi ke web amikom seperti ini:
 |
Sintaks penulisannya :
- Link ke Bagian Lain dalam Dokumen: Link jenis ini dibuat apabila untuk dokumen yang panjang sekali, sehingga apabila di tampilkan dalam browser web akan mengharuskan kita melakukan scroll layar berulang-ulang. Navigasi untuk penelusuran dokumen dapat dimudahkan dengan membuat link antarbagian, dengan menandai setiap bagian tersebut dengan memberinya nama. Sehingga pada beberapa tempat di dalam dokumen akan ada bagian yang bernama, dan dibagian lainnya dapat diletakkan link untuk menuju bagian-bagian tersebut. Ini seperti cara back to top.
<a href="#tujuan">Link asal</a>
Artikel bebas
.
.
.
<a name="tujuan">Posisi tujuan</a>
Artikel bebas
.
.
.
Bagi yang masih penasaran silahkan ketik script ini:
<!DOCTYPE html>
<html>
<head>
<title>Contoh Penggunaan Link Dalam Dokumen</title>
</head>
<body>
<p>
<a name="top">
<a href="#Bab4">
Lihat Bab 4.
</a>
</a>
</p>
<h2>Bab 1</h2>
<p>Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.Bab 1 adalah menjelaskan bla bla bla.</p>
<h2>Bab 2</h2>
<p>Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.Bab 2 adalah menjelaskan bla bla bla.</p>
<h2>Bab 3</h2>
<p>Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.Bab 3 adalah menjelaskan bla bla bla.</p>
<a name="Bab4">
<h2>Bab 4</h2>
</a>
<p>
Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.Bab 4 ini menunjukkan tujuan dari link dalam satu halaman.</p>
<h2>Bab 5</h2>
<p>
Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla. Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla.Bab 5 adalah menjelaskan bla bla bla. </p>
<a href="#top">Kembali ke atas</a>
</body>
</html>
Selamat Mencoba :-)
Mungkin cukup sekian dulu yang bisa E-Weblog berikan, nantikan informasi lainnya dilain kesempatan. Jangan lupa tetap kunjungi blog ini ya :-)
See u next time,...
Salam NetBie...
Tidak ada komentar:
Posting Komentar