Bagaimana penulisan script html yang benar untuk membuat sebuah hyperlink?

Link atau tautan merupakan elemen HTML yang berfungsi untuk menghubungan suatu halaman web ke halaman lain.

Section Artikel

• 1 Links di HTML – Hyperlink
• 2 Links di HTML – Sintaks
• 3 Link di HTML – Atribut target
• 4 URL Absolut vs. URL Relatif
• 5 Link di HTML – Link Gambar
• 6 Link ke Alamat Email
• 7 Tombol sebagai Link
• 8 Title Link
• 9 Lanjutan URL Absolut dan URL Relatif
• 10 Ringkasan

Links di HTML – Hyperlink

Link HTML adalah hyperlink.

Kita dapat mengklik link dan melompat ke dokumen atau halaman web lain lain.

Saat kita ingin menggerakkan mouse ke atas link, biasanya panah mouse akan berubah menjadi tangan kecil.

Catatan: Link tidak harus berupa teks. Link bisa berupa gambar atau elemen HTML lainnya!

Links di HTML – Sintaks

Tag di HTML mendefinisikan hyperlink. Seperti berikut:

link text

Atribut terpenting dari elemen adalah atribut href, yang menunjukkan tujuan link.

Teks link adalah bagian yang akan terlihat oleh user.

Ketika di klik teks link, maka link akan mengirim user ke alamat URL yang ditentukan.

Contoh :
Contoh ini menunjukkan cara membuat tautan ke dosenit.com:

Visit DosenIT.com!

Secara default, tautan akan muncul seperti berikut ini di semua browser:

• Link yang belum dikunjungi digarisbawahi dan berwarna biru
• Link yang dikunjungi digarisbawahi dan berwarna ungu
• Link aktif digarisbawahi dan berwarna merah

Link di HTML – Atribut target

Secara default, halaman yang ditautkan akan ditampilkan di jendela browser saat ini. Untuk mengubahnya, kita harus menentukan target lain untuk tautan tersebut.

Atribut target menentukan tempat untuk membuka dokumen terkait.

Atribut target dapat memiliki salah satu dari nilai berikut:

• _self – Default. Membuka dokumen di jendela / tab yang sama seperti yang diklik
• _blank – Membuka dokumen di jendela atau tab baru
• _parent – Membuka dokumen di bingkai induk
• _top – Membuka dokumen di seluruh badan jendela

Contoh :

Gunakan target = “_ blank” untuk membuka dokumen yang ditautkan di jendela atau tab browser baru:

Visit DosenIT.com!

URL Absolut vs. URL Relatif

Kedua contoh di atas menggunakan URL absolut (alamat web lengkap) di atribut href.

Link lokal (tautan ke halaman dalam situs web yang sama) ditentukan dengan URL relatif (tanpa bagian “https: // www”):

Contoh

Absolute URLs
DosenIT
Google

Relative URLs
HTML Images
CSS Tutorial

Link di HTML – Link Gambar

Untuk menggunakan gambar sebagai link , cukup letakkan tag

Link ke Alamat Email

Gunakan mailto: di dalam atribut href untuk membuat tautan yang membuka program email pengguna (untuk memungkinkan mereka mengirim email baru):

Contoh :

Send email

Tombol sebagai Link

Untuk menggunakan tombol HTML sebagai link, kita harus menambahkan beberapa kode JavaScript.

JavaScript memungkinkan kita untuk menuliskan fungsi tertentu, seperti mengklik tombol:

Contoh :

HTML Tutorial

Title Link

Atribut title digunakan untuk menambahkan informasi suatu elemen. Informasi ini paling sering ditampilkan sebagai teks keterangan saat mouse bergerak di atas elemen.

Contoh :

Visit our HTML Tutorial

Lanjutan URL Absolut dan URL Relatif

Contoh
Gunakan URL lengkap untuk menautkan ke halaman web:

HTML tutorial

Contoh
Link ke halaman yang terletak di folder html di situs web saat ini:

HTML tutorial

Contoh
Link ke halaman yang terletak di folder yang sama dengan halaman saat ini:

HTML tutorial

Ringkasan

• Gunakan elemen untuk menentukan link
• Gunakan atribut href untuk menentukan alamat link
• Gunakan atribut target untuk menentukan tempat membuka dokumen terkait
• Gunakan elemen (di dalam elemen ) untuk menggunakan gambar sebagai link
• Gunakan skema mailto: di dalam atribut href untuk membuat link yang membuka program email