SlideShare a Scribd company logo
1 of 9
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.
 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.
 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
 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.
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.
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.
 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.
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

More Related Content

What's hot

Tugas8 ku-0316-debbiemistikaweni-1412510982
Tugas8 ku-0316-debbiemistikaweni-1412510982Tugas8 ku-0316-debbiemistikaweni-1412510982
Tugas8 ku-0316-debbiemistikaweni-1412510982debbie95
 
Tugas8 rekweb ku 0316-1212511008 ismailaluwi
Tugas8 rekweb ku 0316-1212511008 ismailaluwiTugas8 rekweb ku 0316-1212511008 ismailaluwi
Tugas8 rekweb ku 0316-1212511008 ismailaluwiISMAIL ALUWI
 
Tugas 8 Rekayasa Web 0316
Tugas 8 Rekayasa Web 0316Tugas 8 Rekayasa Web 0316
Tugas 8 Rekayasa Web 0316sapatati
 
Tugas 1 rekayasa web 1412511519 - andhika desta permana
Tugas 1 rekayasa web   1412511519 - andhika desta permanaTugas 1 rekayasa web   1412511519 - andhika desta permana
Tugas 1 rekayasa web 1412511519 - andhika desta permanaAndhika Desta Permana
 
Makalah html5
Makalah html5Makalah html5
Makalah html5argud
 
Makalah internet dan html
Makalah internet dan htmlMakalah internet dan html
Makalah internet dan htmlShinta Ta'Cuco
 
Pengenalan web design dan programming
Pengenalan web design dan programmingPengenalan web design dan programming
Pengenalan web design dan programmingFrisianlllllllFlag
 

What's hot (18)

Tugas 8 rekweb
Tugas 8   rekwebTugas 8   rekweb
Tugas 8 rekweb
 
Tugas 8 rekayasa web
Tugas 8   rekayasa webTugas 8   rekayasa web
Tugas 8 rekayasa web
 
Html 5
Html 5Html 5
Html 5
 
Tugas8 ku-0316-debbiemistikaweni-1412510982
Tugas8 ku-0316-debbiemistikaweni-1412510982Tugas8 ku-0316-debbiemistikaweni-1412510982
Tugas8 ku-0316-debbiemistikaweni-1412510982
 
Tugas 8 – rekayasa web
Tugas 8 – rekayasa webTugas 8 – rekayasa web
Tugas 8 – rekayasa web
 
Tugas8 rekweb ku 0316-1212511008 ismailaluwi
Tugas8 rekweb ku 0316-1212511008 ismailaluwiTugas8 rekweb ku 0316-1212511008 ismailaluwi
Tugas8 rekweb ku 0316-1212511008 ismailaluwi
 
Tugas 8
Tugas 8Tugas 8
Tugas 8
 
PPT HTML5
PPT HTML5PPT HTML5
PPT HTML5
 
Tugas 8 Rekayasa Web 0316
Tugas 8 Rekayasa Web 0316Tugas 8 Rekayasa Web 0316
Tugas 8 Rekayasa Web 0316
 
Pbw week 01 basics
Pbw week 01   basicsPbw week 01   basics
Pbw week 01 basics
 
Makalah html 5
Makalah html 5Makalah html 5
Makalah html 5
 
Html to-blog
Html to-blogHtml to-blog
Html to-blog
 
Tugas01
Tugas01Tugas01
Tugas01
 
Tugas 1 rekayasa web 1412511519 - andhika desta permana
Tugas 1 rekayasa web   1412511519 - andhika desta permanaTugas 1 rekayasa web   1412511519 - andhika desta permana
Tugas 1 rekayasa web 1412511519 - andhika desta permana
 
Makalah html5
Makalah html5Makalah html5
Makalah html5
 
Laporan tugas besar website_PBW
Laporan tugas besar website_PBWLaporan tugas besar website_PBW
Laporan tugas besar website_PBW
 
Makalah internet dan html
Makalah internet dan htmlMakalah internet dan html
Makalah internet dan html
 
