Sekarang ini penggunaan HTML5 dan CSS3 semakin digandrungi. Alasan utamanya adalah, karena fitur-fitur nya yang menarik dan dukungan Browser yang semakin banyak untuk penerapan HTML5 dan CSS3. Dan penggunaanya justru semakin mudah, kita bisa mencari berbagai tutorial tentang script ini. Untuk reference resmi bisa didapatkan dari http://dev.w3.org/html5/spec/Overview.html atau http://www.w3.org/TR/CSS/ atau http://www.w3.org/2009/cheatsheet/ atau http://www.css3.info/ atau http://www.w3.org/2009/cheatsheet/ dan banyak lagi. Dan tidak lupa juga untuk kita yang masih awam, wajib mencoba petunjuk-petunjuk yang ada di http://www.w3schools.com/.

Mari kita coba beberapa Keajaiban yang dimiliki HTML5.

Ini dia Element Terbaru dari HTML5

HTML5 meng-claim, memiliki struktur element yang lebih baik, penanganan yang lebih baik dalam form handling, drawing dan media content. Sehingga penggunaan akan memudahkan penggunaan aplikasi internet saat ini. Berikut ini beberapa Group element yang bisa kita nikmati:

1. Element Semantic (struktural)
   1. <article>
   2. <aside>
   3. <figure>
   4. <summary>
   5. <detils>
   6. <command>
   7. <footer>
   8. <header>
   9. <hgroup>
   10. <mark>
   11. <meter>
   12. <nav>
   13. <progress>
   14. <section>
   15. <time>
2. Element Media
   1. <audio>
   2. <video>
   3. <source>
   4. <embed>
   5. <track>
3. Element Form
   1. <datalist>
   2. <keygen>
   3. <output>
4. Element Canvas
   1. <canvas>

 

Penggunaan Video & Audio HTML5?

Untuk menampilkan media berupa audio atau video, menjadi relatif lebih mudah. Kalau biasanya melakukan ini dengan bantuan Flash Player, sekarang semua itu bisa langsung dilakukan pada HTML5. Berikut ini contoh penggunaan video tanpa menggunakan Flash Player,

<video width="320" height="240" controls="controls">
 <source src="movie.mp4" type="video/mp4" />
 <source src="movie.ogg" type="video/ogg" />
 Your browser does not support the video tag.
</video>

untuk mencoba langsung secara oline, silahkan cek di sample Video HTML5. Sedangkan untuk penggunaan audio, tidak jauh berbeda, seperti berikut ini.

<audio controls="controls">
 <source src="song.ogg" type="audio/ogg" />
 <source src="song.mp3" type="audio/mpeg" />
 Your browser does not support the audio element.
</audio>

sample audio HTML5 bisa Anda dapatkan di sample Audio HTML5. Selain itu kita juga perlu untuk mengetahui detil dari setiap attribut/property/event yang dimiliki oleh 2 Element ini. Beberapa diantara nya adalah sebagai berikut,

1. Method action: play(), load(), pause(), addTextTrack().
2. Propoerty: autoplay, buffered, loop, volume, textTrack, duration, muted, src, controller.
3. Event: playing, seeking, loadstart, pause, progress, abort, canplay.