Membagi Dokumen HTML5 ke dalam Beberapa Sesi

Dalam HTML, salah satu cara untuk membagi dokumen ke dalam beberapa sesi yang berbeda yaitu menggunakan tag <div>. Jika dilihat dari makna kata tag <div>, agaknya mempunyai sedikit makna untuk mendefinisikan bagian suatu dokumen. HTML5 menawarkan beberapa pilihan baru untuk hal ini, yaitu dengan menyediakan beberapa elemen struktural yang akan membagi dokumen ke dalam sesi-sesi yang lebih bermakna.

Elemen pertama dari beberapa elemen yang disediakan yaitu tag <section></section>. Elemen ini merepresentasikan pembagian logis dari suatu dokumen. Hal ini dapat berarti deskripsi produk, bab, diskusi, dan yang lain. Meskipun fungsi tag ini sama dengan tag <div>, tetapi lebih bersifat deskriptif dan lebih content-sensitive untuk membagi dokumen.

Ketika membuat sebuah sesi pada HTML5, layaknya ketika menggunakan tag <div> pada HTML, kita juga dapat memanfaatkan penggunaan atribut id dan class. Meskipun kedua jenis atribut tersebut dapat diterapkan pada elemen HTML5 yang lain, keduanya tetap merupakan atribut globa. Masing-masing id harus unik, seperti pada HTML, dan class dapat digunakan beberapa kali untuk memanggil script atau format yang telah disesuaikan.

Semua HTML5 mempunyai tiga tipe atribut : global, yang secara umum untuk semua elemen; element specific, yang diterapkan hanya pada elemen tertentu, dan atribut event handler content, yang akan digunakan sesuai dengan konten dalam dokumen.

Misalkan kita ingin membuat dokumen tentang langkah membuat kue. Berikut contoh penggunaan elemen <section></section> :

<section id="adonan">
<h2>Mencampurkan adonan</h2>
<p>Untuk memasukkan adonan, langkah pertama yaitu mencampur gula pasir… </p>
</section>
<section id="masukkan">
<h2>Memasukkan ke cetakan</h2>
<p>Sebelum adonan dimasukkan ke dalam cetakan, selalu pastikan warna adonan telah berwarna…</p>
</section>

Tujuan penggunaan elemen <section></secton> dan elemen-elemen pembagi struktur yang lain bukanlah untuk menggantikan tag <div> HTML. Jika kita ingin membagi dokumen dalam sesi dokumen logikal (berdasar fungsi), gunakan elemen <section></section> atau salah satu elemen struktural yang lain. Akan tetapi, jika kita ingin membagi dokumen untuk tujuan pemformatan, maka penggunaan tag <div> lebih disarankan.