Hay semua berjumpa lagi bersama saya giovanni , bagai mana kabar kalian ? lama saya tidak mengepost artikel , dan kali ini kita akan belajar mengenal HTML 5 , yuk langsung aja guyssss
Pengertian HTML 5
HTML5 adalah sebuah bahasa markah untuk menstrukturkan dan menampilkan isi dari Waring Wera Wanua, sebuah teknologi inti dari Internet. HTML5 adalah revisi kelima dari HTML (yang pertama kali diciptakan pada tahun 1990 dan versi keempatnya, HTML4, pada tahun 1997) dan hingga bulan Juni 2011 masih dalam pengembangan. Tujuan utama pengembangan HTML5 adalah untuk memperbaiki teknologi HTML agar mendukung teknologi multimedia terbaru, mudah dibaca oleh manusia dan juga mudah dimengerti oleh mesin.
HTML5 merupakan salah satu karya Konsortium Waring Wera Wanua (World Wide Web Consortium, W3C) untuk mendefinisikan sebuah bahasa markah tunggal yang dapat ditulis dengan cara HTML ataupun XHTML. HTML5 merupakan jawaban atas pengembangan HTML 4.01 dan XHTML 1.1 yang selama ini berjalan terpisah, dan diimplementasikan secara berbeda-beda oleh banyak perangkat lunak pembuat web.
PENGENALAN STRUKTUR HTML
Seiring dengan perkembangan Web yang semakin inovatif, HTML 4 yang telah berkibar selama hampir satu dekade ini akhirnya mulai semakin dikembangkan kearah yang lebih baik atau kita kenal dengan nama HTML 5.
HTML 5 menjanjikan fleksibilitas lebih bagi penulis, memungkinkan Website lebih menarik dan interaktif serta memperkenalkan dan meningkatkan berbagai Fitur, seperti Kontrol bentuk, API, multimedia, struktur, dan semantik.
HTMl 5 Mulai bekerja pada tahun 2004, dibawah asuhan W3C HTML WG dan WHATWG. Bahkan, Empat Vendor Browser besar seperti Firefox, Apple, Opera, Dan Google kabarnya ikut mengembangkan HTML 5.
Nah, Struktur Dasar HTML dapat anda lihat dibawah ini:
Nah, gambar diatas adalah Struktur HTMl 4 yang masih menggunakan Elemen div yang masing-masing memberikan id deskriptif atau kelas untuk menggambarkan bagian-bagian khusus. Maklum Versi HTML 4 masih kekurangan semantik. Nah, HTML 5 mulai memperbaiki hal ini dengan membuat masing-masing elemen mewakili bagian yang berbeda dan tidak perlu menggunakan penggambaran khusus lagi. Klo digambarkan akan seperti gambar dibawah ini.
gambar di atas menunjukan bahwa elemen-elemen div dapat di gantikan dengan unsur-unsur baru : heder,nav,baian artikel,samping dan foter
Markup untuk Dokumen dapat digambarkan sebagai berikut:
<body>
<header>...</header>
<nav>...</nav>
<article>
<section>
...
</section>
</article>
<aside>...</aside>
<footer>...</footer>
</body>
Contohnya, Struktur Dibawah ini yang ditandai dengan bagian nested dan elemen h1:
<section>
<h1>Level 1</h1>
<section>
<h1>Level 2</h1>
<section>
<h1>Level 3</h1>
</section>
</section>
</section>
Perhatikan Struktur Diatas, Untuk kompabilitas yang lebih baik dengan Browser saat ini, telah dimungkinkan menggunakan elemen post lain (h2 untuk h6) tepat ditempat elemen h1. itulah salah satu keuntungan menggunakan elemen ini.
Dengan mengidentifikasi halaman menggunakan elemen sectioning spesifik, teknologi bantu dapat membantu pengguna untuk lebih mudah menavigasi halaman. Misalnya, mereka dengan mudah dapat melompat ke bagian navigasi atau cepat melompat dari satu artikel ke berikutnya tanpa perlu bagi penulis untuk memberikan skip link.
Selanjutnya, Pada elemen header anda dapat menyertakan sub judul, informasi atau lainnya. Seperti Struktur Dibawah Ini:
<header>
<h1>A Preview of HTML 5</h1>
<p class="byline">By Ferdinand</p>
</header>
<header>
<h1>Example Blog</h1>
<h2>Insert tag line here.</h2>
</header>
Setelah itu bagian lainnya adalah Footer yang berisi data hak Cipta, Link ke halaman Terkait dan lainnya, Strukturnya seperti dibawah ini:
<footer>© 2010 DJ Note Inc.</footer>
Selanjutnya adalah bagian link navigasi, dengan struktur seperti dibawah ini:
<nav>
<ul>
<li><a href="/">Home</a></li>
<li><a href="/prolog">Prolog</a></li>
<li><a href="/contact">Contact</a></li>
<li><a href="/about">About</a></li>
</ul>
</nav>
Selanjutnya adalah Struktur Sidebar, seperti dibawah ini:
<aside>
<h1>Archives</h1>
<ul>
<li><a href="/2010/09/">September 2010</a></li>
<li><a href="/2010/08/">August 2010</a></li>
<li><a href="/2010/07/">July 2010</a></li>
</ul>
</aside>
Selanjutnya, Section yang merupakan bagian utama dalam sebuah dokument, misalnya kita bayangkan seperti sebuah Bab dengan Struktur seperti dibawah ini:
<section>
<h1>Chapter 1: Saya Orang Kreatif</h1>
<p>Banyak yang bilang saya gak cerdas dan bengal, dan saya akui demikianlah saya, tapi ditengah kebodohan saya, saya tetap bersyukur diberikan otaQ yang kreatif oleh Tuhan
...</p>
</section>
Terakhir adalah Unsur artikel, yang berisi konten, postingan, komentar dan lainnya, Strukturnya seperti dibawah ini:
<article id="comment-3">
<header>
<h4><a href="#comment-3" rel="bookmark">Comment #3</a>
by <a href="http://example.com/">Google</a></h4>
<p><time datetime="2010-08-29T13:58Z">August 29th, 2010 at 13:58</time>
</header>
<p>Blogwalking Gan!</p>
</article>
Di sini saya akan menjelaskan tentang kelebihan dan kekurangan HTML 5 guysss.
- Kelebihan yang dimiliki HTML 5
- Fitur kanvas untuk menggambar menggunakan script code
- Fitur video dan audio untuk media pemutar file multimedia
- Integrasi yang lebih baik dengan aplikasi situs dan pemrosesannya
- Integrasi (‘inline’) dengan doctype yang lebih sederhana
- Penulisan kode yang lebih efisien
- Penanagan kesalahan yang lebih baik
- Mengurangi kebutuhan untuk plugin eksternal
- Lebih markup untuk menggantikan scripting
- Kekurangan yang dimiliki HTML 5
mungkin itu saja artikel HTML 5 kali ini , tunggu upload artikel saya yang baru guys , terimakasih
reverensi :
http://dj-note.blogspot.com/2011/01/tutorial-lengkap-untuk-belajar-dasar.html
https://gandha23.wordpress.com/2013/10/14/kelebihan-dan-kekurangan-html-5/
klik untuk buka reverensi
Tidak ada komentar:
Posting Komentar