Tautan (Link)
Menghubungkan halaman dengan elemen a: tautan ke website lain, halaman sendiri, bagian dalam halaman, email, dan nomor telepon.
Hyperlink: jantung dari web
Kata HyperText di HTML merujuk pada tautan. Tanpa tautan, web hanyalah kumpulan dokumen yang terpisah. Tautan dibuat dengan elemen <a> (anchor) dan atribut href (hypertext reference) yang berisi tujuan.
<a href="https://kelasit.com">Kunjungi KelasIT</a>Teks di antara tag pembuka dan penutup adalah teks yang bisa diklik. Tulislah teks yang menjelaskan tujuan: "Baca panduan HTML" jauh lebih baik daripada "klik di sini".
Jenis alamat di href
| Jenis | Contoh | Keterangan |
|---|---|---|
| Absolut | https://kelasit.com/artikel | Alamat lengkap, untuk website lain |
| Relatif | kontak.html atau ../index.html | Berkas di dalam website yang sama |
| Bagian halaman | #bab-2 | Lompat ke elemen ber-id yang sama |
mailto:halo@contoh.com | Membuka aplikasi email | |
| Telepon | tel:+6281234567890 | Menelepon (di ponsel) |
Membuka di tab baru
Atribut target="_blank" membuka tautan di tab baru. Saat memakainya untuk website luar, tambahkan juga rel="noopener noreferrer" demi keamanan (mencegah halaman tujuan mengendalikan halamanmu).
<a href="https://developer.mozilla.org" target="_blank" rel="noopener noreferrer">MDN Web Docs</a>Tautan ke bagian dalam halaman (anchor)
Beri sebuah elemen id yang unik, lalu arahkan tautan ke #id itu. Sangat berguna untuk daftar isi di halaman yang panjang.
<a href="#kontak">Ke bagian Kontak</a>
...
<h2 id="kontak">Kontak</h2>Tautan pada elemen lain
Elemen apa pun boleh dibungkus <a>, termasuk gambar. Ini cara membuat gambar yang bisa diklik.
Aksesibilitas: pembaca layar membacakan daftar semua tautan. Teks seperti "selengkapnya" berulang kali jadi membingungkan. Buat teks tautan yang jelas berdiri sendiri.