Apa Perbedaan div dan section pada html?

 

<div> dan <section> adalah elemen yang hampir sama penggunaannya, tetapi sedikit berbeda dalam tujuannya. 

<div> biasanya digunakan untuk elemen pembungkus atau wadah tanpa makna spesifik. Ini sering digunakan untuk mengelompokkan dan memformat bagian-bagian dari halaman web, memberikan struktur dengan memberikan nilai class untuk menandari perbedaan dari masing-masing <div>.

<div> adalah elemen generik yang berguna untuk mengorganisir elemen-elemen lain dalam kelompok-kelompok tertentu.

contoh,

<div id="header">

    <h1>Halaman Utama</h1>

</div>

<div id="content">

    <p>Ini adalah konten halaman utama.</p>

</div>

<div id="footer">

    <p>Hak Cipta &copy; 2023</p>

</div>

Sedangkan <section> digunakan untuk menandai bagian dari halaman web yang membentuk suatu topik tertentu.

Tujuannya adalah memudahkan untuk menandai struktur halaman dan membantu mesin pencari untuk mengidentifikasi atau Mengoptimalkan SEO dari website. Dan dengan elemen semantik ini memudahkan dalam melihat codingnya.

<section> biasanya digunakan untuk mengelompokkan konten terkait seperti bagian atau tema tertentu.

contoh,

<header>

    <h1>Halaman Utama</h1>

</header>

<main>

    <p>Ini adalah konten halaman utama.</p>

</main>

<footer>

    <p>Hak Cipta &copy; 2023</p>

</footer>

Dalam prakteknya, <div> sering digunakan untuk menyusun dan mengelompokkan elemen-elemen dengan class sebagai pembedanya, sedangkan <section> lebih cocok untuk mengorganisir konten yang berkaitan dengan topik atau informasi tertentu.