Tautan

Huruf H dalam HTML berarti hypertext: teks yang menaut ke teks lain. Satu elemen, a, membuat setiap tautan di web.

Elemen anchor

Tautan dibuat dengan elemen <a>, singkatan dari anchor (jangkar). Atribut href-nya memuat alamat tujuan, dan kontennya adalah teks yang diklik orang. Pada <a href="https://developer.mozilla.org/">MDN Web Docs</a>, kata MDN Web Docs tampil bergaris bawah, dan mengaktifkannya memuat alamat itu. Tautan bisa dipakai dengan tetikus, jari, atau papan ketik: tekan Tab untuk berpindah dari tautan ke tautan dan Enter untuk mengikutinya. Tanpa href, <a> hanyalah penanda tempat dan tidak bisa dicapai dengan Tab.

Alamat absolut dan relatif

URL absolut memuat segalanya: skema (https:), domain, dan jalur, misalnya https://example.com/menu/bread.html. Pakai URL absolut untuk tautan ke situs lain. URL relatif menghilangkan bagian yang sama dengan halaman saat ini. Pada halaman di https://example.com/menu/index.html, tautan bread.html berarti file di folder yang sama, ../about.html berarti satu folder ke atas, dan /contact.html dimulai dari akar situs. Tautan relatif tetap berfungsi saat seluruh situs pindah ke domain baru.

<a href="https://www.w3.org/">W3C</a>          <!-- another site -->
<a href="bread.html">Bread</a>                <!-- same folder -->
<a href="../about.html">About us</a>          <!-- one folder up -->
<a href="#hours">Opening hours</a>           <!-- same page -->
<a href="mailto:hello@example.com">Email us</a>

<h2 id="hours">Opening hours</h2>

Tautan di dalam halaman yang sama

Beri elemen apa pun sebuah id, dan tautan yang href-nya berupa tanda pagar diikuti id itu akan langsung melompat ke sana. <a href="#hours"> menggulir ke <h2 id="hours">. Sebuah id harus unik di dalam halaman dan tidak boleh berisi spasi. Artikel panjang memakainya untuk daftar isi, dan banyak situs menaruh tautan lompat di bagian paling atas (Skip to main content) agar pengguna papan ketik tidak perlu menekan Tab melewati seluruh menu di setiap halaman.

Email, telepon, dan unduhan

Skema lain membuka program lain. mailto:hello@example.com membuka email baru di program surel pengunjung, dan tel:+82212345678 menawarkan untuk menelepon nomor itu di ponsel. Menambahkan atribut download pada tautan meminta browser menyimpan file alih-alih membukanya. Tautan ini praktis, tetapi sebutkan fungsinya di teks tautan, karena orang tidak menyangka program surel tiba-tiba muncul.

Tab baru dan teks tautan yang baik

target="_blank" membuka tautan di tab baru. Pakailah dengan hemat: atribut ini mengambil kendali dari pengunjung, dan tombol Kembali tidak lagi membawanya kembali. Kalau kamu memakainya, sebutkan di teks tautan, misalnya (dibuka di tab baru). Yang paling penting adalah teks tautan itu sendiri. Pengguna pembaca layar sering memunculkan daftar semua tautan di halaman, dan daftar sepuluh entri yang semuanya berbunyi klik di sini atau baca selengkapnya tidak memberi tahu apa pun. Tulis teks yang masuk akal di luar konteksnya: Unduh jadwal 2026, bukan klik di sini.

Secara bawaan, browser memberi garis bawah dan warna biru pada tautan, dan menampilkan tautan yang sudah dikunjungi dengan warna ungu. Kamu bisa mengubah gaya tautan dengan CSS, tetapi pertahankan penanda selain warna saja, seperti garis bawah, agar orang yang tidak bisa membedakan warna tetap tahu kata mana yang berupa tautan. Saat tautan mendapat fokus papan ketik, browser menggambar cincin fokus di sekelilingnya; jangan pernah menghapus cincin itu tanpa menggantinya dengan penanda lain yang jelas.