Pengenalan web design dan programming
Pengenalan web design dan programmingPengenalan web design dan programming
Pengenalan web design dan programming
 

Viewers also liked

Оптимизация технологий санаторно-курортного лечения с использованием полифено...
Оптимизация технологий санаторно-курортного лечения с использованием полифено...Оптимизация технологий санаторно-курортного лечения с использованием полифено...
Оптимизация технологий санаторно-курортного лечения с использованием полифено...Александр Ст
 
Práctica google docs
Práctica google docsPráctica google docs
Práctica google docsynunnez
 
Teen girls and technology
Teen girls and technologyTeen girls and technology
Teen girls and technologyapeck1976
 
Интеграция научных разработок для создания современных медицинских технологий...
Интеграция научных разработок для создания современных медицинских технологий...Интеграция научных разработок для создания современных медицинских технологий...
Интеграция научных разработок для создания современных медицинских технологий...Александр Ст
 
Ventajas y desventajas del uso del internet en la educación universitaria Ecu...
Ventajas y desventajas del uso del internet en la educación universitaria Ecu...Ventajas y desventajas del uso del internet en la educación universitaria Ecu...
Ventajas y desventajas del uso del internet en la educación universitaria Ecu...Genesis Bagua
 
Nutritional benefits of smoothies
Nutritional benefits of smoothiesNutritional benefits of smoothies
Nutritional benefits of smoothiesSteve Saffhill
 
Diapositivas componentes de_un_ordenador
Diapositivas componentes de_un_ordenadorDiapositivas componentes de_un_ordenador
Diapositivas componentes de_un_ordenadorlamariazoraida
 

Viewers also liked (12)

Planificacion 1
Planificacion 1Planificacion 1
Planificacion 1
 
Оптимизация технологий санаторно-курортного лечения с использованием полифено...
Оптимизация технологий санаторно-курортного лечения с использованием полифено...Оптимизация технологий санаторно-курортного лечения с использованием полифено...
Оптимизация технологий санаторно-курортного лечения с использованием полифено...
 
Práctica google docs
Práctica google docsPráctica google docs
Práctica google docs
 
Teen girls and technology
Teen girls and technologyTeen girls and technology
Teen girls and technology
 
Windows 8
Windows 8Windows 8
Windows 8
 
Интеграция научных разработок для создания современных медицинских технологий...
Интеграция научных разработок для создания современных медицинских технологий...Интеграция научных разработок для создания современных медицинских технологий...
Интеграция научных разработок для создания современных медицинских технологий...
 
Ventajas y desventajas del uso del internet en la educación universitaria Ecu...
Ventajas y desventajas del uso del internet en la educación universitaria Ecu...Ventajas y desventajas del uso del internet en la educación universitaria Ecu...
Ventajas y desventajas del uso del internet en la educación universitaria Ecu...
 
Nutritional benefits of smoothies
Nutritional benefits of smoothiesNutritional benefits of smoothies
Nutritional benefits of smoothies
 
Diapositivas componentes de_un_ordenador
Diapositivas componentes de_un_ordenadorDiapositivas componentes de_un_ordenador
Diapositivas componentes de_un_ordenador
 
Innovacion en femenino
Innovacion en femeninoInnovacion en femenino
Innovacion en femenino
 
Mesopotâmia
MesopotâmiaMesopotâmia
Mesopotâmia
 
394 (1)
394 (1)394 (1)
394 (1)
 

Similar to Tugas 8 rekayasa web 1312510231 rostarina

Similar to Tugas 8 rekayasa web 1312510231 rostarina (18)

Ppt html5
Ppt html5Ppt html5
Ppt html5
 
Html5 ppt
Html5 pptHtml5 ppt
Html5 ppt
 
Html5 ppt
Html5 pptHtml5 ppt
Html5 ppt
 
02 Teknologi Web
02 Teknologi Web02 Teknologi Web
02 Teknologi Web
 
Html 5
Html 5Html 5
Html 5
 
HTML5
HTML5HTML5
HTML5
 
Ppt html5
Ppt html5Ppt html5
Ppt html5
 
