Membangun Web Kreatif Dengan HTML 5
Apakah HTML5?
- HTML5 adalah versi terbaru dari HTML, sudah mendapat dukungan oleh pembuat web browser.
- Mencakup semua fitur dari versi HTML sebelumnya, termasuk XHTML.
- Menambahkan satu set tools baru untuk pengembang web.
Tujuan HTML5
- Mendukung semua halaman web yang ada. Dengan HTML5, tidak ada persyaratan untuk kembali dan merevisi situs yang lebih tua.
- Mengurangi kebutuhan untuk plugin eksternal dan skrip untuk menampilkan konten website.
- Meningkatkan definisi semantik (yaitu makna dan tujuan) dari elemen halaman.
- Membuat render konten web universal dan independen dari perangkat yang digunakan.
- Menangani dokumen kesalahan (error) web dengan cara yang lebih baik dan lebih konsisten.
Semantik Baru HTML5
- <article> Unsur <article> digunakan untuk mendefinisikan item independen pada halaman yang dapat didistribusikan sendiri, seperti sebuah berita, posting blog, atau komentar.
- <section> Elemen ini merupakan bagian dari sebuah dokumen atau aplikasi, seperti bab atau bagian dari sebuah artikel atau tutorial. Misalnya, bagian Anda baca sekarang bisa dikelilingi oleh elemen <section> di HTML5.
- <nav> Ini adalah wadah untuk link navigasi utama pada halaman Web
- <aside>Elemen baru ini dapat digunakan untuk menandai sebuah sidebar atau beberapa konten lainnya yangdianggap agak terpisah untuk konten sekitarnya. Contohnya adalah iklan.
- <hgroup> Dalam beberapa kasus, halaman, artikel, atau bagian mungkin memerlukan lebih dari satu pos, seperti di mana Anda memiliki judul dan subjudul.
- <canvas> Unsur ini adalah salah satu aspek yang paling penting dariHTML5 karena memfasilitasi produksi grafik, permainan interaktif,aplikasi paint, dan grafis lain dengan cepat tanpa memerlukan plug-in eksternal sepertiAdobe Flash.
- <audio> dan <video> Kedua unsur ini memungkinkan Developer Web untuk memasukkan konten multimedia tanpa bergantung padapengguna untuk memiliki browser tambahan plug-in diinstal.
Fitur Baru di HTML5
- Built-in audio dan video (tanpa plugins)
- Perbaikan kontrol pada form dan attribute.
- Canvas (cara menggambar langsung di web page)
- Fungsionalitas Drag dan Drop
- Support terhadap CSS3
- Fitur yang lebih advanced untuk web developer, seperti data storage dan offline application.
Tampilan Awal di HTML5 Deklarasi DOCTYPE pada XHTML?
Pada HTML5, DOCTYPE dideklarasikan dengan lebih sederhana:
<!DOCTYPE html>
Hanya 15 karakter! DOCTYPE memberitahu browser yang jenis dan versi dokumen yang diharapkan. Mulai sekarang, semua versi masa depan dari HTML akan menggunakan deklarasi sama yang disederhanakan ini.
Element <html>
Berikut adalah penulisan element <html> pada XHTML:
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
HTML5 lebih sederhana:
<html lang="en">
Setiap bahasa dunia memiliki kode dua-karakter, misalnya Spanyol = "es", Perancis = "fr", Jerman = "de", Cina = "zh", Arab = "ar".
Atribut lang dalam elemen <html> menyatakan bahasa konten halaman dalam. Meskipun tidak sepenuhnya diperlukan, harus selalu ditentukan, karena dapat membantu mesin pencari.
Setiap bahasa dunia memiliki kode dua-karakter, misalnya Spanyol = "es", Perancis = "fr", Jerman = "de", Cina = "zh", Arab = "ar".
Bagian <head>
Berikut adalah bagian <head> pada XHTML :
Dan pada versi HTML5:
Perhatikan disederhanakan set karakter deklarasi, link teks CSS stylesheet lebih pendek, dan penghapusan trailing garis miring.
Dasar Halaman Web HTML5
Menempatkan bagian sebelumnya bersama-sama, dan sekarang menambahkan bagian <body> dan tag penutup :
Mari kita buka halaman ini dalam browser web untuk melihat bagaimana tampilannya .
0 Response to "Membangun Web Kreatif Dengan HTML 5"
Post a Comment