5 Fitur Baru HTML 5.1 dan Cara Menggunakan nya

Baru-baru ini HTML telah merilis versi terbaru nya yakni HTML 5.1 tepat nya pada bulan November 2016. Dengan HTML 5.1 terbaru nya ini kita bisa menggunakan HTML untuk membuat web yang lebih fleksibel. Simak 5 Fitur Baru HTML 5.1 dan Cara Menggunakan nya berikut ini.

1. Dapat menentukan beberapa sumber gambar untuk tampilan yang responsif.
Pada HTML 5.1 terbaru ini kita bisa menggunakan tag <picture> secara bersamaan. Tag <picture> telah mewakili tempat gambar yang memungkinkan kita mengisi sumber gambar yang berbeda.
Sebagai contoh:

<picture>
    <source srcset="kecil.jpg, kecil-hd.jpg 2x" media="(max-width: 360px)">
    <source srcset="besar.jpg, besar-hd.jpg 2x" media="(min-width: 1920px)">
    <img src="default.jpg" srcset="default-hd.jpg 2x" alt="Gambar">
</picture>

2. Menampilkan dan menyembunyikan informasi tambahan.
Kita juga bisa menambahkan informasi pada bagian konten dengan tag <details> dan tag <summary>. Didalam kode tersebut kita bisa menempatkan <summary> didalamnya tag <details> dan ditutup <summary> dengan demikian kita bisa menambahkan informasi tambahan yang ingin disembunyikan.
Sebagai Contoh:

<section>
    <h2>Pesan</h2>
    <details>
    <summary>Konten Informasi Yang Ditambahkan</summary>
    <dl>
        <dt>Nama File:</dt><dd>namafile.mp4</dd>
        <dt>Ukuran File:</dt><dd>50 MB</dd>
        <dt>Durasi:</dt><dd>00:10:25</dd>
    </dl>
    </details>
</section>

3. Dapat menggunakan gambar dengan ukuran lebar nol.
Dengan HTML 5.1 kita bisa membuat gambar dengan lebar nol dengan menggunakan atribut lebar nol. Fitur ini sangat berguna jika kita ingin menyertakan gambar yang tidak ingin ditampilkan kepada pengguna.
Sebagai contoh :

<img src="yourimage.jpg" width="0" height="0" alt="">

4. Membuat Pilihan Kosong.
Dengan adanya fitur ini kita bisa memberi tahu agar kita tidak ingin menyarankan pilihan mana yang harus dipilih oleh pengguna, dan juga kita bisa merancang formulir yang lebih mudah digunakan. Dan tag yang digunakan adalah tag <option> dan tag <option> bisa djadikan elemen anak <select>, <optgroup>, atau <details>.

5. Dapat menangani caption angka lebih fleksibel.
Tag <figcaption> telah mewakili sebuah caption, tag ini hanya bisa digunakan sebagai turunan pertama atau terakhir dari elemen <figure>.

Baik itulah tadi fitur yang telah tersedia pada HTML 5.1 terbaru dan bisa kalian gunakan. Sekian pembahasan mengenai 5 Fitur Baru HTML 5.1 dan Cara Menggunakan nya. Semoga bermanfaat 🙂

Risman Hakim Author

Menjadi seorang Web Designer membuat saya ingin selalu berbagi ilmu. Berbagi tidak mengurangi ilmu, dengan berbagi ilmu akan terus bertambah. Kenal lebih jauh tentang saya di DUMET School :)

Leave a Reply

Your email address will not be published.