HTML - Character Encodings
Selamat datang, para pengembang web yang bersemangat! Hari ini, kita akan mempelajari dunia yang menarik dari pengkodean karakter dalam HTML. Sebagai guru komputer tetangga yang ramah, saya disini untuk mengarahkan Anda dalam perjalanan ini dengan penjelasan yang jelas, banyak contoh, dan sedikit humor. Jadi, ambil papan tulis maya Anda, dan mari kita mulai!
Atribut Charset HTML
Sebelum kita mendalamkan diri dalam berbagai himpunan karakter, mari bicarakan bagaimana kita memberitahu halaman web kita tentang pengkodean mana yang harus digunakan. Ini adalah tempat dimana atribut charset HTML memainkan perannya.
Atribut charset biasanya ditempatkan dalam tag <meta> di bagian <head> dokumen HTML Anda. Ini adalah contoh:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Halaman Web Saya yang Menakjubkan</title>
</head>
<body>
<h1>Selamat datang ke website saya!</h1>
</body>
</html>Dalam contoh ini, kita memberitahu browser untuk menggunakan pengkodean UTF-8 (lagi nanti tentang ini). Bayangkan itu seperti memberikan halaman web Anda sebuah kacamata khusus untuk membaca teks secara benar.
Himpunan Karakter ASCII
Sekarang, mari kita mulai perjalanan kita melalui himpunan karakter dengan ASCII, kakek buyut mereka semua. ASCII berarti American Standard Code for Information Interchange. Itu seperti Model T pengkodean karakter - tua tapi menentukan dasar.
ASCII menggunakan 7 bit untuk mewakili 128 karakter, termasuk:
- Huruf besar (A-Z)
- Huruf kecil (a-z)
- Angka (0-9)
- Tanda baca dasar
Ini adalah contoh HTML sederhana yang menggunakan hanya karakter ASCII:
<p>Hallo, World! 123</p>Baris ini akan ditampilkan dengan sempurna menggunakan pengkodean ASCII karena hanya mengandung karakter Latin dasar dan angka.
Himpunan Karakter ANSI
Himpunan karakter ANSI (American National Standards Institute) adalah seperti sepupu yang lebih keren dan beragam ASCII. Itu memperpanjang ASCII untuk menggunakan 8 bit, memungkinkan 256 karakter. Ruang ekstra ini digunakan untuk karakter khusus untuk berbagai bahasa.
Namun, ANSI bukan standar tunggal - itu berubah tergantung pada pengaturan bahasa komputer. Ini bisa mengarah ke situasi yang lucu. Bayangkan mengirimkan surat cinta dalam ANSI, dan komputer pasangan Anda menampilkan itu sebagai kode because itu menggunakan halaman kode ANSI yang berbeda!
Himpunan Karakter ISO-8859-1
ISO-8859-1, juga dikenal sebagai Latin-1, adalah seperti guide wisata Eropa himpunan karakter. Itu adalah pengkodean 8-bit yang termasuk karakter digunakan dalam bahasa Barat Eropa.
Ini adalah contoh yang menggunakan karakter di luar ASCII:
<p>Café Français</p>Jika Anda menggunakan pengkodean ISO-8859-1, ini akan ditampilkan dengan benar dengan tanda angkat. Tetapi hati-hati - jika Anda menggunakan pengkodean yang berbeda, Anda mungkin akhirnya mendapat "Café Français" saja!
Himpunan Karakter UTF-8
Sekarang kita mencapai superhero pengkodean karakter - UTF-8. Itu seperti pisau swiss army himpunan karakter, mampu mengkodekan hampir setiap karakter yang Anda pikirkan.
UTF-8 menggunakan jumlah variabel byte untuk mewakili karakter. Ini berarti itu dapat menghandle efisien baik karakter ASCII sederhana (menggunakan hanya satu byte) dan karakter kompleks dari sistem penulisan lain (menggunakan beberapa byte).
Ini adalah contoh menunjukkan fleksibilitas UTF-8:
<p>Hello, नमस्ते, こんにちは, مرحبا</p>Dengan pengkodean UTF-8, baris ini akan ditampilkan dengan benar dalam Bahasa Inggris, Hindi, Jepang, dan Arab!
Himpunan Karakter ISO
ISO telah mengembangkan berbagai himpunan karakter untuk kelompok bahasa yang berbeda. Bayangkan itu sebagai set alat khusus untuk daerah tertentu. Ini adalah tabel dari beberapa himpunan karakter ISO umum:
| Himpunan Karakter | Deskripsi |
|---|---|
| ISO-8859-1 | Bahasa Barat Eropa |
| ISO-8859-2 | Bahasa Tengah dan Timur Eropa |
| ISO-8859-3 | Bahasa Selatan Eropa |
| ISO-8859-4 | Bahasa Utara Eropa |
| ISO-8859-5 | Abjad Kiril |
| ISO-8859-6 | Arab |
| ISO-8859-7 | Yunani |
| ISO-8859-8 | Ibrani |
Himpunan Karakter UTF
UTF (Unicode Transformation Format) adalah solusi modern untuk pengkodean karakter. Itu seperti Perserikatan Bangsa-Bangsa himpunan karakter, menyatukan karakter dari semua sistem penulisan di dunia.
Ada tiga pengkodean UTF utama:
- UTF-8: Pengkodean lebar variabel, kompatibel mundur dengan ASCII.
- UTF-16: Menggunakan 16 bit untuk karakter yang paling umum, lebih untuk yang lain.
- UTF-32: Menggunakan 32 bit untuk semua karakter.
Ini adalah tabel perbandingan:
| Pengkodean | Karakteristik | Terbaik Untuk |
|---|---|---|
| UTF-8 | Lebar variabel (1-4 byte) | Halaman web, konteks kompatibel ASCII |
| UTF-16 | Lebar variabel (2 atau 4 byte) | Sistem operasi, Java |
| UTF-32 | Lebar tetap (4 byte) | Situasi di mana akses karakter cepat sangat penting |
Dalam tahun-tahun mengajar saya, saya menemukan bahwa UTF-8 adalah yang paling banyak digunakan dan direkomendasikan untuk pengembangan web. Itu seperti " satu cincin untuk menguasai mereka semua" di dunia pengkodean karakter.
Untuk mengakhiri, mari kita lihat contoh praktis bagaimana menggunakan UTF-8 dalam HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Salam Multibahasa</title>
</head>
<body>
<h1>Selamat datang ke halaman internasional kami!</h1>
<p>Bahasa Inggris: Hello</p>
<p>Spanyol: Hola</p>
<p>Perancis: Bonjour</p>
<p>Jerman: Guten Tag</p>
<p>Rusia: Здравствуйте</p>
<p>Cina: 你好</p>
<p>Jepang: こんにちは</p>
<p>Arab: مرحبا</p>
</body>
</html>Halaman ini akan menampilkan salam dalam beberapa bahasa, karena pengkodean UTF-8.
Ingat, memilih pengkodean karakter yang benar adalah seperti memilih sepatu yang benar untuk perjalanan. UTF-8 adalah seperti sepatu sneakers nyaman yang bisa membawa Anda ke mana saja, sedangkan pengkodean lain mungkin lebih spesialis untuk terrain tertentu.
Sebagai kesimpulan les ini, saya harap Anda telah memperoleh pemahaman yang kuat tentang pengkodean karakter dalam HTML. Tetap latih, tetap curi-curi, dan jangan takut untuk mencoba himpunan karakter yang berbeda. Selamat coding!
Credits: Image by storyset