Menunggu...

Pengenalan dan Pemahaman Dasar HTML5

Mengingat perkembangan teknologi khususnya dunia internet semakin maju dan beredar kabar usangnya beberapa elemen HTML 4.01 mengaharuskan kita untuk segera dan bersiap migrasi ke HTML5 generasi masa depan bahasa pemrograman website.

Untuk mengahadapi tuntutan zaman ini blogger pemula akan membahas tuntas tentang segala hal yang berkaitan dengan HTML5, mudah-mudahan pembahasan ini akan bermanfaat untuk sahabat semua.
Untuk mengawali pembahasan HTML5 ini ada baiknya kita mengetahui tentang pengenalan dan pemahaman dasar HTM5 agar kedepanya kita bisa memahami cara kerja dan pengaplikasianya.


Apa itu HTML5?

Berdasarkan pemahaman yang saya ketahui HTML5 merupakan teknologi terbaru HTML (Hypertext Markup Language) yang merupakan salah satu bahasa pemrograman web yang dinaungi oleh World Wide Web Consortium atau biasa dikenal dengan W3C.

HTML5 mulai diperkenalkan kepada publik sejak tahun 2008, meski demikian HTML5  baru di kenal luas dan secara resmi di release pada tahun 2011. Para programmer mulai memiliki ketertarikan khusus untuk menggunakan teknologi baru ini akan tetapi kompatibilitas browser pada saat itu masih sangat minim sehingga menyulitkan para web developer untuk menggunakan HTML5 secara cross browser.

HTML5 bekerja secara bersamaan dengan CSS3. Walaupun masih belum berstatus Final, kedua teknologi ini sudah dapat digunakan secara efektif. W3C masih berusaha memaksimalkan teknologi baru ini agar lebih stabil, tetapi masih terlihat seperti perjalanan panjang. Sejak teknologi ini diperkenalkan, perhatian W3C terfokus pada pengembangannya sehingga menjadi Continuous Development atau terus dikembangkan hingga saat ini.

Beberapa keunggulan yang ditawarkan teknologi HTML5 :
  1. Fitur-fitur baru yang tersedia dan berbasis pada HTML, CSS, DOM, dan JavaScript.
  2. Kebutuhan penggunaan plugin ekstra seperti Flash Player dapat diminimalkan sehingga website dapat di download secara lebih efektif dan cepat.
  3. Penanganan error yang lebih mudah daripada versi sebelumnya.
  4. Banyak tag dan element-element baru yang digunakan untuk menyederhanakan penulisan kode program.
  5. HTML5 merupakan sebuah device yang independent.

Apa yang baru di HTML5?

HTML5 dihadirkan guna untuk menyederhanakan proses pengkodean dan lebih logis. HTML5 sangat dibutuhkan oleh website-website yang memiliki basis konten multimedia karena telah banyak syntax yang diperuntukkan multimedia content.
Banyak fitur yang telah dibuat dengan memperhatikan besarnya data yang digunakan tetapi tetap dapat memberikan kompatibilitas terhadap semua device sehingga dapat meningkatkan mobilitas penggunaan konten informasi yang diinginkan oleh para pengguna.

Beberapa fitur baru tersebut seperti element <video>, <audio>, dan <canvas>, serta integrasi terhadap Vector Graphics Content (<object> tag). Hal ini menyimpulkan bahwa konten website yang berbasis multimedia dan grafis dapat di-handle oleh HTML5 dan tentunya dapat digunakan dengan mudah dan lebih cepat tanpa harus menggunakan plugin tambahan atau APIs.



Struktural baru yang terdapat pada HTML5
  • Elemen Media
  1. <audio> Mendefinisikan konten suara
  2. <video> Mendefinisikan sebuah video atau film
  3. <source> Mendefinisikan beberapa sumber media <video> dan <audio>
  4. <embed> Mendefinisikan sebuah wadah untuk aplikasi eksternal atau konten interaktif (plug-in)
  5. <track> Mendefinisikan trek teks untuk <video> dan <audio>

  • Elemen Formulir
  1. <datalist> Menentukan daftar pilihan yang telah ditetapkan untuk kontrol input
  2. <keygen> Mendefinisikan kunci-pair bidang pembangkit (untuk formulir)
  3. <output> Mendefinisikan hasil penghitungan

  • Semantik / Elemen Struktural 
