charset dan Penanganan Unicode Karakter Khusus
Gunakan UTF-8 dan entitas HTML untuk menampilkan karakter apa pun dengan benar.
charset dan Penanganan Unicode Karakter Khusus adalah pelajaran HTML Academy gratis di CoddyKit. Ini adalah pelajaran 4 dari 4. Kamu bisa membaca pelajaran lengkapnya di bawah secara gratis — lalu praktikkan langsung di browser dengan editor kode bawaan dan tutor AI 24/7. Ini adalah bagian dari jalur belajar HTML Academy, dan progresmu tersinkronisasi di web dan aplikasi CoddyKit. Kursus HTML Academy mencakup 4 pelajaran total.
Deklarasi charset
Setiap dokumen HTML harus mendeklarasikan pengodean karakternya. Standarnya adalah UTF-8: <meta charset="utf-8"> sebagai elemen pertama di dalam <head>. Tanpanya, peramban akan menebak, dan hasilnya sering keliru untuk teks non-ASCII.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Page</title>Mengapa UTF-8?
UTF-8 mengodekan setiap karakter Unicode: setiap aksara, setiap emoji, dan setiap simbol. UTF-8 kompatibel dengan ASCII (a-z dan 0-9 tetap menggunakan satu byte) serta merupakan pengodean yang paling banyak digunakan di web modern—lebih dari 98% halaman pada 2024 menggunakan UTF-8.
Penempatan Sangat Penting
Tag meta charset harus muncul dalam 1024 byte pertama dokumen—biasanya pada baris pertama <head>. Peramban mendeteksi pengodean dari byte tersebut; deklarasi charset yang muncul kemudian mungkin tidak memengaruhi hasil deteksi.
Simpan Berkas dalam UTF-8
Tag meta mendeklarasikan pengodean; editor Anda harus benar-benar menyimpan berkas dalam pengodean tersebut. VS Code, IntelliJ, dan Sublime semuanya menggunakan UTF-8 sebagai bawaan dalam versi modern. Berkas yang disimpan sebagai Windows-1252 atau ISO-8859-1 menghasilkan karakter kacau (mojibake), meskipun tag meta sudah benar.
Entitas HTML
Karakter HTML khusus (<, >, &, ") harus di-escape agar tidak membingungkan parser: < untuk <, > untuk >, & untuk &, dan " untuk ". Di dalam nilai atribut, " wajib digunakan jika nilainya diapit tanda kutip ganda.
Referensi Karakter Numerik
Karakter Unicode apa pun dapat dirujuk menggunakan titik kodenya: ☃ atau ☃ untuk simbol manusia salju (☃). Gunakan cara ini ketika mengetik karakter secara langsung tidak praktis (misalnya untuk simbol langka atau karakter kontrol), tetapi pilih karakter Unicode literal jika editor mendukungnya.
Emoji dan Pasangan Surrogate
Emoji adalah karakter Unicode di atas U+FFFF dan direpresentasikan sebagai pasangan surrogate dalam UTF-16 (pengodean yang digunakan di dalam string JavaScript). UTF-8 mengodekannya sebagai rangkaian 4 byte. Jika charset="utf-8" ditetapkan, emoji akan ditampilkan secara langsung tanpa entitas.
Bug Pengodean Umum
Jika "Don't" ditampilkan sebagai "Donât", berarti berkas sedang ditafsirkan sebagai Latin-1, tetapi disimpan sebagai UTF-8. Perbaiki dengan menyimpan berkas sebagai UTF-8 dan memastikan <meta charset="utf-8"> tersedia. Peramban modern menggunakan UTF-8 sebagai bawaan hanya ketika tag meta tidak ada AND berkas tersebut kemungkinan besar memang UTF-8.
Header Content-Type HTTP
Peladen juga dapat mendeklarasikan pengodean melalui header respons: Content-Type: text/html; charset=utf-8. Header tersebut lebih diutamakan daripada tag meta, sehingga peladen yang salah konfigurasi dapat menyebabkan bug pengodean meskipun HTML-nya ditulis dengan benar.
Bekerja dengan Formulir
Formulir dikirim menggunakan pengodean halaman secara bawaan. Halaman UTF-8 mengirim data formulir dalam UTF-8, yang seharusnya didekodekan oleh peladen sebagai UTF-8. Ketidaksesuaian antara pengodean halaman dan dekode peladen merupakan sumber umum masukan pengguna yang kacau di situs multibahasa.
Hindari BOM
Berkas UTF-8 dapat diawali dengan penanda urutan byte (BOM, 0xEF 0xBB 0xBF). Sebagian besar peramban dapat menanganinya, tetapi beberapa alat dan CDN tidak bisa—dan BOM muncul sebagai karakter yang terlihat di beberapa editor teks. Simpan berkas sebagai "UTF-8 tanpa BOM" untuk menghindari masalah.
Uji Pemahaman
Mengapa harus muncul dalam 1024 byte pertama dokumen HTML?
Ringkasan
Deklarasikan <meta charset="utf-8"> sebagai anak pertama <head> dan simpan berkas dalam UTF-8. UTF-8 mengodekan setiap karakter Unicode, termasuk emoji dan semua aksara. Escape <, >, &, dan " sebagai entitas; gunakan referensi numerik untuk karakter langka. Waspadai Content-Type HTTP yang mengesampingkan tag meta dan BOM yang muncul sebagai karakter terlihat di beberapa alat.
Belajar HTML dengan tutor AI — gratis
Tulis dan jalankan kode asli di browser kamu, dapatkan bantuan instan dari tutor AI 24/7, dan lanjutkan di mana kamu tinggalkan di web atau aplikasi.
- Kursus
- 40
- Pelajaran
- 159
Pertanyaan yang Sering Diajukan
Apakah pelajaran “charset dan Penanganan Unicode Karakter Khusus” gratis?
Ya — teks lengkap “charset dan Penanganan Unicode Karakter Khusus” gratis dibaca di sini di web. Untuk praktiknya secara interaktif (editor kode bawaan dan tutor AI 24/7) dan buka sisa kursus HTML Academy, upgrade ke CoddyKit PRO. Kursus HTML Academy mencakup 4 pelajaran total.
Apa yang akan aku pelajari di “charset dan Penanganan Unicode Karakter Khusus”?
Gunakan UTF-8 dan entitas HTML untuk menampilkan karakter apa pun dengan benar. Kamu berlatih HTML Academy dengan kode praktik yang langsung kamu jalankan di browser, dan tutor AI 24/7 menjawab pertanyaanmu saat kamu mengerjakan pelajaran ini.
Apakah aku perlu pengalaman untuk memulai HTML Academy?
Tidak diperlukan pengalaman sebelumnya. HTML Academy di CoddyKit dirancang untuk pemula hingga pelajar tingkat lanjut, jadi kamu bisa memulai di sini atau dari awal dan belajar sesuai kecepatan kamu sendiri. Ini adalah pelajaran 4 dari 4.
Berapa lama pelajaran “charset dan Penanganan Unicode Karakter Khusus” memakan waktu?
Sebagian besar pelajaran CoddyKit memakan waktu sekitar 5–10 menit. Setiap pelajaran ringkas dan interaktif, jadi kamu membuat kemajuan stabil dan melanjutkan dari tempat kamu tinggalkan di web dan aplikasi.
Bisakah aku menulis dan menjalankan kode dalam pelajaran HTML Academy ini?
Ya. Setiap pelajaran HTML Academy menyertakan editor kode bawaan, jadi kamu menulis dan menjalankan kode nyata langsung di browser dan mendapatkan umpan balik AI instan — tidak diperlukan penyiapan lokal.
Semua pelajaran dalam kursus ini
- Atribut lang dan Pembaca Layar
- dir=rtl untuk Teks dari Kanan ke Kiri
- Elemen bdi dan bdo
- charset dan Penanganan Unicode Karakter Khusus