Elemen Semantik HTML

Nanda Eka
1 min readMay 20, 2022

--

Apa itu Elemen Semantik HTML?

Elemen Semantik adalah tag html yang sesuai dengan makna sebenarnya. Misalnya <header> tujuannya adalah untuk membuat header, jadi tidak digunakan untuk membuat footer. Sehingga meminimalisir terjadinya salah penggunaan tag.

Apa saja elemen semantik?

Berikut ini elemen-elemen semantik di HTML

  • <article> : untuk membuat elemen artikel
  • <aside> : untuk membuat bagian samping
  • <details> : untuk membuat detail
  • <figcaption> : untuk membuat teks caption
  • <figure> : untuk membuat figur atau gambar
  • <footer> : untuk membuat footer
  • <header> : untuk membuat header web
  • <main> : untuk membuat elemen utama
  • <mark> : untuk membuat tanda pada teks
  • <nav> : untuk membuat menu navigasi
  • <section> : untuk membuat seksi atau bagian pada artikel
  • <summary> : untuk membuat rangkuman atau ringkasan
  • <time> : untuk membuat elemen waktu

Kenapa harus Elemen Semantik?

Tujuannya agar kode kita bisa dengan mudah dibaca dan dipahami.

Contoh tanpa Semantik elemen
Contoh dengan elemen semantik

Selain itu elemen semantik juga berguna untuk SEO. Jadi harus dibiasakan menggunakan elemen semantik agar lebih mudah dalam memahami kode dan juga keperluan SEO.

Sekian tulisan saya sebagai bentuk latihan dan juga checkpoint untuk setiap hal yang saya pelajari. Jika ada saran dan kritik boleh diajukan sekian terima kasih.

Refrensi

--

--