Cara Membuat Link pada HTML - Lengkap dengan Penjelasannya

Cara Mwmbuat Link dengan HTML=
Link atau sering disebut Hyperlink merupakan tautan untuk menghubungkan suatu website menuju website lain (External Link), ataupun suatu dokumen ke dokumen lain dalam satu website(Internal Link). 

Biasanya, link sering kali kita klik pada saat mengunjungi suatu website. Karena, pada dasarnya semua website terdiri dari halaman-halaman yang dihubungkan dengan link.
Oleh karena itu, cara penulisan/membuat link sangat penting untuk kita pelajari.
Untuk membuat link pada HTML, kita memerlukan tag <a> (Anchor) dan menggunakan atribut href (Hypertext Reference). Selain itu, kita juga bisa menambahkan atribut lain, seperti target, rel, title ataupun atribut lain.

Membuat Link Pada HTML

External Link

<a href="https://www.youtube.com">Youtube</a>

Hasilnya: Youtube
Artinya, ketika kalian klik link tersebut, kalian akan menuju ke halaman https://www.youtube.com

Internal Link

<a href="/p/daftar-isi.html">daftar-isi.html</a>

Hasilnya: daftar-isi.html
Artinya, ketika kalian klik link tersebut, kalian akan menuju ke halaman daftar isi pada website tersebut.

Menambahkan Atribut Target

Selain menggunakan atribut href kalian juga bisa menambahkan atribut target. Untuk membuka jendela baru kita mengisi atribut target dengan _blank.

<a href="https://renovasi-otak.blogspot.com" target="_blank">Renovasi Otak</a>

Hasilnya: Renovasi Otak
Selain _blank atribut target juga bisa diisi dengan yang lain, seperti _self, _parent, dan _top.

Menambahkan Atribut Title

Atribut ini berfungsi untuk memunculkan informasi tambahan ketika link disentuh.

<a href="mailto:mr.winando@gmail.com" title="Hubungi Kami">Hubungi Kami</a>

Link diatas akan menuju aplikasi mail client karena di atribut href kita isi dengan mailto:mr.winando@gmail.com
Hasilnya: Hubungi Kami

Menambahkan Atribut rel

Atribut ini digunakan untuk menyatakan hubungan halaman dengan link yang di tuju. Sebenarnya ada banyak value yang digunakan pada atribut rel, namun perintah yang paling umum digunakan adalah rel="nofollow". Fungsi dari rel="nofollow" adalah memberikan perintah pada search engine agar tidak mengikuti atau menelusuri link yang mengarah ke luar dari website atau blog kita.

<a href="https://renovasi-otak.blogspot.com" rel="nofollow">Renovasi Otak</a>

Membuat Link pada Dokumen yang Sama

Link jenis ini dibuat terutama untuk dokumen yang panjang, sehingga mengharuskan kita melakukan scrolling berulang-ulang.
Penulisan kode HTML untuk link jenis ini sama seperti penulisan pada link External dan Internal, namun kita perlu mengganti alamat url-nya dengan lokasi yang menuju ke bagian tertentu dan menambahkan lambang “#” di depan nama bagian yang akan dituju tersebut.
Sebelum mengaplikasikan link jenis ini, kita harus menentukan terlebih dahulu bagian mana yang akan menjadi tujuan link dengan menggunakan atribut id.

<h2 id="atribut-tag-link-html">Atribut dan Tag Link pada HTML</h2>

Untuk membuat link agar menuju halaman tersebut, kita menambahkan lambang “#” didepan id yang sudah di tentukan tadi.

<a href="#atribut-tag-link-html">Atribut dan Tag Link pada HTML</a>

Hasilnya: Atribut dan Tag Link pada HTML

Menggunakan Link untuk Memanggil Fungsi Java Script

Salah satu penggunaan Link adalah untuk memanggil fungsi Javascript. Biasanya nama fungsi javascript di tambahkan pada atribut onclick dan href.

<a href="javascript:alert('Selamat Datang')">Klik Aku</a>
<a href="#!" onclick="alert('Selamat Pagi')">Klik Saya</a>

Hasilnya akan seperti ini: Klik Aku | Klik Saya
Nando
Anda di sini hanya untuk persinggahan yang singkat. Jangan terburu, jangan khawatir. Yakinlah bahwa Anda menghirup wangi bunga sepanjang perjalanan.

Luangkan sedikit waktu Anda untuk membagikan "Cara Membuat Link pada HTML - Lengkap dengan Penjelasannya" kepada teman-teman Anda. Hanya dengan menekan Tombol Sosial Media di bawah ini:

Related Posts

Post a Comment

Berlangganan Gratis!

Daftarkan email anda untuk mendapatkan pemberitahuan setiap update artikel terbaru, dan jangan lupa untuk IKUTI Blog kami