Rabu, 19 Desember 2012

Cara mengidentifikasi HTML5


Bagaimana cara mengidentifikasi HTML5?
Seperti halnya aplikasi atau script yang baru untuk mengembangkan versi yang lebih lama, HTML5 memiliki karakteristik baru, seperti dibawah ini:

1. HTML5 lebih bersih dan sederhana. Dibanding cara penulisan XHTML, cara penulisan HTML5 lebih sederhana dan simpel. Contoh, untuk penulisan script HTML5 saja, yang kita butuhkan hanyalah tag <!DOCTYPE HTML>. Bandingkan dengan membuat script XHTML.

2. Tag-tag baru yang ada di HTML5 lebih bersifat semantik. Oleh karena itu, satu browser dengan lainnya memiliki cara menampilkan tag yang agak berbeda. Sebagai contoh, jika kita menulis tag <h1> maka yang akan terlihat adalah teks berukuran besar tanpa menyuruh kita menspesifikasikan berapa ukuran font yang digunakan dan jenis font yang dipakai.

3. HTML5 tetep terikat oleh CSS (cascading Style Sheet). Dalam dunia website saat ini, script HTML5 saja kurang cukup mumpuni karena tag – tag didalamnya tidak didesain secara penuh untuk mempercantuk desain, digunakanlah CSS. Jadi dapat diibaratkan, tag HTML5 berfungsi untuk menentukan pengaturan – pengaturan bagian dan fungsi tiap-tiap elemen di dalam sebuah website. Sedangkan CSS mengatur bagaimana bagian-bagian dan fungsi itu akan terlihat di dalam website.

4. HTML5 sering berinteraksi dengan Javascript. Ada beberapa tag yang tak bisa bekerja dengan optimal jika tidak dilengkapi dengan Javascript. Misalnya tag <canvas>.

5. Untuk mengetahui apakah browser yang anda pakai mendukung seluruh tag beserta atribut HTML5 atau tidak, serta untuk “ mengintip” tag-tag apa saja yang belum di support, kunjungilah situs www.html5test.com .

6. Sampai saat ini, Google chrome merupakan browser yang paling banyak mendukung HTML5. Untuk menguji score tiap browser, silahkan klik tab Other Browser.

Sumber : Enterprise, Jubilee. 2012 . Buku Pintar HTML5 + CSS3 + DreamWeaver CS6. Jakarta: PT Elex Media komputindo .


HTML5 DAN HTML4


Dalam Tugas kali ini saya akan membahas tentang apa itu HTML5 beserta dengan fitur - fitur nya dan apa yang membedakan antara HTML5 dengan HTML 4.

HTML5 akan diprediksi menjadi standar desain website baru di saat ini atau akan datang. HTML5 ini berbeda dengan HTML versi – versi yang lama, dimana kita bisa membuat video, animasi, modifikasi gambar bitmap, dan game langsung memakai HTML5 (didukung dengan script lainya seperti Javascript dan CSS).  HTML5 dikembangkan pertama kali pada tahun 2004, teteapi HTLM5 versi perdana diperkenalkan pada tahun 2008. Ditulis pertama kali oleh Ian Hickson. Secara umum, Editor HTML5 dapat dibagi menjadi 2 jenis, yaitu WYSIWYG Editor antara lain Dreamweaver CS6 dan non- WYSIWYG Editor antara lain notepad.

Fitur – Fitur yang terdapat pada HTML5 :
Kita mengenal beragam elemen atau komponen form seperti textbox, radiobutton, text area, dan tombol submit, maka pada HTML5 kita akan mengenal elemen-elemen baru yaitu seperti dibawah ini walaupun belum semua elemen bisa ditampilkan dengan baik di setiap browser.
1. Datalist : berfungsi untuk membantu kita menciptakan daftar saran ke dalam text box.
2. Fieldset : memberikan border dan label.
3. Keygen : Jika ingin mengirim data dengan dengan aman.
4. Meter : menampilkan angka diantara range tertentu.
5. Output : berfungsi untuk menampilkan teks yang sudah dimodifikasi menggunakan script tertentu. Bisa menampilkan teks interaktif yang bisa berubah setelah kita menekan tombol submit.
6. Progress : Untuk menentukan berapa banyak tugas telah diselesaikan dan biasanya disajikan dalam satuan presentase.

Beberapa Atribut –atribut baru :
  1. Autofocus
  2. Pattern
  3. Placeholder
  4. Required

Contoh – contoh tag dan elemen semantik yang baru ada di dunia HTML5 adalah :
1. Address : Digunakan untuk membuat informasi tentang alamat seseorang di dalam salah satu bagian situs.
2. Article : biasanya dipakai untuk menulis teks-teks, yang dalam tulisan ilmiah disebut dengan istilah kutipan.
3. Aside : Digunakan untuk menentukan bagian kecil didalam halaman atau dokumen website yang terkait dengan bagian utama dalam sebuah situs.
4. Footer
5. Header
6. Hgroup : Digunakan untuk membuat daftar isi sebuah halaman.
7. Menu
8. Nav : digunakan untuk membuat navigasi.
9. Section : memecah halaman kedalam beberapa bagian.
10. Command
11. Figure and Figcaption :Memberi informasi pada sebuah gambar.
12. Audio : Berfungsi untuk meng-embed(menempelkan) file suara langsung kedalam sebuah situs dan suara itu dimainkan tanpa menggunakan proses download terlebih dahulu.
13. Video : untuk memainkan file video langsung dari situs tanpa melibatkan plugin apapun termasuk flash.
14. Canvas : berfungsi untuk menciptakan ruang didalam halaman situs yang nanti dipakai untuk menggambar atau mengedit sebuah objek.
15. Embed : berfungsi untuk “menempelkan” berbagai jenis media ke dalam sebuah halaman situs, seperti flash.

Perbedaan HTML5 dan HTML 4, HTML4 dan versi lama didesain untuk membuat website dan bagaimana website itu tampak didalam jendela browser. Sedangkan HTML5 dikembalikan ke fungsi awalnya dimana untuk mengatur bagaimana sebuah dokumen(website) ditata bagian per bagian. Tag-tag HTML5 lebih ditekankan pada fungsi untuk pembagian struktur dokumen(website).

Firefox 3 memgumumkan kalau browser ini menjadi browser yang pertama men-support HTML5. Lalu disusul dengan chrome, Safari, internet explorer dan Youtube. Lalu ada Scribd. Pada  bulan September 2011, Alexa mencatat ada 34% 100 situs popular dunia sudah mengadopsi HTML5.  

Sumber : Enterprise, Jubilee. 2012 . Buku Pintar HTML5 + CSS3 + DreamWeaver CS6. Jakarta: PT Elex Media komputindo.