Mahir freeCodeCamp • lecture-understanding-nuanced-semantic-elements

Apa Itu Daftar Deskripsi (Description Lists), dan Kapan Anda Harus Menggunakannya?

Ringkasan Pelajaran

Daftar deskripsi (ditandai dengan elemen HTML `<dl>`) digunakan untuk membuat hubungan antara istilah dan deskripsi yang sesuai. Berbeda dengan daftar tidak berurutan (`<ul>`) atau berurutan (`<ol>...

Daftar deskripsi (ditandai dengan elemen HTML <dl>) digunakan untuk membuat hubungan antara istilah dan deskripsi yang sesuai. Berbeda dengan daftar tidak berurutan (<ul>) atau berurutan (<ol>), daftar deskripsi dirancang untuk pasangan kunci-nilai (key-value pairs).

Cara Kerjanya

Daftar deskripsi terdiri dari tiga tag HTML utama:

  • <dl>: Elemen pembungkus yang mendefinisikan seluruh daftar deskripsi.
  • <dt>: “Description term”—kunci atau istilah yang Anda definisikan atau deskripsikan.
  • <dd>: “Description details”—definisi, penjelasan, atau nilai yang terkait dengan istilah tersebut.

Kapan Menggunakannya

Anda harus menggunakan daftar deskripsi setiap kali Anda memiliki konten yang secara inheren terstruktur sebagai pasangan istilah dan informasi terkaitnya. Kasus penggunaan umum meliputi:

  • Glosarium: Menampilkan istilah teknis (<dt>) dan definisinya (<dd>).
  • Metadata: Menampilkan data seperti “Penulis: Jane Doe” atau “Status: Aktif”.
  • Tanya Jawab (FAQ): Pertanyaan bertindak sebagai istilah (<dt>), dan jawaban bertindak sebagai deskripsi (<dd>).
  • Detail Produk: Menampilkan spesifikasi seperti “Bahan: Katun” atau “Asal: Italia”.

Mengapa Menggunakannya?

  • Makna Semantik: Menggunakan tag yang benar memberi tahu browser dan teknologi asistif (seperti pembaca layar) apa sebenarnya konten tersebut.
  • Keterbacaan: Memberikan cara yang bersih dan terorganisir untuk menyajikan informasi terkait dalam kode Anda.