Fungsi dari Article Element di HTML5

Seperti yang saya tulis pada artikel sebelumnya fungsi dari article element di HTML5, adalah Sesuai dengan namanya, tag <article> cocok digunakan untuk struktur artikel. Dalam contoh kita, tag ini bisa digunakan untuk mengganti bagian <div id=”artikel”>, jadi dimana teman-teman ingin membuat sesuatu artikel bisa berupa tulisan teman-teman bisa menggunakan tag artikel ini, karena apa tag article lebih efektif untuk pemanggilan SEO di search engine dari pada kita menggunakan atribut class atau id. oke bagaimana kelanjutannya, simak terus ya teman-teman.

Oke langsung bagiaman mana si cara penulisan untuk meneggunakan tag article atau fungsi dari article element di HTML5, teman-teman bisa lihat kode di bawah ini:

<section>
    <article>
    <header>
        <h1>Judul Artikel</h1>
    </header>
        <p>....isi artikel disini...</p>
        <p>....isi artikel disini...</p>
        <p>....isi artikel disini...</p>
        <p>....isi artikel disini...</p>
    </article>
</section>

Dimana aricel di bungkus oleh tag section ya teman-teman, Dalam spesifikasi HTML5, tag <article> juga bisa digunakan pada komentar user, sidebar, dan bagian dari konten yang bisa berdiri sendiri. Lalu apa bedannya dengan tag section oke langsung saja.

Perbedaan antara Section dan Article Element

Pada awal perkenalannya, tag <section> dan tag <article> sering menjadi perdebatan. Kapan sebaiknya menggunakan tag <section> dan kapan menggunakan tag <article>. Secara garis besar, tag <article> adalah tag <section> untuk tujuan yang lebih spesifik. Jika bagian dari konten bisa berdiri sendiri dan tidak tergantung dengan bagian lain, maka gunakan tag <article>. Namun jika konten tersebut adalah bagian dari struktur yang lebih besar, gunakan tag <section>.

Kedua tag ini juga bisa digunakan secara bersama-sama. Sebagai contoh, untuk artikel yang panjang, kita bisa memecahnya menjadi beberapa section. Berikut contoh kode HTML-nya:

<article>
    <h1>Jenis-jenis Telur </h1>
    <p>Telur terbagi menjadi beberapa jenis:</p>
    <section>
        <h2>Telur Ayam Kampung</h2>
        <p>Penjelasan tentang telur ayam kampung disini</p>
    </section>
    <section>
        <h2>Telur Itik</h2>
        <p>Penjelasan tentang telur itik disini</p>
    </section>
</article>

Demikian pula jika dalam sebuah halaman terdapat beberapa artikel, kita bisa mengumpulkannya ke dalam sebuah section:

<section>
    <h1>Articles tentang: Telur</h1>
    <article>
        <h2>Jenis-jenis Telur</h2>
        <p>Telur terbagi kedalam beberapa jenis, yakni.....</p>
    </article>
    <article>
        <h2>Manfaat Makan Telur</h2>
        <p>Telur sangat bermanfaat bagi tubuh, seperti....</p>
    </article>
    <article>
        <h2>Cara Memasak Telur</h2>
        <p>Telur bisa dimasak menjadi masakan yang sangat enak, contohnya.....</p>
    </article>
</section>

Bagaiman teman-teman dalam artikel kali ini sudah cukup jelas ya tentang penggunaan tag article dan fungsi dari article element di HTML5, semoga bermanfaat dan sampai jumpa di artikel saya selanjutnya terimakasih.

The post Fungsi dari Article Element di HTML5 appeared first on Kursus Website Terbaik.