BlogHTML 5

HTML 5

-

Apa itu HTML 5 ?  saya pun tak tau, so mari kita belajar mengenalnya ,………………………………

Ok here we go! What is HTML 5 ? HTML5 merupakan revisi ke 5 dari bahasa markup World Wide Web, HTML. Berbeda dengan HTML 4 yang hanya memberikan perubahan layouting pada HTML 5 ini akan membawa perubahan tidak hanya dibidang tersebut, seperti halnya tag canvas dan video kedua tag tersebut merupakan salah satu andalan perubahan pada HTML5. Selain 2 tag itu HTML 5 juga memiliki perubahan dan penambahan tag lainnya, so Mari kita bahas beberapa tag pada html 5, sekali lagi beberapa tag ajah yah kalo mau tau banyak baca aja di doubleYouThreeSchool aje ye…

 

The Doctype.

Sintak ini wajib diletakan pada awal dokumen HTML 5. The doctype ini bukan tag html melainkan sebuah deklarasi untuk mendefinisikan kepadabrowser kode ini (tag html) tersebut ditulis dalam versi HTML apa.

“The doctype declaration is not an HTML tag; it is an instruction to the web browser about what version of the markup language the page is written in.” (w3school).

Contoh penulisannya :

[sourcecode language=’html’]

< !DOCTYPE html>

Title of the document

The content of the document……


[/sourcecode]

SVG Support

Scalable Vector Graphic merupakan bahasa untuk membuat grafis/gambar 2 dimensi dengan kode XML.

Berikut contoh kode:

[sourcecode language=’html’]


[/sourcecode]

Element

Elemen-elemen berikut telah diperkenalkan dalam struktur yang lebih baik:

  • section merupakan dokumen generik atau bagian aplikasi. Hal ini dapat digunakan bersama dengan h1 , h2 , h3 , h4 , h5 , dan h6 elemen untuk menunjukkan struktur dokumen.

[sourcecode language=’html’]

WWF

The World Wildlife Foundation was born in 1961…

[/sourcecode]

  • article merupakan bagian independen dari isi dokumen, seperti entri blog atau artikel koran.
  • aside merupakan bagian dari konten yang hanya sedikit berhubungan dengan sisa halaman.
  • hgroup digunakan untuk mengelompokan tag heading.

[sourcecode language=’html’]

Welcome to my WWF

For a living planet

[/sourcecode]

  • header tag untuk posisi bagian atas, biasanya merupakan sekelompok navigasi.

  • footer merupakan footer untuk bagian dan dapat berisi informasi tentang penulis, informasi hak cipta, dll

  • nav merupakan bagian dari dokumen dimaksudkan untuk navigasi.

  • figure dapat digunakan untuk pembungkus kode gambar, video, diagram atau foto.

[sourcecode language=’html’]

Example

[/sourcecode]

  • figcaption dapat digunakan sebagai keterangan pada gambar, penggunaanya bisa dibarengkan dengan tag figure. Berikutnya contohnya :

[sourcecode language=’html’]

A view of the pulpit rock in Norway

[/sourcecode]

 

Beberapa tag baru :

  • video dan audio, tag yang dapat digunakan untuk konten multimedia, intinya buat load video atau pideo getoh…

  • track, merupakan tag yang belum disupport oleh browser manapun (w3school), tag ini bertujuan untuk dapat memberikan subtitle pada video.

  • canvas digunakan untuk rendering grafis bitmap dinamis on the fly, seperti grafik atau game. (gambar gambar gituh deh…)

  • mark, digunakan untuk memberikan efek highlight pada text. contoh penggunaannya dibawah ini untuk memberikan efek pada kata milk :

[sourcecode language=’html’]

Do not forget to buy milk today.

[/sourcecode]

  • wbr merupakan element yang digunakan untuk memerikan tanda posisi pemotongan pada text html yang dikarenakan oleh layar. Contohnya pada kata XML<wbr>Http<wbr>Request, dengan pemberian tag ini ketika harus pindah baris maka pemotongan kalimatnya berada setelah text XML atau Http.

[sourcecode language=’html’]
To learn AJAX, you must be familiar with the XMLHttpRequest Object.
[/sourcecode]

Hmmm sepertinya masih banyak element/atribut dan perubahan-perubahan di HTML 5. dan jikalau anda memang tertarik mempelajarinya silakan beranjak ke site doubleYouThreeSchool. Ups satu lagi sebelum anda coba HTML 5 ada baiknya cek kompatibilitas browser anda dengan HTML 5 disini . Saya coba cek kompatibilitas browser firefox 7.x saya dan cukup banyak juga yang masih belum kompatible.

 

Kutipan ringakasan :

Differences from HTML 4.01/XHTML 1.x

The following is a cursory list of differences and some specific examples.

  • New parsing rules oriented towards flexible parsing and compatibility; not based on SGML
  • Ability to use inline SVG and MathML in text/html
  • New elements – section, article, footer, audio, video, progress, nav, meter, time, aside, canvas
  • New types of form controls – dates and times, email, url, search
  • New attributes – ping (on a and area), charset (on meta), async (on script)
  • Global attributes (that can be applied for every element) – id, tabindex, hidden, data-* (custom data attributes)
  • Forms will get support for PUT and DELETE methods too instead of just GET and POST (see Representational State Transfer for use cases)
  • Deprecated elements dropped – center, font, strike, frameset

 

Ardhitya Wiedha Irawan
Ardhitya Wiedha Irawanhttp://aiueo.web.id
Full time Web Developer - Part time Android Coder - Part time Publisher - Big fan of #GGMU.

Latest news

Perbedaan Apache2 Reload dan Restart ?

Kamu pengguna apache ? ahh selamat! berarti kamu orang lama yang sulit move on haha. Konon sekarang di dunia...

Membuat Shortcut untuk switch Dark dan Light Mode di Macbook

Baru baru ini aku menginginkan sebuah fungsi tombol yang bisa mengganti tema di Macbook secara cepat, dari Dark Mode...

Cara buat Sticker langsung di Web WhatsApp tanpa Install aplikasi!

Hai sob! kali ini gulangguling.com akan berbagi cara mudah membuat sticker untuk whatsapp tanpa harus install aplikasi lainnya. Sering...

Cara Mengembalikan Nomer WhatsApp yang terkena Banned

Halo teman-teman. Kali ini saya akan berbagi cara mengembalikan nomer yang sudah terkena banned dari aplikasi WhatsApp. Tapi sebelumnya...

Aplikasi Rambox, dapat digunakan untuk login banyak akun WhatsApp hingga marketing jualan.

Aplikasi Rambox adalah sebuah program yang dirancang untuk mengintegrasikan beberapa aplikasi chatting dan kolaborasi dalam satu tempat. Dengan menggunakan...

Cara melihat history Kometar dan Like di Instagram

Pernah penasaran dengan apa saja sih yang pernah kita lakukan di Instagram? seperti kita likes komentarin postingan siapa saja...

Must read

You might also likeRELATED
Recommended to you