HTML5 adalah bahasa markup terbaru untuk menyajikan konten multimedia di internet. HTML5 memperkenalkan fitur-fitur baru seperti kanvas, video, audio, serta dukungan penyimpanan offline dan kontrol form. HTML5 juga mendefinisikan protokol WebSocket untuk memungkinkan komunikasi dua arah antara klien dan server.
2. HTML5
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[1]) 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.
Berikut tujuan dibuatnya HTML5 :
Fitur baru harus didasarkan pada HTML, CSS, DOM, dan JavaScript
Mengurangi kebutuhan untuk plugin eksternal ( Seperti Flash )
Penanagan kesalahan yang lebih baik
Lebih markup untuk menggantikan scripting
HTML5 merupakan perangkat mandiri
Proses pembangunan dapat terlihat untuk umum
Fitur baru dalam HTML5 :
Unsur kanvas untuk menggambar
Video dan elemen audio untuk media pemutaran
Dukungan yang lebih baik untuk penyimpanan secara offline
Elemen konten yang lebih spesifik, seperti artikel, footer, header, nav, section
Bentuk kontrol form seperti kalender, tanggal, waktu, email, url, search.
Beberapa browser sudah mendukung HTML5 seperti safari, chrome, firefox, dan opera.
Kabarnya IE9 ( Internet Explorer ) akan mendukung beberapa fitur dari HTML5.
3. Perbedaan-perbedaan dengan versi HTML sebelumnya
Penambahan elemen baru:
section serupa seperti h1-h6
article bisa berupa entri blog atau tulisan konten
aside menyajikan konten pelengkap
header bisa menyajikan judul, deskripsi, bahkan nav untuk navigasi
footer berisi catatan kaki seperti informasi hak cipta, penulis, kontak, dan sebagainya
dialog yang dikombinasikan dengan dt dan dd (seperti pada halaman FAQ) dapat
digunakan untuk menyajikan percakapan
yang fenomenal adalah penggunaan elemen figure, video, audio, source, embed,
canvas, dan elemen terkait berkas multimedia lainnya.~ Penambahan atribut baru:
atribut media, ping pada elemen pranala
autofocus, placeholder, required, autocomplete, dan sebagainya, terkait elemen input
dan form
reversed pada elemen ol untuk urutan besar ke kecil.~ Perubahan makna elemen:
Elemen b dilegalkan sebagai tipografi penegas, seperti pada kata kunci yang ingin
ditonjolkan, tidak ‘deprecated’ (bukan fitur yang dianggap usang). Tidak lebih dari itu.
Jadi tetap tidak bermakna semantik tertentu. Hal yang sama berlaku pula untuk
elemen i
Elemen strong menegaskan level kepentingan, bukan sekadar penekanan emphasis
lagi
Elemen hr dapat digunakan untuk memisahkan level paragraf sesuai pokok pikirannya
dan lain-lain.~ Elemen dan atribut yang tidak digunakan:
center
font
strike, u, big
frame, frameset, noframes
acronym
longdesc
scope pada td
dan sebagainya.
4. Contoh Web yang telah
mengimplementasikan HTML5 1
Beberapa contoh website yang menggunakan
HTML 5, seperti dibawah ini:
Adobe – The Expressive Web
Orange Spocket
Har Du Det I Deg
HTC
BeerCamp 2012
5. Web Socket HTML5
a) HTML5 WebSocket, bringing socket to the
web
b) Pada spesifikasinya, WebSocket didefinisikan sebagai sebuah Application
Programming Interfaces (API) yang membuat koneksi "socket" antara web browser
dan server. Dalam kata polos: Ada sebuah koneksi tetap antara klien dan server, dan
kedua pihak dapat memulai mengirim data kapan saja.
c) WebSocket merupakan bagian dari HTML5. WebSocket menghadirkan pengurangan
besar dalam lalu-lintas jaringan yang tidak penting dan latency dibandingkan dengan
solusi polling dan long-polling yang telah digunakan untuk mensimulasikan koneksi
dua arah dengan cara menjaga dua koneksi tetap terhubung.
6. HTML5 WebSocket memperhitungkan bahaya jaringan seperti proxy dan firewall,
sehingga memungkinkan streamingmelalui koneksi apapun, dan dengan kemampuan
untuk mendukung komunikasi hulu dan hilir melalui koneksi tunggal, aplikasi berbasis
WebSocket mengurangi beban pada server, memungkinkan mesin yang telah ada
untuk mendukung banyak koneksi yang berbarengan. Gambar 2.1 memperlihatkan
arsitektur dasar berbasis WebSocket yang mana beberapa browser menggunakan
koneksi WebSocket untuk komunikasi langsung, dua arah dengan host remot.
7. i. Satu dari sekian banyak fitur unik yang disediakan WebSocket adalah kemampuannya
untuk melintasi proxy dan firewall, yang mana merupakan wilayah yang umumnya
bermasalah untuk kebanyakan aplikasi. Aplikasi berbasis Comet biasanya
menggunakan long-polling sebagai garis pertahanan yang belum sempurna untuk
mempertahankan diri dari firewall dan proxy. Teknik tersebut efektif, tapi tidak cocok bila
diterapkan untuk aplikasi yang memiliki latency dibawah 500 milidetik atau membutuhkan
haluan keluaran (Throughput) yang tinggi. Teknologi berbasis plugin seperti Adobe Flash,
juga menyediakan beberapa level dari dukungan socket, namun sejak lama telah
dibebani oleh masalah dengan kemampuannya untuk melewati proxy dan firewall yang
mana kini telah dipecahkan oleh WebSocket.
A. WebSocket mendeteksi kehadiran proxy server dan secara otomatis membuat
sebuah tunnel untuk dapat melewati proxy tersebut. Tunnel dibuat dengan cara
mengeluarkan sebuah pernyataan HTTP CONNECT kepada proxy server, yang mana
meminta proxy server untuk membuka koneksi TCP/IP ke host dan port spesifik.
Setelah tunnel selesai dibuat, komunikasi dapat mengalir dengan leluasa melalui proxy.
Karena HTTP/S juga bekerja dengan cara yang sama, secure WebSocket melalui SSL
juga dapat menggunakan teknik HTTP CONNECT yang sama.
B. WebSocket menggunakan standard protokol RFC6455 untuk handshake dan komunikasi
antara klien dan server. Web browser seperti Google Chrome untuk Android sepenuhnya
telah mendukung RFC6455 termasuk pesan biner.
8. Beberapa contoh aplikasinya
WebSocket pada HTML5
NodeJS adalah framework Javascript yang mengimplementasikan multiple WebSocket
Servers, dengan menggunakan server-side JavaScript dengan model asynchronous
event-driven. Hal tersebut memungkinkan Node.js memiliki performance terbaik untuk
mendukung arsitektur di semua aplikasi internet.
Felix Geisendörfer menjelaskan dengan sederhana apa itu NodeJS:
Sebuah command line tool. Anda mengunduh tarball, melakukan proses compile dan
install.
Berkerja pada program Javascript dengan mengetikkan ‘node my_app.js’ di Terminal
Anda.
JS dieksekusi oleh V8 javascript engine (mesin yang membuat Google
Chrome berkerja cepat).
Node menyediakan sebuah JavaScript API untuk mengakses Network dan File System.
9. o Selain Node.js, ada beberapa pilihan Server WebSocket, antara lain:
a. jWebSocket (Java)
b. web socket Ruby (Ruby)
c. Socket IO-Node (NodeJS)
d. WebSocket-Node (Pure JS client & server implementation of the lastest draft-10)
e. Kaazing WebSocket Gateway (Java-based WebSocket Gateway)
f. mod_pyWebSocket (Python-based extension for the Apache HTTP Server)
g. Netty (Java network framework which includes WebSocket support)
h. wsproxy (WebSockets to generic TCP socket proxy)
i. websocket (Python)
j. websockify (Python, C, Node.js)
k. txWebSocket (Python/Twisted, hixie-76 handshake)
l. [plack socketio middleware] (Perl Rack/WSGI-like middleware)
Anda dapat menemukan contoh-contoh script untuk mengimplementasikan NodeJs
ataupun framework lainnya yang mendukung WebSocket, bahkan Anda bisa
memulainya dengan Native Script dari Websocket.org