Panduan Lengkap ASCII - Kode ASCII: Panduan untuk Pemula

Hai teman-teman, para pengembang web masa depan! Hari ini, kita akan memulai perjalanan yang menarik ke dunia kode ASCII dan perannya dalam HTML. Jangan khawatir jika Anda belum pernah mendengar tentang ASCII sebelumnya - setelah selesai membaca panduan ini, Anda akan menjadi ahli ASCII!

HTML - ASCII Codes

Apa Itu ASCII?

ASCII adalah singkatan dari American Standard Code for Information Interchange. Itu seperti sebuah kode rahasia yang komputer gunakan untuk memahami huruf, angka, dan simbol. Bayangkan Anda mengirim catatan di kelas, tetapi instead of menulis kata, Anda menggunakan angka untuk mewakili setiap huruf. Itu seperti apa yang ASCII lakukan bagi komputer!

Kode HTML - Tabel Karakter dan Simbol ASCII

Mari kita mulai dengan fakta menarik: Anda tahu bahwa setiap karakter yang Anda ketik di keyboard memiliki kode ASCII yang unik? Benar! Ini adalah tabel yang menunjukkan beberapa kode ASCII umum:

Karakter Kode ASCII
A 65
a 97
0 48
Space 32

Dalam HTML, kita dapat menggunakan kode ini untuk menampilkan karakter. Mari lihat bagaimana:

<p>Huruf A: &#65;</p>
<p>Huruf a: &#97;</p>
<p>Angka 0: &#48;</p>

Ketika Anda melihat ini di browser, itu akan menampilkan:

Huruf A: A Huruf a: a Angka 0: 0

Keren, kan? Itu seperti kita berbicara dalam bahasa komputer!

Mengapa Menggunakan Kode ASCII di HTML?

Mungkin Anda bertanya-tanya, "Mengapa memusingkan diri dengan kode ini ketika saya bisa langsung mengetik huruf?" Pertanyaan bagus! Kadang-kadang, karakter tertentu mungkin tidak ditampilkan dengan benar di semua perangkat atau browser. Menggunakan kode ASCII memastikan bahwa konten Anda tampak sesuai kehendak Anda, tanpa memperhatikan sistem pengguna.

Karakter Kendali ASCII

Sekarang, mari bicarakan tentang beberapa karakter ASCII khusus yang Anda tidak bisa lihat tapi sangat penting. Ini disebut Karakter Kendali, dan mereka membantu mengendalikan bagaimana teks ditampilkan atau diproses.

Misalnya:

  • ASCII 10 ( ) adalah Line Feed
  • ASCII 13 ( ) adalah Carriage Return

Ini adalah contoh bagaimana Anda bisa menggunakannya:

<p>Ini adalah baris 1.&#10;Ini adalah baris 2.</p>

Ini akan ditampilkan sebagai:

Ini adalah baris 1. Ini adalah baris 2.

Karakter ASCII yang Dapat Ditampilkan

Karakter ASCII yang dapat ditampilkan adalah yang Anda bisa lihat di layar. Mereka termasuk huruf, angka, tanda baca, dan beberapa simbol. Mari kita lihat beberapa contoh:

<p>Tanda seru: &#33;</p>
<p>Simbol dollar: &#36;</p>
<p>Simbol persen: &#37;</p>

Ini akan ditampilkan sebagai:

Tanda seru: ! Simbol dollar: $ Simbol persen: %

Contoh Seni ASCII Menyenangkan

Ingin melihat sesuatu yang menarik? Kita bisa menggunakan karakter ASCII untuk membuat gambar sederhana! Cek ini:

<pre>
___________
/           \
/   ASCII Art  \
\    is fun!   /
\___________/
</pre>

Ini akan membuat sebuah balon bicara sederhana di browser Anda. Menarik, kan?

Kode ASCII Diperpanjang

Sekarang, mari kita masuk lebih dalam. Kode ASCII diperpanjang memungkinkan kita untuk mewakili karakter lebih banyak, termasuk huruf beraksen dan simbol khusus. Kode ini berada dalam rentang 128 hingga 255.

Ini adalah contoh:

<p>Simbol hak cipta: &#169;</p>
<p>Simbol euro: &#8364;</p>
<p>Simbol merek dagang terdaftar: &#174;</p>

Ini akan ditampilkan sebagai:

Simbol hak cipta: © Simbol euro: € Simbol merek dagang terdaftar: ®

Penggunaan Praktis Kode ASCII Diperpanjang

Bayangkan Anda membuat website untuk sebuah kafe di Paris. Anda mungkin menggunakan kode ASCII diperpanjang untuk menampilkan kata-kata Prancis dengan aksen:

<p>Caf&#233; au lait</p>
<p>Cr&#232;me br&#251;l&#233;e</p>

Ini memastikan bahwa "Café au lait" dan "Crème brûlée" ditampilkan dengan benar, bahkan jika sistem pengguna tidak mendukung karakter Prancis.

Kesimpulan

Dan itu adalah dia, teman-teman! Kita telah melakukan perjalanan menarik melalui dunia kode ASCII dalam HTML. Dari huruf dasar hingga simbol yang keren, Anda sekarang tahu bagaimana menggunakan kode ini untuk memastikan konten web Anda ditampilkan dengan benar dan kreatif.

Ingat, latihan membuat ahli. Cobalah membuat halaman HTML sederhana dan eksperimen dengan kode ASCII berbeda. Anda mungkin terkejut dengan apa yang Anda bisa buat!

Sebelum kita selesai, ini adalah tantangan cepat untuk Anda: Bisakah Anda membuat wajah senyum hanya menggunakan kode ASCII? Petunjuk: Anda akan memerlukan ☺ (☺).

Selamat coding, dan semoga halaman web Anda selalu tampak sesuai kehendak Anda!

Credits: Image by storyset