makalah html5
Post on 16-May-2015
1.383 Views
Preview:
TRANSCRIPT
MAKALAH
HTML5
KURIKULUM DAN TEKNOLOGI PENDIDIKAN
Oleh: MASRUHIL
NIM: 1102412037
UNIVERSITAS NEGERI SEMARANG
TAHUN 2013
BAB 1
PENDAHULUAN
A. Latar Belakang Masalah
Kebutuhan akan informasi di dunia maya membuat para developer website
berlomba-lomba menyajikan berbagai macam layanan sehingga para pengguna
akan betah berkunjung ke dalam websitenya. Dari masa-masa ke masa teknologi
website mengalami perkembangan yang begitu pesatnya dan kini bahkan
memberalihkan aplikasi dektop yang selama ini kita kenal menjadi aplikasi
berbasis web.
Banyak aplikasi yang selama ini hanya sebatas akses di komputer dan harus
diinstal terlebih dahulu, kini aplikasi website memberikan ruang pada kita untuk
mencicipi aplikasi misalnya game online, sehingga tidak perlu lagi yang namanya
instalasi kita cuma butuh yang namanya koneksi internet.
B. Rumusan Masalah
Berdasarkan judul Web Development Admin maka rumusan masalah yang dapat
saya temukan adalah :
1. Apa yang di maksud dengan website ?
2. Unsur unsur yang ada dalam website ?
3. Bagaimana Pemeliharaan website?
4. Perpanjangan masa sewa domain name dan web hosting.
5. Apa itu Web Depeloper?
6. Html 5 Menjadi Solusi Para Web Development
7. Apa yang dimaksud Cms Based Web Developmet?
8. Web administrator
9. bagaimana Seri HTML5 Untuk Aplikasi Mobile ?
10. bagaimana untuk Membangun Area Kerja HTML5 Untuk Aplikasi Mobile ?
BAB II
ISI
1.1. PENGERTIAN WEBSITE ATAU SITUS
Website atau situs dapat diartikan sebagai kumpulan halaman yang
menampilkan informasi data teks, data gambar diam atau gerak, data animasi,
suara, video dan atau gabungan dari semuanya, baik yang bersifat statis maupun
dinamis yang membentuk satu rangkaian bangunan yang saling terkait dimana
masing-masing dihubungkan dengan jaringan-jaringan halaman (hyperlink).
Bersifat statis apabila isi informasi website tetap, jarang berubah, dan isi
informasinya searah hanya dari pemilik website. Bersifat dinamis apabila isi
informasi website selalu berubah-ubah, dan isi informasinya interaktif dua arah
berasal dari pemilik serta pengguna website. Contoh website statis adalah berisi
profil perusahaan, sedangkan website dinamis adalah seperti Friendster, Multiply,
dll. Dalam sisi pengembangannya, website statis hanya bisa diupdate oleh
pemiliknya saja, sedangkan website dinamis bisa diupdate oleh pengguna maupun
pemilik.
1.2. UNSUR-UNSUR DALAM PENYEDIAAN WEBSITE ATAU SITUS
Untuk menyediakan sebuah website, maka harus tersedia unsur-unsur
penunjangnya, adalah sebagai berikut:
1. Nama domain ( Domain name/URL – Uniform Resource Locator )
Nama domain atau biasa disebut dengan Domain Name atau URL adalah
alamat unik di dunia internet yang digunakan untuk mengidentifikasi sebuah
website, atau dengan kata lain domain name adalah alamat yang digunakan untuk
menemukan sebuah website pada dunia internet. Contoh :http://www.bsi.ac.id .
Nama domain diperjual belikan secara bebas di internet dengan status sewa
tahunan. Setelah Nama Domain itu terbeli di salah satu penyedia jasa pendaftaran,
maka pengguna disediakan sebuah kontrol panel untuk administrasinya. Jika
pengguna lupa/tidak memperpanjang masa sewanya, maka nama domain itu akan
di lepas lagi ketersediaannya untuk umum. Nama domain sendiri mempunyai
identifikasi ekstensi/akhiran sesuai dengan kepentingan dan lokasi keberadaan
website tersebut. Contoh nama domain ber-ekstensi internasional adalah com, net,
org, info, biz, name, ws. Contoh nama domain ber-ekstensi lokasi Negara
Indonesia adalah :
- .co.id : Untuk Badan Usaha yang mempunyai badan hukum sah
- .ac.id : Untuk Lembaga Pendidikan
- .go.id : Khusus untuk Lembaga Pemerintahan Republik Indonesia
- .mil.id : Khusus untuk Lembaga Militer Republik Indonesia
- .or.id : Untuk segala macam organisasi yand tidak termasuk dalam kategori
“ac.id”,”co.id”,”go.id”,”mil.id” dan lain lain
- .war.net.id : untuk industri warung internet di Indonesia
- .sch.id : khusus untuk Lembaga Pendidikan yang menyelenggarakan pendidikan
seperti
SD, SMP dan atau SMU
- .web.id : Ditujukan bagi badan usaha, organisasi ataupun perseorangan yang
melakukan
kegiatannya di World Wide Web.
2. Rumah tempat website (Web hosting)
Web Hosting dapat diartikan sebagai ruangan yang terdapat dalam harddisk
tempat menyimpan berbagai data, file-file, gambar, video, data email, statistik,
database dan lain sebagainya yang akan ditampilkan di website. Besarnya data
yang bisa dimasukkan tergantung dari besarnya web hosting yang disewa/dipunyai,
semakin besar web hosting semakin besar pula data yang dapat dimasukkan dan
ditampilkan dalam website.
Web Hosting juga diperoleh dengan menyewa. Pengguna akan memperoleh
kontrol panel yang terproteksi dengan username dan password untuk administrasi
websitenya. Besarnya hosting ditentukan ruangan harddisk dengan ukuran MB
(Mega Byte) atau GB (Giga Byte). Lama penyewaan web hosting rata-rata
dihitung per tahun. Penyewaan hosting dilakukan dari perusahaan-perusahaan
penyewa web hosting yang banyak dijumpai baik di Indonesia maupun Luar
Negeri. Lokasi peletakan pusat data (datacenter) web hosting bermacam-macam.
Ada yang di Jakarta, Singapore, Inggris, Amerika, dll dengan harga sewa
bervariasi.
3. Bahasa Program (Scripts Program)
Adalah bahasa yang digunakan untuk menerjemahkan setiap perintah dalam
website yang pada saat diakses. Jenis bahasa program sangat menentukan statis,
dinamis atau interaktifnya sebuah website. Semakin banyak ragam bahasa program
yang digunakan maka akan terlihat website semakin dinamis, dan interaktif serta
terlihat bagus.Beragam bahasa program saat ini telah hadir untuk mendukung
kualitas website. Jenis jenis bahasa program yang banyak dipakai para desainer
website antara lain HTML, ASP, PHP, JSP, Java Scripts, Java applets, XML, Ajax
dsb. Bahasa dasar yang dipakai setiap situs adalah HTML sedangkan PHP, ASP,
JSP dan lainnya merupakan bahasa pendukung yang bertindak sebagai pengatur
dinamis, dan interaktifnya situs. Bahasa program ASP, PHP, JSP atau lainnya bisa
dibuat sendiri. Bahasa program ini biasanya digunakan untuk membangun portal
berita, artikel, forum diskusi, buku tamu, anggota organisasi, email, mailing list
dan lain sebagainya yang memerlukan update setiap saat.
4. Desain website
Setelah melakukan penyewaan domain name dan web hosting serta penguasaan
bahasa program (scripts program), unsur website yang penting dan utama adalah
desain. Desain website menentukan kualitas dan keindahan sebuah website. Desain
sangat berpengaruh kepada penilaian pengunjung akan bagus tidaknya sebuah
website. Untuk membuat website biasanya dapat dilakukan sendiri atau menyewa
jasa website designer. Saat ini sangat banyak jasa web designer, terutama di kota-
kota besar. Perlu diketahui bahwa kualitas situs sangat ditentukan oleh kualitas
designer. Semakin banyak penguasaan web designer tentang beragam
program/software pendukung pembuatan situs maka akan dihasilkan situs yang
semakin berkualitas, demikian pula sebaliknya. Jasa web designer ini yang
umumnya memerlukan biaya yang tertinggi dari seluruh biaya pembangunan situs
dan semuanya itu tergantung kualitas designer. Program-program desain website
salah satunya adalah Macromedia Firework, Adobe Photoshop, Adobe
Dreamweaver, Microsoft Frontpage, dll
5. Program transfer data ke pusat data
Para web designer mengerjakan website dikomputernya sendiri. Berbagai
bahasa program, data informasi teks, gambar, video, dan suara telah menjadi file-
file pendukung adanya website. File tersebut bisa dibuka menggunakan program
penjelajah (browser) sehingga terlihatlah sebuah website utuh di dalam komputer
sendiri (offline). Tetapi file-file tersebut perlu untuk diletakkan dirumah hosting
versi online agar terakses ke seluruh dunia. Pengguna akan diberikan akses FTP
(File Transfer Protocol) setelah memesan sebuah web hosting untuk memindahkan
file-file website ke pusat data web hosting. Untuk dapat menggunakan FTP
diperlukan sebuah program FTP, misalnya WS FTP, Smart FTP, Cute FTP, dll.
Program FTP ini banyak ditemui di internet dengan status penggunaan gratis
maupun harus membayar. Para web designer pun dapat menggunakan fasilitas FTP
yang terintegrasi dengan program pembuat website, misal Adobe Dreamweaver.
6. Publikasi website
Keberadaan website tidak ada gunanya dibangun tanpa dikunjungi atau dikenal
oleh masyarakat atau pengunjung internet. Karena efektif tidaknya situs sangat
tergantung dari besarnya pengunjung dan komentar yang masuk. Untuk
mengenalkan situs kepada masyarakat memerlukan apa yang disebut publikasi atau
promosi. Publikasi situs di masyarakat dapat dilakukan dengan berbagai cara
seperti dengan pamlet-pamlet, selebaran, baliho, kartu nama dan lain sebagainya
tapi cara ini bisa dikatakan masih kurang efektif dan sangat terbatas. Cara yang
biasanya dilakukan dan paling efektif dengan tak terbatas ruang atau waktu adalah
publikasi langsung di internet melalui search engine-search engine (mesin pencari,
spt : Yahoo, Google, MSN, Search Indonesia, dsb)
Cara publikasi di search engine ada yang gratis dan ada pula yang membayar.
Yang gratis biasanya terbatas dan cukup lama untuk bisa masuk dan dikenali di
search engine terkenal seperti Yahoo atau Google. Cara efektif publikasi adalah
dengan membayar, walaupun harus sedikit mengeluarkan akan tetapi situs cepat
masuk ke search engine dan dikenal oleh pengunjung.
1.3. PEMELIHARAAN WEBSITE.
Untuk mendukung kelanjutan dari situs diperlukan pemeliharaan setiap waktu
sesuai yang diinginkan seperti penambahan informasi, berita, artikel, link, gambar
atau lain sebagainya. Tanpa pemeliharaan yang baik situs akan terkesan
membosankan atau monoton juga akan segera ditinggal pengunjung. Pemeliharaan
situs dapat dilakukan per periode tertentu seperti tiap hari, tiap minggu atau tiap
bulan sekali secara rutin atau secara periodik saja tergantung kebutuhan (tidak
rutin). Pemeliharaan rutin biasanya dipakai oleh situs-situs berita, penyedia artikel,
organisasi atau lembaga pemerintah. Sedangkan pemeliharaan periodik bisanya
untuk situs-situs pribadi, penjualan/e-commerce, dan lain sebagainya.
1.4. PERPANJANGAN MASA SEWA DOMAIN NAME DAN WEB
HOSTING.
Perlu dipahami bahwa domain name dan web hosting berstatus sewa. Selama
kedua hal itu dibayarkan masa sewa perpanjangannya, maka Anda berhak untuk
memilikinya dan mempergunakannya. Banyak terjadi kasus kelupaan dalam
memperpanjang masa sewanya, atau sulit untuk menghubungi pihak ketiga (web
designer) sebagai perantara pendaftaran awal, maka akan berakibat fatal. Anda
akan kehilangan domain name sebagai identitas dalam dunia internet. Pastikan
Anda mengingat untuk memperpanjang masa sewanya. Arti penting domain name
perlu Anda pahami.
1.5.WEB DEVELOPER
Web developer adalah seseorang yang menciptakan aplikasi berbasis web
dengan menggunakan bahasa pemrograman. Pada dasarnya, web developer
membuat berbagai hal “terjadi” pada sebuah website. Peran web developer adalah
sebagai penghubung dari semua sumber daya yang akan digunakan pada sebuah
website, mulai dari pemanggilan database, membuat halaman website yang
dinamis, hingga mengatur cara pengunjung untuk berinteraksi dengan elemen-
elemen dari website tersebut.
Seorang web developer yang handal akan terbiasa dengan bahasa pemrograman,
baik itu di sisi server ( server-side scripting ) maupun disisi client ( client-side
scripting ). Dan jangan lupa dengan aspek database yang akan digunakan.
Berikut adalah bagian aplikasi yang harus dipahami oleh seorang web developer :
Client-side: JavaScript.
Server side: ASP, ASP.NET, Java, Perl, PHP, Python, Ruby, dsb.
Databases: MySQL, Oracle, dsb
Aspek tampilan menjadi sisi yang agak “terpinggirkan” oleh web developer.
Pada umumnya setelah scripting dari aplikasi web telah selesai dibuat, web
developer akan menyerahkan pekerjaannya kepada web designer untuk
menciptakan tampilan yang baik.
1.6. HTML 5 MENJADI SOLUSI PARA WEB DEVELOPMENT
Tidak lepas yang namanya script/tag HTML (Hypertext Markup Language).
Bagi para web development mungkin sudah familiar yang namanya HTML ini
karena untuk membangun website yang dinamis para web development harus
memahami konsep- konsep dasar dari HTML. Banyak orang bilang HTML itu
bahasa yang mudah sederhana dan struktur dan sering pula di anggap remeh karena
kemampuan HTML itu sendiri, jauh di bawah Java Script (client side) apalagi di
bantingkan dengan script server side seperti PHP, ASP, ASPX, dan bahasa lain
sebagainya.
Mengabaikan pemahaman tentang membanding-bandingkan HTML dengan
yang lain, perlu di ketahui HTML merupakan dokument standar yang di akses
dengan menggunakan HTTP (Hypertext Tranfer Protocol) sebagai protokol yang
berfungsi mengirimkan data dari web server ke web broser pada sisi klient.
Awal pertama di perkenalkan yang namanya HTML ini sekita tahun 1991 yang
hanya mencakup 22 elemen dan kemudian di lanjutkan dengan HTML +, maka di
dalam perkembangan HTML tidak di kenal yang namanya HTML1. Dan pada
tahun 1995 barulah kemudian di perkenalkan yang namanya HTML 2.0.
Pada perkembangannya HTML 2.0 kemudian oleh W3C (Word Wide Web
Consortium) sebuah organisasi menentukan standar internasional word Wide Web
pada tahun 1997 memperkenalkan HTML 3.2 yang memiliki banyak fitur
tambahan seperti table, applet, superscript, sub script dan marque.
Pada tahun 1997 akhir, baru kemudian HTML 4.0 secara resmi di umumkan
dan kemudian pada tahun 1999 dilanjutkan dengan HML 4.1. Pada perkembangan
sekarang mungkin sebagian orang masih merasakan yang namanya HTML 4
adalah kemampuan design web yaitu dengan menggunakan css (Cascading Style
Sheets) . CSS ini memberikan kemuduhan dalam memberikan tampilan yang
terbaik pada browser-browser Anda.
Pada tahun Januari 2008, HTML 5 diumkan sebagai draft, walaupun belum di
rekomentasikan secara resmi, beberapa sfesifikasi HTML 5 mulai di dukung oleh
berbagai macam layout dan engine. Pada perkembangannya HTML 5 ini ada
beberapa penambahan “tag” baru yang hanya dapat dimengerti oleh browser-
browser baru. Tag tersebut diantaranya “section, article, footer, audio, video,
progress, nav, meter, time, aside, canvas serta datagrid“.
Tag-tag tersebut hanya dikenali oleh browser-browser keluaran terbaru, sebagai
misal Firefox 3.5, Opera 9.6, Chrome, Safari, IE 8. Nah bagaimana dengan
browser- browser lama seperti IE6, Firefox 1.5. Maaf browser-browser tersebut
belum mendukung tag-tag baru di HTML 5.
A. Kelebihan Dan Kekurangan HTML 5
Beberapa kelebihan yang dijanjikan pada HTML 5:
Dapat ditulis dalam sintaks HTML (dengan tipe media text/html) dan XML.
Integrasi yang lebih baik dengan aplikasi web dan pemrosesannya.
Integrasi (’inline’) MathML dan SVG dengan doctype yang lebih sederhana.
Penulisan kode yang lebih efisien.
Dapat dimengerti oleh peramban lawas (backwards compatible). Sehingga
istilah ‘deprecated’ tidak akan diperlukan lagi.
Yang masih diperdebatkan dalam pengembangan HTML 5:
Makna semantik beberapa elemen presentasioal.
Fitur aksesibilitasnya. Seperti atribut alt dan summary
B. Teknologi yang dipakai HTML5
API (Aplication Programming Interface) merupakan teknologi yang akan di usung
oleh
HTML5, berikut ini adalah batasan-batasannya :
1. Offline Data Storage
Memungkinkan kita bisa mengakses data lama di broser dalam keadaan offline.
Contoh
offline data seperti kita membaca arsip e-mail pada program Outlook atau
Thunderbird.
2. Drag and Drop
Drag and Drop ini kita dapat dengan memudahkan mendrag atau mendrop
misalnya text,
hyperlink, bahkan file di aplikasi dekstop sekalipun.
3. Geolocation
Aplikasi ini memungkinkan kita untuk untuk mengetahui lokasi geografis,
sumber informasi di ambil dari GPS (Global Position System).Masih terdapat
banyak API lainya dan terus di kembangkan. Dalam implementasinya, Anda akan
memerlukan pemrogramanan Java Script untuk menjembatani penggunaan API ini.
C. Elemen Baru di HTML 5
Demi mewujudkan struktur halaman web yang lebih baik semantik dan
aksesibilitasnya, dikenalkanlah beberapa elemen baru, diantaranya:
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.
1. Atribut baru di HTML 5
Dikenalkan pula beberapa atribut baru, seperti:
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.
2. Perubahan makna elemen
Ada beberapa elemen yang berubah makna, diantaranya:
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.
3. Elemen dan atribut yang tidak digunakan
Berikut ini beberapa elemen dan atribut yang tidak lagi muncul pada HTML 5:
center,
font,
strike, u, big,
frame, frameset, noframes,
acronym,
longdesc,
scope pada td,
dan sebagainya.
Sulit di pungkiri kehadiran HTML 5 akan menggerakkan banyak hal, browser-
browser beradaptasi untuk mendukungnnya, berbagai CMS mengarahkan
developementnya untuk ikut mengiplementasikan yang pada akhirnya pera
pemakai internet di paksa untuk menggeser kebiasaan lama menjadi kebiasaan tren
baru. Tetapi pada prinsipnya yang berubah hanyalah tool dan caranya. Semoga
penjelasan mengenai HTML 5 ini merealisasikan pengetahuan Anda untuk
memejukan web development ke depan.
1.7.CMS BASED WEB DEVELOPMET
Dalam dunia maya pada umumnya teknik ini sering disebut CMS (Content
Management System).
CMS merupakan mesin atau aplikasi di sisi server web. CMS dibuat sangat praktis
dan memudahkan client dalam penggunaan, pengelolaan, dan pengaturan isi atau
content website. CMS in sudah dilengkapi dengan Database dan beberapa
aplikasiyang bisa dipilih untuk di integrasikan ke dalam situs anda.
Dengan CMS client tidak perlu repot-repot membuat kode-kode pemrograman
yang rumit. Client dimanjakan dengan segala kemudahan yang disajikan oleh
CMS. Administrator/Webmaster hanya perlu pengetahuan tentang Internet, dengan
mengikuti panduan yang akan diberikan sebelum website diserah-terimakan maka
akan sangat mudah untuk melakukan update (add, edit, delete) content website.
Dengan mimilih salah satu paket yang kami pakai ini, anda tidak perlu
membayar dengan harga yang mahal untuk mendapatkan dan mempunyai sebuah
situs. Sangat murah. iya.. karena metode ini menjadi salah satu solusi dalam
pembuatan website.Kami sangat berpengalaman dalam melakukan kastemis CMS.
Selama kurang lebih 3 tahun kami sudah memakai CMS sebagai backend dari
setiap website yang kami bangun Kami memiliki pemahanan dan kemampuan
untuk melakukan penyesuaian dengan hampir segala kebutuhan client akan
websitenya, dibantu oleh seluruh komunitas pengembang dari masing-masing
Open Source CMS.
1.8.WEB ADMINISTRATOR
Web Asministrator adalah orang yang bertanggung jawab atas jalannya sebuah
website
dan bertugas untuk mengawasi perkembangan website
1.9. Seri HTML5 Untuk Aplikasi Mobile
Sekian lama saya tidak lagi menggarap tulisan untuk tutorial programming.
Yah, memang karena secara tidak sengaja ada beberapa permasalahan internal dan
eksternal. Salah satunya adalah musibah yang menimpa server situs ini. Sewaktu
itu ada permasalahan di server dan berita buruknya saya tidak membackup update
situs terbaru
Oke, lupakan. Saat ini saya memang sedang fokus ke sebuah teknologi yang
bernama HTML5 for Mobile Applications. Tidak muluk-muluk dan terlalu sulit
sebenarnya. Ini merupakan seri pertama dari tutorial step-by-step saya. Jika
pembaca sudah pernah atau bahkan berkecimpung di dunia web, mungkin tutorial
yang akan saya tulis beberapa seri ini mudah diikuti. Namun, jika pembaca ingin
memulai belajar atau bahkan baru mengenal HTML, tak ada salahnya mengikuti
tutorial yang akan saya rangkum nanti.
Baik, sesuai judul di atas, saya akan mulai membahas tentang HTML5. Sedikit saja
coba saya petik dari Wikipedia, HTML5 adalah revisi ke 5 dari HTML. Yakni
bahasa pemrograman yang digunakan untuk membuat struktur dan tampilan dari
isi web. Jadi konklusinya di sini, HTML5 adalah teknologi paling anyar dari
HTML dengan kelengkapan fitur dan tambahan penataan format baru untuk desain
web (red.).
Mengenai kelebihan HTML5, coba kita lihat di bawah ini:
For Gaming and Applications. Dengan elemen fitur baru bernama
<canvas>, fitur ini memungkinkan kita untuk menggambar 2D di area kerja
HTML. Dan masih banyak lagi sebenarnya yang bisa kita lakukan dengan
<canvas> ini.
Web Storage. Lupakan cache di browser, saat ini sudah banyak situs yang
memanfaatkan Web Storage di HTML5 untuk memaksimalkan beberapa fitur
untuk sebuah website. Web Storage memungkinkan browser menyimpan
secara dinamis data-data dari user yang mengakses situs.
Audio and Video. Percaya tidak percaya, jika kita ingin menyajikan suara
maupun video di website HTML5 sebenarnya bisa dilakukan dengan sangat
mudah. Dengan API (Application Programming Interface) yang dimiliki
HTML5, suara dan video dapat ditampilkan dengan menaruh sebuah elemen
di HTML5. Meski dengan tambahan Javascript, Overal ! its very easy for
beginners !
Performance. Pasti pernah kan membuka Google Apps? Baik itu Gmail,
Google Drive, maupun sejenisnya. Ternyata mereka menggunakan HTML5,
lihat performanya dan bandingkan dengan Gmail di beberapa tahun yang lalu
sebelum memakai HTML5. Pasti lebih powerful dan keren.
Masih banyak lagi. Bisa pembaca cek di sini > Html5Rocks.
Nah, sebenarnya ada satu lagi kelebihan yang dimiliki HTML5
selain yang saya tulis di atas, yaitu Cross Platform. Dengan kata
lain semua browser dan semua device baik itu mobile maupun
desktop, sudah mendukung penggunaan HTML5. Untuk apa?
Pastinya untuk membangun sebuah aplikasi. Contoh saja Gmail
dan Google Apps lainnya yang dibangun menggunakan HTML5,
mereka merupakan sebuah aplikasi (asli) yang hanya bisa
dijalankan via browser. Sangat keren menurut saya.
Kemudian ada kabar gembira baru, HTML5 sekarang ini sudah bisa dipakai
untuk membangun aplikasi mobile, entah itu untuk platform Android, iOS, bahkan
BlackBerry. Its Awesome Guys ! Pernah membuat aplikasi Android? Pusing
dengan Java? C++ dan teman-temannya? Kalian sudah bisa HTML, kalian bisa
membuat aplikasi Android. Jika tidak percaya, Aplikasi yang saya buat bersama
teman-teman ini asli menggunakan HTML5. Cek di sini aplikasinya > Google
Play.
Untuk dapat membangun aplikasi mobile menggunakan HTML5, memang ada
beberapa tools tambahan yang harus kita pakai. Berikut adalah beberapa tools yang
bisa kita pakai untuk membangun aplikasi mobile dengan HTML5,
PHONEGAP (APPS)
SENCHA TOUCH (APPS)
COCOS2D JAVASCRIPT (GAMES)
COCOON JS, ETC. (GAMES)
CONSTRUCT 2 (GAMES)
Begitu banyaknya tools yang dapat kita pakai untuk membangun aplikasi
mobile dengan HTML5, sampai-sampai saya malas me-list dan menuliskan di sini.
Hehe, mungkin lain kali, di seri tutorial selanjutnya saya akan membahas dan
menerangkan secara lebih detail tentang HTML5 dan PhoneGap.
Membangun Area Kerja HTML5 Untuk Aplikasi Mobile
Untuk membangun aplikasi mobile dengan mudah
berbasis HTML5 dan Phonegap, tentunya kita juga harus membangun area kerja
yang pas untuk keperluan developing. Pada artikel sebelumnya, penulis sudah
menyarankan agar kita wajib mempunyai text editor pemrograman, aplikasi
Eclipse dan tentunya koneksi internet.
Dalam tutorial pemantapan kali ini, penulis akan melanjutkan secara lebih jelas
hal-hal apa saja yang harus dilakukan untuk membangun area kerja berbasis
HTML5. Hal yang diperlukan tersebut adalah sebagai berikut :
1. INSTALASI JAVA
Instalasi Java dimaksudkan untuk menjalankan aplikasi testing yang berbasis Java
dan memerlukan teknologi Java untuk menjalankannya. Java juga berfungsi
sebagai media kompilasi paket aplikasi Android.
Paket instalasi Java telah tersedia secara gratis di
website http://oracle.com/technetwork/java/javase/downloads/index.html
Untuk memastikan versi Java yang telah terinstal di komputer Windows, penulis
memanfaatkan aplikasi CMD Windows dengan menggunakan perintah CMD java
-version :
2. INSTALASI ANDROID SDK
Android SDK adalah salah satu tool yang diperlukan sebagai alat bantu dan API
untuk mengembangkan aplikasi pada platform Android. Penulis mendownload
secara langsung Android SDK dari situs http://developer.android.com secara
gratis alias tidak dipungut biaya.
LOKASI FOLDER ANDROID SDK
Paket Android SDK yang telah terdownload, dipindahkan ke dalam partisi C
sistem Windows 7. Folder Android di sistem C: ini berfungsi untuk menampung
file-file Android SDK.
3. INSTALASI ECLIPSE SDK VERSI TERBARU (DIPERKENANKAN
VERSI JUNO)
Eclipse di download langsung dari situs http: //www.eclipse.org/downloads dan
bersifat free. Eclipse versi Juno mempunyai banyak keunggulan dibanding versi-
versi sebelumnya. Salah satu keunggulannya adalah optimasi untuk kompilasi
Android menggunakan Android Development Tools (ADT).
ECLIPSE VERSI JUNO
Setelah melakukan serangkaian instalasi di atas kita masih diharuskan untuk
memasang beberapa tools maupun plugin agar PhoneGap dapat diimplementasikan
dengan baik ke dalam area kerja. Dalam tutorial berikutnya akan penulis lanjutkan
untuk pembahasan :
Instalasi ADT (Plugin Eclipse)
Instalasi MDS AppLaud (Plugin Eclipse)
Membuat AVD, dan
Membuat USB Debugging pada Samsung Galaxy
Quake II, Game 3D Yang Mengusung Teknologi HTML5
Teknologi HTML5 mempunyai masa depan yang sangat cerah. Terbukti
sampai sekarang ini, HTML5 telah dipakai oleh penyedia layanan online kelas atas
seperti Google, Yahoo, Facebook maupun Twitter. HTML5 menawarkan
kombinasi kecanggihan antara API dan browser yang sudah mengusung teknologi
hyper markup ini. Dengan API yang lengkap dan terus dikembangkan, HTML5
akan menjadi masa depan bagi dunia web, mobile, game 2D bahkan game 3D.
QUAKE II
Bukti bahwa HTML5 telah merambah ke dunia Game 3D adalah munculnya
Quake II. Quake II merupakan game yang dapat dimainkan melalui browser. Game
ini dibuat menggunakan WebGL dan juga Canvas API. WebGL 3D Graphic
menjadi engine utama untuk merender game Quake II pada browser-browser masa
kini seperti Google Chrome dan Safari. Sedangkan Canvas API dipakai sebagai
arena utama permainan yang tentunya menggunakan Javascript.
Berikut adalah fitur-fitur HTML5 yang dipakai untuk pengembangan game ini :
WebGL 3D Graphic
HTML5 Canvas Element
HTML5 WebSocket
HTML5 Audio Element
HTML5 Localstorage
Jika pembaca sedang berkecimpung di dunia pemrograman game berbasis
HTML5, Anda bisa mengunduh source code Quake II melaluicode.google.com.
Pembaca pun dapat mengikuti perkembangan bagaimana Quake II dibuat. Quake II
didukung sepenuhnya oleh para programmer Google.
Game yang bergenre First Person Shooter yang awalnya dikembangkan oleh
Activision ini mendapat 20% perhatian pengembangan oleh para Googlers
(programmer Google) untuk teknologi web browser masa depan. Anda bisa
melihat demo video Game Quake II HTML5 ini melalui video diatas. Sebagai info
Game ini mulai dikembangkan oleh Google pada tahun 2010 silam.
Pengembang juga menyarankan agar memakai Google Chrome atau Safari versi
terbaru untuk memainkan Game 3D ini. Pastikan juga spesifikasi komputer Anda
cukup mumpuni untuk merender WebGL. Silahkan mencoba Game ini melalui
quake2-gwt-port.appspot.com.
Catatan kaki: Dunia Game 3D yang identik dengan pemrograman desktop
sekarang mulai beralih dan perlahan-lahan merambah ke dunia web. Sebelumnya
jika kita sudah mengenal Flash Game yang dapat dimainkan melalui browser, saat
ini mulai muncul marak game-game 2 Dimensi yang diusung menggunakan
HTML5 dan Javascript Programming.
Mampukah HTML5 Menggantikan Mobile Native Apps?
Jika ingin membuat sebuah aplikasi untuk iPhone atau iPad maka Anda harus
develop dengan komputer Macintosh dan menggunakan bahasa Objective-C. Jika
ingin membuat aplikasi berbasis Android maka setidaknya harus memiliki dasar
Java dan paham bagaimana menggunakan API Android. Jadi seperti yang bisa
dilihat, ketika ingin membuat aplikasi yang sama untuk dua platform, kita harus
menulis code dua kali untuk dua platform itu.
HTML5 berjalan di Mobile
Itu sebabnya orang melihat HTML5 bisa menjadi alternatif menarik untuk
membuat aplikasi yang dapat dijalankan di semua platform. Write once, run
everywhere. HTML5 jika dipadukan dengan CSS3 dan JavaScript memang
terbukti bisa menghasilkan aplikasi yang sangat interaktif. Apalagi saat ini hampir
semua gadget ataupun komputer yang memiliki browser. Oleh karena itu, tidak
mengherankan apabila di Internet muncul berbagai artikel mengenai bagaimana
membuat aplikasi untuk iPhone ataupun Android dengan HTML. Sebagai
teknologi yang tergolong baru, menggunakan HTML5 untuk membuat aplikasi
untuk mobile menggantikan native app bukanlah tanpa tantangan. Mari kita pilah-
pilah beberapa poin yang menjadi masalah:
1. Native App lebih cepat daripada HTML5
Pada dasarnya aplikasi native lebih cepat dikarenakan langsung dijalankan di
sistem, dibandingkan HTML5 yang masih harus transfer data dari server ke
perangkat tangan Anda.
2. Tampilan Native App lebih seirama dibandingkan HTML5
Biasanya tampilan aplikasi native lebih menyatu dengan perangkat daripada
aplikasi berbasis Web.
3. Masalah keamanan pada HTML5
Bagi pengguna yang mengerti pemograman dan sejenisnya, peluang untuk
mendobrak aplikasi HTML5 jauh lebih mudah dibandingkan aplikasi native.
Misalnya saja, aplikasi Angry Bird berbasis HTML5 dapat dengan mudah di-hack
untuk membuka semua level setelah beberapa jam di-launching.
4. HTML5 belum tentu bisa dijalankan di semua perangkat.
Walaupun dikatakan write once run everywhere, HTML5 tidak sepenuhnya
bisa dijalankan di mana-mana. Salah satu akibatnya adalah dukungan browser
sendiri yang belum tentu mendukung semua fitur dari HTML5, apalagi W3C
selaku badan yang membuat standar HTML5 menyatakan standar HTML5
mungkin baru akan rampung 2014.
5. HTML5 tidak efisien.
Aplikasi native cenderung lebih efisien dibandingkan HTML5 karena aplikasi
native dibuat hanya ditujukan untuk perangkat itu saja. Developer IPhone dapat
memaksimalkan segalanya supaya aplikasinya dapat berjalan sempurna di Iphone.
Berbeda dengan developer berbasis Web HTML5, dia harus memikirkan berbagai
kemungkinan yang pada ujungnya harus mengorbankan efisiensi. Itulah secuil
kelemahan HTML5 dibandingkan native app. Tetapi walaupun hari ini HTML5
belum mencapai tahap rampung, bukan berarti native app bisa berjaya terus. Untuk
saat ini HTML5 masih memiliki kekurangan sana sini, tetapi perkembangannya
sangatlah cepat.
Dukungan HTML5 semakin hari akan semakin membaik. Saat ini saja, kita
sudah mampu membuat aplikasi HTML5 berbasis sentuh yang dapat berjalan di
Web maupun di mobile. Google sendiri merilis JavaScript engine V8 yang telah
membuktikan mampu memproses JavaScript jauh lebih cepat. Serta saat ini sudah
terdapat App Store untuk aplikasi berbasis HTML5 yang bisa dipasang ke gadget
yang dinamakan openappmkt.com. Jadi, mungkin saja jika hari ini jika developer
lebih memilih develop native app daripada berbasis HTML5. Tetapi penulis yakin
dalam waktu beberapa tahun, dengan kecepatan perkembangannya seperti saat ini,
aplikasi berbasis HTML5 akan mulai menjadi pilihan favorit developer. Kita lihat
saja nantinya.
Seklias tentang Html5 vs Flash
Sebagian besar video yang sedang diputar melalui browser hari ini adalah
dengan Flash plugin. Ini bekerja dengan cukup baik, tetapi sayangnya Flash
membutuhkan banyak daya komputasi kalo dikompi saya sendiri suka nge-hang
coz resource yang dipake gede banget. tapi kahirnya dikembangkan sebuah
HTML5 standar web baru sedang mencoba untuk mengubah itu.
HTML5 telah dirancang dengan codec audio dan video yang harus mengambil
kekuatan pemrosesan kurang dari satu Flash player setara. Sebuah tes independen
telah menunjukkan bahwa html5 ini lebih efisien daripada Flash. Namun bahkan
dengan perbaikan dalam efisiensi pengolahan dari HTML5, itu tidak boleh
diasumsikan bahwa itu benar-benar akan menggantikan Flash atau bahkan
memiliki dampak yang signifikan, terutama pada konten web kaya. Flash masih
memiliki banyak keuntungan seperti:
~ Lebih baik sub pixel resolusi dan anti aliasing
~ Ada baiknya pengembang alat yang sangat baik (jauh lebih luas daripada
HTML5)
~ Flash array yang luas dari font mencari dan berdampak baik
Pada titik ini, seniman grafis dan pengembang game masih mencintai Flash. Dan
meskipun mereka pasti menyukai ide yang mampu beroperasi dengan overhead
komputasi kurang, mereka ingin mendapatkan kontrol yang paling dan
kemampuan untuk menghasilkan results yang maksimal.Meskipun beredar untuk
banyak aplikasi video pemutaran sederhana seperti di YouTube, HTML5 memiliki
kemampuan untuk dengan cepat melampaui Flash sebagai video / audio player
pilihan di browser.
Pada titik ini, perkembangan HTML5 YouTube didukung pemain masih dalam
tahap awal dan lebih banyak tweaking dan perbaikan harus dilakukan. Ini juga
membutuhkan dukungan yang baik dengan browser lain dan pengujian ekstensif
untuk bekerja keluar ketidakstabilan dan isu-isu ketidakcocokan / bugs. Namun
karena ini pada platform terbuka, ada banyak orang yang bekerja melalui isu-isu
ini sehingga hanya masalah waktu. Tetapi banyak orang merasa bahwa proses ini
dapat dengan mudah dilalui dalam waktu bertahun-tahun.
Kenyataan masih tetap yang HTML5 tidak kompatibel dengan semua browser
dan banyak pengguna yang tahan terhadap perubahan ke browser lain. Sejauh rata-
rata pengguna komputer yang bersangkutan, jika ia bekerja ok bagi mereka mereka
tidak tertarik untuk pindah ke browser lain. Sebagai contoh, sebagian besar Intenet
Explorer dikritik karena ketidakstabilan dan kelemahan keamanan. Namun banyak
orang tetap berpegang pada browser itu dan sangat enggan untuk beralih ke sesuatu
seperti Firefox atau Chrome.
Jadi menyadari bahwa bahkan dengan efisiensi potensial yang dapat membawa
HTML5 ke yang lebih baik, janga
n berharap penyebaran cepat atau perubahan jauh dari Flash.
Tujuan dibuatnya HTML5 antara lain:
1. Fitur baru harus didasarkan pada HTML, CSS, DOM , dan JavaScript.
2. Mengurangi kebutuhan untuk plugin eksternal (seperti Flash).
3. Penanganan kesalahan yang lebih baik.
4. Lebih banyak markup untuk menggantikan scripting.
5. HTML5 merupakan perangkat mandiri.
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,
navigation, section.
Bentuk kontrol form seperti kalender, tanggal, waktu, e-mail, URL, search.
Beberapa kelebihan yang dijanjikan pada HTML5:
Dapat ditulis dalam sintaks HTML (dengan tipe media text/HTML)
danXML.
Integrasi yang lebih baik dengan aplikasi situs dan pemrosesannya.
Integrasi ('inline') dengan doctype yang lebih sederhana.
Penulisan kode yang lebih efisien.
Konten yang ada di situs lebih mudah terindeks oleh search engine.
Saat ini HTML5 masih dalam pengembangan, namun hanya beberapa
browser sudah mendukung HTML5.Beberapa browser tersebut seperti
Safari, Chrome, Firefox, dan Opera. Kabarnya IE9 (Internet Explorer) akan
mendukung beberapa fitur dari HTML5.
BAB III
KESIMPULAN
Web developer adalah seseorang yang menciptakan aplikasi berbasis web
dengan menggunakan bahasa pemrograman. Peran web developer adalah sebagai
penghubung dari semua sumber daya yang akan digunakan pada sebuah website,
mulai dari pemanggilan database, membuat halaman website yang dinamis, hingga
mengatur cara pengunjung untuk berinteraksi dengan elemen-elemen dari website
tersebut.
Seorang web developer yang handal akan terbiasa dengan bahasa pemrograman,
baik itu di sisi server ( server-side scripting ) maupun disisi client ( client-side
scripting ). Dan jangan lupa dengan aspek database yang akan digunakan.
Berikut adalah bagian aplikasi yang harus dipahami oleh seorang web developer.
Web Asministrator adalah orang yang bertanggung jawab atas jalannya sebuah
website dan bertugas untuk mengawasi perkembangan website.
DAFTAR PUSTAKA
http://belajar-sendiri.com/2011/01/html5-generasi-terbaru-dari-bahasa-html%20/
http://www.djavanese.wordpress.com/
http://www.univind.com/
http://www.neohoster.com/
http://www.blog.neohoster.com/
http://blog-indonesia.com/blog-archive-12571-269.html
top related