Pada dasar nya kita melakukan praktik HTML5 dan CSS3 seperti yang kita lakukan pada saat melakukan praktik HTML biasa, yaitu menggunakan Browser, Namun, ada sedikit catatan penting yang harus kita ketahui.
Saat ini masing masing jenis web browser memiliki tingkatan terhadap HTML5 yang berbeda, Untuk dapat melakukan praktik disarankan kita melakukan Upgrade browser yang paling baru.
Pada umumnya Browser Firefox dan Chrome memberikan dukungan HTML5 paling banyak maka untuk itu saat melakukan praktik kita bisa menggunakan kedua browser tersebut, Jika sebuah Tag HTML5 tidak bisa berjalan sebagaimana mestinya pada satu jenis browser, kita bisa mencobanya di browser lain.
Daftar Elemen di HTML5 baru
HTML5 mengusung banyak tag baru dan kita akan membahas beberapa yang penting, kita bisa menggunakan daftar berikut ini untuk mengetahui fungsi tag-tag tersebut secara singkat (
w3schools.com,2013)
| TAG | Keterangan |
| <article> | Untuk konten eksternal, seperti Teks dan artikel-berita, blog, forum atau konten lain dari sumber eksternal |
| <aside> | Untuk konten selain konten itu ditempatkan di samping konten yang masuk harus berkaitan dengan isi sekitar nya |
| <command> | Sebuah tombol, atau radiobutton, atau sebuah kotak centang |
| <details> | Untuk rician mengambarkan tentang sebuah dokumen atau bagian dari dokumen |
| <summary> | Sebuah keterangan, atau ringkasan, dalam rincian elemen |
| <figure> | Untuk pengelompokan bagian dari konten berdiri sendiri, bisa video juga |
| <figcaption> | Keterangan dari tokoh bagian |
| <footer> | Untuk footer dari dokumen atau bagian, dapat meliputi nama penulis, tanggal dokumen, informasi kontak atau informasi hak cipta |
| <header> | Untuk penerapan suatu dokumen atau bagian, dapat mencangkup navigasi |
| <hgroup> | Untuk bagian dari pos, menggunakan <h1> untuk <h6>, dimana yang terbesar adalah pos utama pada bagian tersebut, yang lain nya bisa sub-judul |
| <mark> | Untuk teks yang harus disorot |
| <meter> | Untuk pengukuran, digunakan hanya jika nilai nilai maksimum dan minimum diketahui |
| <nav> | Untuk bagian navigasi atau menu |
| <progress> | Keadaan pekerjaan berlangsung |
| <ruby> | Untuk penjelasan ruby (catatan Cina atau Karakter) |
| <rt> | Untuk penjelasan tentang penjelasan ruby |
| <rp> | apa untuk menunjukan browser yang tidak mendukung elemen ruby |
| <section> | Untuk bagian dalam dokumen, seperti Bab, Header, Footer, atau bagian lain dari dokumen |
| <time> | Untuk menentukan waktu atau tanggal, atau keduanya |
Elemen Media
| TAG | Keterangan |
| <audio> | Untuk konten multimedia, suara, musik atau streaming audio lainya |
| <video> | Untuk konten video, seperti klip film atau Sreaming video lainya |
| <source> | Untuk sumber suatu media pada elemen media, menjelaskan di dalam video atau media audio |
| <embed> | Untuk mengisi embedded, contohnya seperti plug-in atau mengambil video dari youtube. |
Elemen Kanvas
Elemen kanvas menggunakan Javascript untuk membuat gambar pada halaman web.
| TAG | Keterangan |
| <canvas> | Untuk membuat gambar pada sebuah halaman web |
Elemen form
| TAG | Keterangan |
| <datalist> | Daftar pilihan untuk nilai input |
| <keygen> | Hasilkan kunci untuk mengotentikasi pengguna |
| <output> | Untuk berbagai jenis output, seperti output yang ditulis oleh script |
|
Input Type Attribute Values
Untuk kontrol Input yang lebih baik sebelum mengirimnya ke server antara lain :
| Tipe | Keterangan |
| tel | Nilai input untuk nomer handphone |
| search | Untuk pada bidang pencarian |
| url | Nilai input untuk memasukan url |
| email | Untuk pengisian email atau lebih dari 1 email |
| datetime | Untuk pengisian waktu dan tanggal |
| date | Pengisian tanggal |
| month | Untuk pengisian bulan |
| week | penggisian dalam waktu minggu |
| time | Untuk pengisian waktu |
| datetime-local | Untuk pengisian lokal waktu dan tanggal |
| number | Untuk pengisian nomer |
| range | Untuk pengisian rentang waktu |
| color | Untuk pengisian heksadesimal sebuah warna, contohnya #FFFFFF (putih) |
