Halo teman-teman,
Setelah sebelumnya kita belajar tentang bagaimana memberi gaya pada elemen HTML menggunakan atribut style, sekarang saatnya kita fokus ke bagian lain yang tak kalah penting, yaitu memformat teks.
Dalam HTML, kita bisa membuat teks jadi tebal, miring, disorot, atau bahkan dicoret. Ini bukan cuma soal tampilan, tapi juga tentang makna—beberapa tag menandakan pentingnya teks secara semantik.
Menebalkan Teks: <b> vs <strong>
Tag <b> digunakan untuk menampilkan teks tebal tanpa menambahkan makna penting.
<p>Ini adalah teks <b>tebal</b>.</p>
Sedangkan <strong> dipakai kalau teks tersebut penting secara makna. Secara tampilan memang sama-sama tebal, tapi <strong> memberi penekanan secara semantik.
<p>Ini <strong>sangat penting</strong> untuk diperhatikan.</p>
Memiringkan Teks: <i> vs <em>
Tag <i> digunakan untuk memiringkan teks tanpa makna khusus.
<p>Teks dalam <i>huruf miring</i>.</p>
Sedangkan <em> digunakan untuk menekankan isi kalimat secara semantik (biasanya juga tampil miring).
<p>Kamu <em>harus</em> mencobanya sekarang!</p>
Membuat Teks Lebih Kecil: <small>
Gunakan tag <small> jika ingin teks tampil dalam ukuran yang lebih kecil.
<p>Catatan kaki: <small>info tambahan</small></p>
Menandai Teks: <mark>
Tag <mark> digunakan untuk menyorot atau menandai teks, seperti menggunakan stabilo.
<p>Kalimat ini <mark>penting</mark> untuk dicatat.</p>
Menghapus dan Menyisipkan Teks: <del> dan <ins>
Gunakan <del> untuk menampilkan teks yang sudah dihapus (dengan garis coret).
<p>Harga lama: <del>Rp50.000</del></p>
Gunakan <ins> untuk teks yang baru disisipkan.
<p>Harga baru: <ins>Rp40.000</ins></p>
Subscript dan Superscript: <sub> dan <sup>
<sub> digunakan untuk teks subskrip (di bawah), seperti pada rumus kimia.
<p>H<sub>2</sub>O</p>
<sup> digunakan untuk teks superskrip (di atas), seperti bilangan pangkat atau catatan kaki.
<p>2<sup>3</sup> = 8</p>
Dengan elemen-elemen ini, kamu bisa membuat konten teks di HTML jadi lebih kaya dan bermakna. Jangan hanya fokus pada tampilan, tapi juga pahami fungsinya secara semantik agar halamanmu ramah pembaca dan mesin pencari.
Kalau ada bagian yang masih membingungkan, tulis aja pertanyaan kamu di komentar. Yuk kita bahas bareng!
Di materi selanjutnya, kita akan bahas tentang komentar di HTML—apa fungsinya, gimana cara nulisnya, dan kenapa komentar bisa sangat membantu saat ngoding. Sampai ketemu di tutorial berikutnya!
Komentar
Posting Komentar