Ppt html5 rully_amrizal_1102412020
Ppt html5 rully_amrizal_1102412020Ppt html5 rully_amrizal_1102412020
Ppt html5 rully_amrizal_1102412020
 
Makalah html5
Makalah html5Makalah html5
Makalah html5
 
Makalah html5
Makalah html5Makalah html5
Makalah html5
 
Ristianawati 2114 r0800 html5
Ristianawati 2114 r0800 html5Ristianawati 2114 r0800 html5
Ristianawati 2114 r0800 html5
 
Makalah html
Makalah htmlMakalah html
Makalah html
 
Html power point
Html power pointHtml power point
Html power point
 
Choirul vbnet-01
Choirul vbnet-01Choirul vbnet-01
Choirul vbnet-01
 
Tugas 6 rekayasa web
Tugas 6 rekayasa webTugas 6 rekayasa web
Tugas 6 rekayasa web
 
storyboard pemrograman web.pptx
storyboard pemrograman web.pptxstoryboard pemrograman web.pptx
storyboard pemrograman web.pptx
 
1989249
19892491989249
1989249
 
Html5
Html5 Html5
Html5
 

More from osta92

Tugas 7 rekayasa web 1312510231 Rostarina
Tugas 7 rekayasa web 1312510231 RostarinaTugas 7 rekayasa web 1312510231 Rostarina
Tugas 7 rekayasa web 1312510231 Rostarinaosta92
 
Tugas 6 rekayasa web 1312510231 rostarina
Tugas 6 rekayasa web 1312510231 rostarinaTugas 6 rekayasa web 1312510231 rostarina
Tugas 6 rekayasa web 1312510231 rostarinaosta92
 
Tugas 5 rekayasa web
Tugas 5 rekayasa webTugas 5 rekayasa web
Tugas 5 rekayasa webosta92
 
Tugas 4 rekayasa web 1312510231 rostarina.h
Tugas 4 rekayasa web 1312510231 rostarina.hTugas 4 rekayasa web 1312510231 rostarina.h
Tugas 4 rekayasa web 1312510231 rostarina.hosta92
 
Tugas 3 rekayas web 1312510231 rostarina
Tugas 3 rekayas web 1312510231 rostarinaTugas 3 rekayas web 1312510231 rostarina
Tugas 3 rekayas web 1312510231 rostarinaosta92
 
Tugas rekayasa web 2_1312510231 _Rostarina.H._KI
Tugas rekayasa web 2_1312510231 _Rostarina.H._KITugas rekayasa web 2_1312510231 _Rostarina.H._KI
Tugas rekayasa web 2_1312510231 _Rostarina.H._KIosta92
 
Tugas Rekayasa Web 0316
Tugas Rekayasa Web 0316Tugas Rekayasa Web 0316
Tugas Rekayasa Web 0316osta92
 

More from osta92 (7)

Tugas 7 rekayasa web 1312510231 Rostarina
Tugas 7 rekayasa web 1312510231 RostarinaTugas 7 rekayasa web 1312510231 Rostarina
Tugas 7 rekayasa web 1312510231 Rostarina
 
Tugas 6 rekayasa web 1312510231 rostarina
Tugas 6 rekayasa web 1312510231 rostarinaTugas 6 rekayasa web 1312510231 rostarina
Tugas 6 rekayasa web 1312510231 rostarina
 
Tugas 5 rekayasa web
Tugas 5 rekayasa webTugas 5 rekayasa web
Tugas 5 rekayasa web
 
Tugas 4 rekayasa web 1312510231 rostarina.h
Tugas 4 rekayasa web 1312510231 rostarina.hTugas 4 rekayasa web 1312510231 rostarina.h
Tugas 4 rekayasa web 1312510231 rostarina.h
 
Tugas 3 rekayas web 1312510231 rostarina
Tugas 3 rekayas web 1312510231 rostarinaTugas 3 rekayas web 1312510231 rostarina
Tugas 3 rekayas web 1312510231 rostarina
 
