Atribut lang pada elemen html menyatakan bahasa utama konten halaman. Satu atribut kecil dengan efek besar: pembaca layar, alat terjemahan, dan mesin pencari sama-sama membacanya untuk mengambil keputusan. Tanpa atribut ini, ketiganya menebak — dan tebakan yang salah menurunkan mutu pengalaman pengguna. Chapter ini membahas format nilainya, manfaatnya, dan cara menandai bahasa yang berbeda pada sebagian konten.

Fungsi Atribut lang #

Atribut lang dipasang pada elemen akar dan nilainya berupa kode bahasa. Untuk halaman berbahasa Indonesia, penulisannya lang="id". Perhatikan contoh halaman berbahasa Inggris berikut:

html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Dewi's Coffee Notes</title>
</head>
<body>
  <p>This page is written in English.</p>
</body>
</html>

Baris 2 (<html lang="en">) menyatakan bahwa seluruh konten halaman berbahasa Inggris — satu deklarasi untuk seluruh dokumen, tanpa perlu menandai tiap paragraf.

Manfaat Menyatakan Bahasa #

Tiga kelompok pengguna membaca nilai lang:

  • Pembaca layar — perangkat lunak yang menyuarakan halaman bagi pengguna tunanetra. Nilai lang menentukan mesin pelafalan yang dipakai; teks Indonesia yang dibacakan dengan pelafalan bahasa lain menjadi sulit dipahami.
  • Alat terjemahan — browser dan layanan terjemahan mengetahui bahasa sumber tanpa menebak dari isi teks.
  • Mesin pencari — hasil pencarian dapat dikelompokkan sesuai preferensi bahasa pengguna.

Ketiganya bekerja di balik layar: lang dibaca oleh alat, bukan dirender menjadi tampilan — sehingga demo render di artikel ini tidak bisa menunjukkan efeknya. Cara paling langsung mendengar bedanya adalah memakai pembaca layar seperti NVDA atau VoiceOver, yang melafalkan teks sesuai nilai lang yang menyertainya.

Format Kode BCP 47 #

Nilai lang mengikuti format BCP 47: kode bahasa utama, opsional diikuti kode wilayah yang dipisah tanda hubung. Tabel berikut memuat contoh nilai yang umum:

NilaiBahasaKeterangan
idBahasa IndonesiaKode utama
id-IDBahasa Indonesia (wilayah Indonesia)Kode utama + kode wilayah
enBahasa InggrisKode utama
en-GBBahasa Inggris (Britania)Kode utama + kode wilayah
jaBahasa JepangKode utama

Untuk halaman berbahasa Indonesia, id sudah memadai. Kode wilayah seperti id-ID hanya dibutuhkan bila perbedaan regional benar-benar relevan — misalnya membedakan ejaan atau istilah antarnegara.

Bahasa yang Berbeda pada Sebagian Konten #

Halaman berbahasa Indonesia kadang memuat kutipan berbahasa asing. Tandai bagian tersebut dengan atribut lang pada elemen pembungkusnya:

html
<p>Dewi mencatat kalimat ini dari buku berbahasa Inggris.</p>
<p lang="en">HTML is the structure layer of the web.</p>
<p>Kalimat di atas ditandai memakai atribut lang.</p>

Mari kita telaah penandaan tersebut:

  1. Baris 2 (<p lang="en">): kalimat berbahasa Inggris mendapat penanda bahasanya sendiri; pembaca layar beralih ke pelafalan bahasa Inggris hanya untuk kalimat ini.
  2. Baris 1 dan baris 3: paragraf berbahasa Indonesia tidak memerlukan penanda — keduanya mengikuti bahasa utama yang dinyatakan pada elemen html.

Atribut lang dapat dipasang pada elemen apa pun, bukan hanya p; penanda pada elemen berlaku untuk seluruh isi elemen tersebut.

Ringkasan #

  • lang pada elemen html menyatakan bahasa utama seluruh dokumen.
  • Manfaatnya menjangkau pembaca layar, alat terjemahan, dan mesin pencari.
  • Nilainya mengikuti BCP 47: kode bahasa utama (id, en, ja), opsional dengan kode wilayah (id-ID, en-GB).
  • Bahasa yang berbeda pada sebagian konten ditandai lang pada elemen pembungkusnya.

Bahasa dokumen sudah dinyatakan. Chapter berikutnya menambahkan satu baris metadata terakhir di head yang khusus dibaca browser ponsel: meta viewport.