Judul dan paragraf

HTML punya enam tingkat judul, h1 sampai h6, dan pengguna pembaca layar sering melompat dari judul ke judul untuk menjelajahi halaman.

Kerangka yang tersusun dari judul

Bayangkan buku resep. Bukunya punya judul, setiap resep punya nama, dan setiap resep punya bagian lebih kecil seperti Bahan dan Cara Membuat. HTML menyatakan kerangka yang sama dengan enam elemen judul, <h1> sampai <h6>. <h1> adalah tingkat teratas, biasanya judul halaman. <h2> menandai bagian utama, <h3> bagian di dalam suatu bagian, dan seterusnya. Sebagian besar halaman tidak pernah memerlukan lebih dari tiga atau empat tingkat.

<h1>Weekend Baking</h1>
<p>Three simple breads you can make at home.</p>

<h2>Soda bread</h2>
<h3>Ingredients</h3>
<p>Flour, baking soda, salt and buttermilk.</p>
<h3>Method</h3>
<p>Mix, shape into a round and bake for 40 minutes.</p>

<h2>Flatbread</h2>
<p>Ready in 20 minutes, no oven needed.</p>

Pilih tingkat menurut struktur, bukan ukuran

Browser menggambar <h1> besar dan <h6> kecil, dan godaannya adalah memilih judul karena ukurannya. Tahan godaan itu. Tingkat judul memberi tahu perangkat lunak bagaimana halaman disusun. Pembaca layar bisa mendaftar semua judul di halaman dan membiarkan pengguna langsung melompat ke salah satunya, mirip daftar isi. Mesin pencari juga memakai judul untuk memahami isi halaman. Kalau kamu ingin h2 tampak lebih kecil, biarkan tetap h2 dan ubah ukurannya dengan CSS.

Dua kebiasaan menjaga kerangka tetap rapi. Pertama, pakai satu <h1> per halaman untuk judul utamanya; MDN menyarankan ini, dan itulah yang diharapkan sebagian besar pengguna. Kedua, jangan melompati tingkat saat turun: setelah h2 datang h3, bukan h5. Naik kembali tidak apa-apa, jadi h3 boleh diikuti h2 baru saat bagian berikutnya dimulai.

Paragraf

Teks berjalan ditaruh di elemen <p>, satu per paragraf. Karena HTML meringkas spasi, menekan Enter dua kali di file-mu tidak membuat paragraf baru di layar; hanya <p> baru yang bisa. Browser secara bawaan menambahkan jarak di atas dan di bawah setiap paragraf, yang bisa diubah dengan CSS. Paragraf tidak boleh memuat paragraf lain atau judul, jadi kalau kamu lupa </p> penutup, browser menutupnya untukmu begitu elemen blok berikutnya dimulai.

Kadang pindah baris itu sendiri bagian dari konten, seperti pada alamat pos atau puisi. Untuk itu, pakai <br> di akhir setiap baris di dalam satu paragraf atau <address>. Jangan memakai tumpukan elemen <br> untuk membuat ruang vertikal; itu tugas margin CSS. Untuk menandai pergantian topik di dalam suatu bagian, seperti pergantian adegan dalam cerita, pakai <hr>, pemisah tema, yang digambar browser sebagai garis mendatar.

Kutipan

Kutipan yang lebih panjang dari sumber lain ditaruh di <blockquote>, yang dijorokkan oleh browser. Taruh paragraf yang dikutip di dalamnya, dan kamu bisa memberi alamat sumber di atribut cite-nya. Kutipan pendek di dalam kalimat memakai <q>, dan browser menambahkan tanda petiknya untukmu. Elemen <cite> menandai judul karya, seperti buku atau film.