Tugas rekayasa web 2_1312510231 _Rostarina.H._KI
Tugas rekayasa web 2_1312510231 _Rostarina.H._KITugas rekayasa web 2_1312510231 _Rostarina.H._KI
Tugas rekayasa web 2_1312510231 _Rostarina.H._KI
 
Tugas Rekayasa Web 0316
Tugas Rekayasa Web 0316Tugas Rekayasa Web 0316
Tugas Rekayasa Web 0316
 

Recently uploaded

Modul 1.2.a.8 Koneksi antar materi 1.2.pdf
Modul 1.2.a.8 Koneksi antar materi 1.2.pdfModul 1.2.a.8 Koneksi antar materi 1.2.pdf
Modul 1.2.a.8 Koneksi antar materi 1.2.pdfSitiJulaeha820399
 
1.2.a.6. Demonstrasi Konstektual - Modul 1.2 (Shinta Novianti - CGP A10).pdf
1.2.a.6. Demonstrasi Konstektual - Modul 1.2 (Shinta Novianti - CGP A10).pdf1.2.a.6. Demonstrasi Konstektual - Modul 1.2 (Shinta Novianti - CGP A10).pdf
1.2.a.6. Demonstrasi Konstektual - Modul 1.2 (Shinta Novianti - CGP A10).pdfShintaNovianti1
 
PPT_AKUNTANSI_PAJAK_ATAS_ASET_TETAP.pptx
PPT_AKUNTANSI_PAJAK_ATAS_ASET_TETAP.pptxPPT_AKUNTANSI_PAJAK_ATAS_ASET_TETAP.pptx
PPT_AKUNTANSI_PAJAK_ATAS_ASET_TETAP.pptxalalfardilah
 
PELAKSANAAN + Link2 Materi TRAINING "Effective SUPERVISORY & LEADERSHIP Sk...
PELAKSANAAN  + Link2 Materi TRAINING "Effective  SUPERVISORY &  LEADERSHIP Sk...PELAKSANAAN  + Link2 Materi TRAINING "Effective  SUPERVISORY &  LEADERSHIP Sk...
PELAKSANAAN + Link2 Materi TRAINING "Effective SUPERVISORY & LEADERSHIP Sk...Kanaidi ken
 
Jurnal Dwi mingguan modul 1.2-gurupenggerak.pptx
Jurnal Dwi mingguan modul 1.2-gurupenggerak.pptxJurnal Dwi mingguan modul 1.2-gurupenggerak.pptx
Jurnal Dwi mingguan modul 1.2-gurupenggerak.pptxBambang440423
 
aku-dan-kebutuhanku-Kelas 4 SD Mapel IPAS
aku-dan-kebutuhanku-Kelas 4 SD Mapel IPASaku-dan-kebutuhanku-Kelas 4 SD Mapel IPAS
aku-dan-kebutuhanku-Kelas 4 SD Mapel IPASreskosatrio1
 
Edukasi Haji 2023 pembinaan jemaah hajii
Edukasi Haji 2023 pembinaan jemaah hajiiEdukasi Haji 2023 pembinaan jemaah hajii
Edukasi Haji 2023 pembinaan jemaah hajiiIntanHanifah4
 
LAPORAN PKP KESELURUHAN BAB 1-5 NURUL HUSNA.pdf
LAPORAN PKP KESELURUHAN BAB 1-5 NURUL HUSNA.pdfLAPORAN PKP KESELURUHAN BAB 1-5 NURUL HUSNA.pdf
LAPORAN PKP KESELURUHAN BAB 1-5 NURUL HUSNA.pdfChrodtianTian
 
BAHAN SOSIALISASI PPDB SMA-SMK NEGERI DISDIKSU TP. 2024-2025 REVISI.pptx
BAHAN SOSIALISASI PPDB SMA-SMK NEGERI DISDIKSU TP. 2024-2025 REVISI.pptxBAHAN SOSIALISASI PPDB SMA-SMK NEGERI DISDIKSU TP. 2024-2025 REVISI.pptx
BAHAN SOSIALISASI PPDB SMA-SMK NEGERI DISDIKSU TP. 2024-2025 REVISI.pptxJamhuriIshak
 
