Beberapa karakter punya arti khusus di HTML: < dibaca sebagai awal tag, dan & dibaca sebagai awal kode khusus. Kalau kamu mau karakter itu tampil sebagai teks biasa, tulis pakai HTML entity: kode pendek yang diawali & dan diakhiri titik koma ;, misalnya < buat tanda <.
🧪 Tebakan cepat: kalau kamu ketik
©di dalam paragraf, yang muncul di halaman tulisan©itu sendiri atau sesuatu yang lain? Tebak dulu, jawabannya ada di bagian "Entity yang sering dipakai".
Menampilkan tanda < dan > sebagai teks
Kalimat ini mau menampilkan nama tag <p> di tengah paragraf:
<p>Pakai tag <p> buat paragraf</p>
<p>di awal dan</p>di akhir adalah tag paragraf beneran.<adalah entity buat tanda<. Namanya dari less than, artinya "lebih kecil dari".>adalah entity buat tanda>, dari greater than, "lebih besar dari".- Tiap entity diawali
&dan diakhiri;. Titik komanya jangan sampai lupa.
Hasilnya di browser satu kalimat utuh, dengan tulisan <p> di tengahnya.
Kalau ditulis langsung, <p>Pakai tag <p> buat paragraf</p>, browser membaca <p> yang di tengah sebagai tag paragraf baru. Kalimatnya kepotong jadi dua paragraf dan tulisan <p> gak kelihatan.
Satu catatan buat latihan: pengecek melihat teks yang tampil di browser, bukan kode yang kamu ketik. Jadi <p> di kode dihitung sebagai <p>.
Tanda & juga ditulis pakai entity
Karena & adalah awal entity, browser selalu mencari nama entity sesudahnya. Contohnya ®ion bisa kebaca jadi ®ion, sebab ® itu entity buat simbol ®. Biar aman, tanda & di teks ditulis &:
<p>Tom & Jerry</p>
<p>Rumus: a < b</p>
Di browser tampilnya Tom & Jerry dan Rumus: a < b. Karakter lain di sekitarnya, termasuk spasi dan %, tetap diketik biasa.
Entity yang sering dipakai
<jadi<>jadi>&jadi&"jadi", dipakai di dalam nilai atribut yang diapit tanda kutip©jadi© jadi spasi yang gak boleh dipakai buat pindah baris
Entity juga bisa ditulis pakai nomor: < hasilnya sama dengan <. Simbol lain kayak ©, € atau → boleh juga langsung diketik, asal halamannya pakai <meta charset="UTF-8">. Yang benar-benar perlu entity cuma karakter yang punya arti khusus di HTML: <, >, &, dan " di dalam atribut.
⚠️ Jebakan yang sering ketemu
- Lupa titik koma.
<tanpa;kadang jalan, kadang enggak. Selalu tutup dengan;. - Nama yang salah.
&less;bukan entity, jadi yang tampil ya tulisan&less;itu. - Ditulis dua kali.
&lt;tampil sebagai tulisan<, bukan tanda<. - Entity di
<script>atau<style>. Di sana entity gak diterjemahkan, jadiif (a < b)di JavaScript malah error. buat bikin jarak. Jarak antar elemen itu urusan CSS (margin, padding), bukan deretan .
TL;DR: Karakter yang punya arti khusus di HTML ditulis pakai entity biar tampil sebagai teks: < buat <, > buat >, & buat &, " buat " di atribut. Entity diawali & dan diakhiri ;. Simbol lain kayak © punya entity (©), tapi dengan UTF-8 boleh juga diketik langsung.