HTML5 menawarkan unsur-unsur baru untuk struktur yang lebih baik antara lain :
  1. <canvas> Digunakan untuk menggambar grafik, on the fly melalui scripting (biasanya JavaScript)
  2. <article> Mendefinisikan sebuah artikel
  3. <aside> Mendefinisikan konten selain dari konten halaman
  4. <bdi> Isolat merupakan bagian dari teks yang dapat diformat dalam arah berbeda dari teks lain di luar itu
  5. <command> Mendefinisikan sebuah tombol perintah bahwa seorang pengguna dapat meminta
  6. <details> Mendefinisikan rincian tambahan bahwa pengguna dapat melihat atau menyembunyikan
  7. <dialog> Mendefinisikan sebuah kotak dialog atau jendela
  8. <summary> Mendefinisikan sebuah judul terlihat untuk elemen <details>
  9. <figure> Menentukan konten mandiri, seperti ilustrasi, diagram, foto, daftar kode, dll
  10. <figcaption> Mendefinisikan sebuah caption untuk elemen <figure>
  11. <footer> Mendefinisikan footer untuk dokumen atau bagian
  12. <header> Mendefinisikan sebuah header untuk dokumen atau bagian
  13. <mark> Mendefinisikan ditandai / teks yang disorot
  14. <meter> Mendefinisikan pengukuran skala dalam kisaran yang dikenal (a gauge)
  15. <nav> Mendefinisikan navigasi link
  16. <progress> Merupakan kemajuan tugas
  17. <ruby> Mendefinisikan sebuah penjelasan ruby (untuk tipografi Asia Timur)
  18. <rt> Mendefinisikan penjelasan / pengucapan karakter (untuk tipografi Asia Timur)
  19. <rp> Mendefinisikan apa yang harus ditampilkan di browser yang tidak mendukung penjelasan ruby
  20. <section> Mendefinisikan bagian dalam dokumen
  21. <time> Mendefinisikan tanggal / waktu
  22. <wbr> Mendefinisikan garis-break mungkin
Seperti yang di singgung pada awal pembahasan di atas bahwa ada beberapa elemen HTML 4.01 yang telah usang dan penggunaanya telah di hapus pada generasi HTML5 yaitu :
  1. <acronym>
  2. <applet>
  3. <basefont>
  4. <big>
  5. <center>
  6. <dir>
  7. <font>
  8. <frame>
  9. <frameset>
  10. <noframes>
  11. <strike>
  12. <tt>
Kita sebagai pengguna teknologi khususnya teknologi internet tentunya tidak ingin tertinggal dengan perkembangan teknologi generasi terbaru, apalagi jika teknologi yang sedang kita gunakan sekarang (HTML 4.01 ) terancam tidak lagi berfungsi pada browser dimasa depan.

Sekedar informasi browser teratas seperti Chrome, Safari, Firefox, Opera, dan IE  telah memberikan kompatibilitas terhadap HTML5, ini membuktikan bahwa generasi HTML5 akan menggantikan generasi sebelumnya HTML 4.01 yang secara tidak langsung akan menghapus fungsi pengoprasianya.

So sobat segeralah bergegas untuk migrasi ke teknologi generasi masa depan HTML5 jika tidak mau tertinggal jauh dengan perkembangan zaman saatt ini.
Semoga artikel tentang pengenalan dan pemahaman dasar HTML5 ini bermanfaat untuk sahabat semua, salam persaudaraan....
Advertise Here
By adjieumbara.blogspot.com
300x250

Klik disini untuk berkomentar 16 komentar:

avatar

Ternyata cukup membingungkan gan :)

avatar

lengkap sangat sob, saking lengkapnya saya tambah bingung tentang HTML5 haha :D

avatar

apalagi saya mas :-s

avatar

@mestiqui.com
Tidak usah bingung sob kita belajar secara pelan-pelan nanti juga mengerti dengan berjalanya waktu (o)

avatar

@Kang Ucup kita belajar bersama sob dengan silaturahmi dan saling berbagi.. (o) :))

avatar

Hehe... tidak usah bingung-bingung,, lewati saja.... hiks

avatar

Sulit belajarnya :)

avatar

Mantap mas.. jgn lupa kunjungan baliknya :)

avatar

Ok thanks sahabat..

avatar

Ternyata rumit banget ya mas soal HTML5 untuk dipahami. Tapi selalu saja diperbincangkan oleh para blogger tentang HTML5. Katanya kalau widget blog atau apalah yang ada di blog itu nggak valid HTML5 maka nggak SEO Friendly. Jadi bingung sendiri hehe :)

avatar

Lumayan rumit, hal ini banyak diperbincangkan karena HTML5 adalah sesuatu yang baru yang belum banyak di ketahui para blogger sehingga akan menarik perhatian banyak pengunjung, hehee
HTML5 juga merupakan sebuah kebutuhan untuk browser masa depan sehingga kita perlu untuk menguasainya agar tidak ketinggalan :d :))

avatar

Lumayan sulit sih tapi kita tetap perlu belajar meski tidak menguasainya... :d

avatar

btw dari tadi saya bingung soalnya gk nemu jalan lewatnya? ke arah mana sob? :D

avatar

:-d :-d hehehe bisa aja nih sobat

avatar

Rekomendasi Artikel Terkait ->

SUBSTANSI :

Mengenal Layout Semantik HTML 5
Contoh Elemen Semantik Terbaru di HTML5
Contoh Layout Halaman Website
Praktik Membuat Halaman Sederhana dengan HTML5

Pranala -> Praktek Membuat Halaman Website Dengan HTML 5

Berkomentarlah dengan bijak karena setiap perkataan yang kita ucapkan merupakan cermin pribadi seperti apa diri kita..

Terima kasih atas komentar Anda