IPA Kelas 9 BAB 10 - www.ilmuguru.org.pptx
IPA Kelas 9 BAB 10 - www.ilmuguru.org.pptxIPA Kelas 9 BAB 10 - www.ilmuguru.org.pptx
IPA Kelas 9 BAB 10 - www.ilmuguru.org.pptxErikaPuspita10
 
AKSI NYATA MODUL 1.2-1 untuk pendidikan guru penggerak.pptx
AKSI NYATA MODUL 1.2-1 untuk pendidikan guru penggerak.pptxAKSI NYATA MODUL 1.2-1 untuk pendidikan guru penggerak.pptx
AKSI NYATA MODUL 1.2-1 untuk pendidikan guru penggerak.pptxWirionSembiring2
 
Materi Pertemuan Materi Pertemuan 7.pptx
Materi Pertemuan Materi Pertemuan 7.pptxMateri Pertemuan Materi Pertemuan 7.pptx
Materi Pertemuan Materi Pertemuan 7.pptxRezaWahyuni6
 
Panduan Substansi_ Pengelolaan Kinerja Kepala Sekolah Tahap Pelaksanaan.pptx
Panduan Substansi_ Pengelolaan Kinerja Kepala Sekolah Tahap Pelaksanaan.pptxPanduan Substansi_ Pengelolaan Kinerja Kepala Sekolah Tahap Pelaksanaan.pptx
Panduan Substansi_ Pengelolaan Kinerja Kepala Sekolah Tahap Pelaksanaan.pptxsudianaade137
 
DESAIN MEDIA PEMBELAJARAN BAHASA INDONESIA BERBASIS DIGITAL.pptx
DESAIN MEDIA PEMBELAJARAN BAHASA INDONESIA BERBASIS DIGITAL.pptxDESAIN MEDIA PEMBELAJARAN BAHASA INDONESIA BERBASIS DIGITAL.pptx
DESAIN MEDIA PEMBELAJARAN BAHASA INDONESIA BERBASIS DIGITAL.pptxFuzaAnggriana
 
Laporan Guru Piket untuk Pengisian RHK Guru Pengelolaan KInerja Guru di PMM
Laporan Guru Piket untuk Pengisian RHK Guru Pengelolaan KInerja Guru di PMMLaporan Guru Piket untuk Pengisian RHK Guru Pengelolaan KInerja Guru di PMM
Laporan Guru Piket untuk Pengisian RHK Guru Pengelolaan KInerja Guru di PMMmulyadia43
 
Karakteristik Negara Brazil, Geografi Regional Dunia
Karakteristik Negara Brazil, Geografi Regional DuniaKarakteristik Negara Brazil, Geografi Regional Dunia
Karakteristik Negara Brazil, Geografi Regional DuniaNadia Putri Ayu
 
04-Gemelli.- kehamilan ganda- duo atau triplet
04-Gemelli.- kehamilan ganda- duo atau triplet04-Gemelli.- kehamilan ganda- duo atau triplet
04-Gemelli.- kehamilan ganda- duo atau tripletMelianaJayasaputra
 
Kesebangunan Segitiga matematika kelas 7 kurikulum merdeka.pptx
Kesebangunan Segitiga matematika kelas 7 kurikulum merdeka.pptxKesebangunan Segitiga matematika kelas 7 kurikulum merdeka.pptx
Kesebangunan Segitiga matematika kelas 7 kurikulum merdeka.pptxDwiYuniarti14
 
Topik 1 - Pengenalan Penghayatan Etika dan Peradaban Acuan Malaysia.pptx
Topik 1 - Pengenalan Penghayatan Etika dan Peradaban Acuan Malaysia.pptxTopik 1 - Pengenalan Penghayatan Etika dan Peradaban Acuan Malaysia.pptx
Topik 1 - Pengenalan Penghayatan Etika dan Peradaban Acuan Malaysia.pptxsyafnasir
 
