Bahkan jika Anda bukan seorang desainer web pun Anda pasti tidak asing dengan situs yang ditulis dalam HTML. HTML awalnya dimaksudkan sebagai sarana untuk menggambarkan isi dokumen, bukan sebagai sarana untuk membuatnya tampak menarik secara visual.
Kode semantik kembali ke konsep awal ini dan mendorong desainer web untuk menulis kode yang mendeskripsikan konten, bukan tampilan konten tersebut.
Misalnya, desainer web Anda mungkin telah mengkodekan judul halaman Anda seperti ini:
- <font size="6">
- <strong>This is a page title</strong>
- </font>
Kode diatas akan membuat judul besar dan tebal sehingga memberikan tampilan seperti judul halaman, tetapi tidak ada yang menggambarkannya sebagai judul dalam kode. Itu berarti komputer tidak dapat mengidentifikasi ini sebagai judul halaman.
Untuk menulis judul yang sama secara semantik sehingga komputer memahami bahwa ini adalah judul, Anda akan menggunakan kode berikut:
Tampilan heading Anda ditentukan dalam file terpisah yang disebut "Cascading Style Sheet" atau kepanjangan dari CSS, tanpa mengganggu kode HTML deskriptif (semantik) Anda.
- <h1>This is a heading</h1>
Mengapa Kode Semantik Penting?
Salah satu alasan mengapa kode semantik sangat penting adalah bahwa tanpa menjelaskan apa itu suatu konten, komputer tidak dapat mengetahuinya. Kemampuan mesin untuk memahami konten Anda sangat penting karena dua alasan utama:
1. Banyak orang tunanetra mengandalkan browser ucapan untuk membaca halaman kembali kepada mereka. Program-program ini tidak dapat menginterpretasikan halaman dengan baik kecuali situs web menjelaskannya dengan jelas. Dengan kata lain, kode semantik membantu aksesibilitas.
2. Mesin pencari perlu memahami apa konten Anda untuk memberi SEO dengan benar di mesin pencari. Oleh karena itu, kode semantik cenderung dipakai untuk meningkatkan penempatan website Anda di mesin telusur, karena lebih mudah dipahami oleh mereka.
Namun, kode semantik juga memiliki manfaat lain diantaranya:
- Seperti yang Anda lihat dari contoh di atas, kode semantik lebih pendek sehingga unduhan lebih cepat. Kode semantik mempermudah pembaruan situs karena Anda dapat menerapkan gaya desain ke judul di seluruh situs, bukan per halaman.
- Kode semantik juga lebih mudah dipahami orang, jadi jika desainer web baru menggunakan kodenya, mereka dapat mempelajarinya lebih cepat.
- Karena kode
semantik tidak mengandung elemen desain, Anda dapat mengubah tampilan dan
nuansa situs Anda tanpa mengkode ulang semua HTML.
- Sekali lagi, karena style(CSS) dibuat terpisah dari konten Anda, kode semantik memungkinkan siapa saja untuk menambah atau mengedit halaman tanpa harus memiliki mata yang sangat teliti untuk membuat web. Anda dapat mendeskripsikan konten dengan lebih jelas.
Bagaimana Memastikan Situs Menggunakan Kode Semantik?
Sayangnya, tidak ada alat yang dapat memeriksa kode semantik. Ini adalah masalah melihat kode dan melihat apakah itu mengacu pada warna, font, atau tata letak alih-alih menggambarkan apa isinya.
Jika melihat kode, semuanya terdengar agak terlalu sulit, maka cara yang tepat untuk memulai adalah dengan bertanya kepada perancang web tersebut, Apakah dia membuat kode secara semantic atau tidak. Jika dia menatap Anda dengan pandangan kosong atau mulai mengoceh dan mencari-cari alasan tidak jelas, Anda dapat yakin bahwa dia tidak.