HARMONI DALAM EKOSISTEM KELAS V SEKOLAH DASAR.pdf
HARMONI DALAM EKOSISTEM KELAS V SEKOLAH DASAR.pdfHARMONI DALAM EKOSISTEM KELAS V SEKOLAH DASAR.pdf
HARMONI DALAM EKOSISTEM KELAS V SEKOLAH DASAR.pdfkustiyantidew94
 

Recently uploaded (20)

Modul 1.2.a.8 Koneksi antar materi 1.2.pdf
Modul 1.2.a.8 Koneksi antar materi 1.2.pdfModul 1.2.a.8 Koneksi antar materi 1.2.pdf
Modul 1.2.a.8 Koneksi antar materi 1.2.pdf
 
1.2.a.6. Demonstrasi Konstektual - Modul 1.2 (Shinta Novianti - CGP A10).pdf
1.2.a.6. Demonstrasi Konstektual - Modul 1.2 (Shinta Novianti - CGP A10).pdf1.2.a.6. Demonstrasi Konstektual - Modul 1.2 (Shinta Novianti - CGP A10).pdf
1.2.a.6. Demonstrasi Konstektual - Modul 1.2 (Shinta Novianti - CGP A10).pdf
 
PPT_AKUNTANSI_PAJAK_ATAS_ASET_TETAP.pptx
PPT_AKUNTANSI_PAJAK_ATAS_ASET_TETAP.pptxPPT_AKUNTANSI_PAJAK_ATAS_ASET_TETAP.pptx
PPT_AKUNTANSI_PAJAK_ATAS_ASET_TETAP.pptx
 
PELAKSANAAN + Link2 Materi TRAINING "Effective SUPERVISORY & LEADERSHIP Sk...
PELAKSANAAN  + Link2 Materi TRAINING "Effective  SUPERVISORY &  LEADERSHIP Sk...PELAKSANAAN  + Link2 Materi TRAINING "Effective  SUPERVISORY &  LEADERSHIP Sk...
PELAKSANAAN + Link2 Materi TRAINING "Effective SUPERVISORY & LEADERSHIP Sk...
 
Jurnal Dwi mingguan modul 1.2-gurupenggerak.pptx
Jurnal Dwi mingguan modul 1.2-gurupenggerak.pptxJurnal Dwi mingguan modul 1.2-gurupenggerak.pptx
Jurnal Dwi mingguan modul 1.2-gurupenggerak.pptx
 
aku-dan-kebutuhanku-Kelas 4 SD Mapel IPAS
aku-dan-kebutuhanku-Kelas 4 SD Mapel IPASaku-dan-kebutuhanku-Kelas 4 SD Mapel IPAS
aku-dan-kebutuhanku-Kelas 4 SD Mapel IPAS
 
Edukasi Haji 2023 pembinaan jemaah hajii
Edukasi Haji 2023 pembinaan jemaah hajiiEdukasi Haji 2023 pembinaan jemaah hajii
Edukasi Haji 2023 pembinaan jemaah hajii
 
LAPORAN PKP KESELURUHAN BAB 1-5 NURUL HUSNA.pdf
LAPORAN PKP KESELURUHAN BAB 1-5 NURUL HUSNA.pdfLAPORAN PKP KESELURUHAN BAB 1-5 NURUL HUSNA.pdf
LAPORAN PKP KESELURUHAN BAB 1-5 NURUL HUSNA.pdf
 
BAHAN SOSIALISASI PPDB SMA-SMK NEGERI DISDIKSU TP. 2024-2025 REVISI.pptx
BAHAN SOSIALISASI PPDB SMA-SMK NEGERI DISDIKSU TP. 2024-2025 REVISI.pptxBAHAN SOSIALISASI PPDB SMA-SMK NEGERI DISDIKSU TP. 2024-2025 REVISI.pptx
BAHAN SOSIALISASI PPDB SMA-SMK NEGERI DISDIKSU TP. 2024-2025 REVISI.pptx
 
IPA Kelas 9 BAB 10 - www.ilmuguru.org.pptx
IPA Kelas 9 BAB 10 - www.ilmuguru.org.pptxIPA Kelas 9 BAB 10 - www.ilmuguru.org.pptx
IPA Kelas 9 BAB 10 - www.ilmuguru.org.pptx
 
AKSI NYATA MODUL 1.2-1 untuk pendidikan guru penggerak.pptx
AKSI NYATA MODUL 1.2-1 untuk pendidikan guru penggerak.pptxAKSI NYATA MODUL 1.2-1 untuk pendidikan guru penggerak.pptx
AKSI NYATA MODUL 1.2-1 untuk pendidikan guru penggerak.pptx
 
Materi Pertemuan Materi Pertemuan 7.pptx
Materi Pertemuan Materi Pertemuan 7.pptxMateri Pertemuan Materi Pertemuan 7.pptx
Materi Pertemuan Materi Pertemuan 7.pptx
 
Panduan Substansi_ Pengelolaan Kinerja Kepala Sekolah Tahap Pelaksanaan.pptx
Panduan Substansi_ Pengelolaan Kinerja Kepala Sekolah Tahap Pelaksanaan.pptxPanduan Substansi_ Pengelolaan Kinerja Kepala Sekolah Tahap Pelaksanaan.pptx
Panduan Substansi_ Pengelolaan Kinerja Kepala Sekolah Tahap Pelaksanaan.pptx
 
DESAIN MEDIA PEMBELAJARAN BAHASA INDONESIA BERBASIS DIGITAL.pptx
DESAIN MEDIA PEMBELAJARAN BAHASA INDONESIA BERBASIS DIGITAL.pptxDESAIN MEDIA PEMBELAJARAN BAHASA INDONESIA BERBASIS DIGITAL.pptx
DESAIN MEDIA PEMBELAJARAN BAHASA INDONESIA BERBASIS DIGITAL.pptx
 
Laporan Guru Piket untuk Pengisian RHK Guru Pengelolaan KInerja Guru di PMM
Laporan Guru Piket untuk Pengisian RHK Guru Pengelolaan KInerja Guru di PMMLaporan Guru Piket untuk Pengisian RHK Guru Pengelolaan KInerja Guru di PMM
Laporan Guru Piket untuk Pengisian RHK Guru Pengelolaan KInerja Guru di PMM
 
Karakteristik Negara Brazil, Geografi Regional Dunia
Karakteristik Negara Brazil, Geografi Regional DuniaKarakteristik Negara Brazil, Geografi Regional Dunia
Karakteristik Negara Brazil, Geografi Regional Dunia
 
04-Gemelli.- kehamilan ganda- duo atau triplet
04-Gemelli.- kehamilan ganda- duo atau triplet04-Gemelli.- kehamilan ganda- duo atau triplet
04-Gemelli.- kehamilan ganda- duo atau triplet
 
Kesebangunan Segitiga matematika kelas 7 kurikulum merdeka.pptx
Kesebangunan Segitiga matematika kelas 7 kurikulum merdeka.pptxKesebangunan Segitiga matematika kelas 7 kurikulum merdeka.pptx
Kesebangunan Segitiga matematika kelas 7 kurikulum merdeka.pptx
 
Topik 1 - Pengenalan Penghayatan Etika dan Peradaban Acuan Malaysia.pptx
Topik 1 - Pengenalan Penghayatan Etika dan Peradaban Acuan Malaysia.pptxTopik 1 - Pengenalan Penghayatan Etika dan Peradaban Acuan Malaysia.pptx
Topik 1 - Pengenalan Penghayatan Etika dan Peradaban Acuan Malaysia.pptx
 
HARMONI DALAM EKOSISTEM KELAS V SEKOLAH DASAR.pdf
HARMONI DALAM EKOSISTEM KELAS V SEKOLAH DASAR.pdfHARMONI DALAM EKOSISTEM KELAS V SEKOLAH DASAR.pdf
HARMONI DALAM EKOSISTEM KELAS V SEKOLAH DASAR.pdf
 

Tugas 8 rekayasa web 1312510231 rostarina

  • 1.
  • 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