Html makalah destika

1

MAKALAH TEKNOLOGI INFORMASI DAN KOMUNIKASI
HTML5 berbasis Web

Disusun Oleh :
Destika Anastasia Sari 1102412014

Prodi Teknologi Pendidikan
Fakultas Ilmu Pendidikan
Universitas Negeri Semarang
2013

2

KATA PENGANTAR

Puji syukur saya panjatkan kepada Allah SWT, karena atas taufik rahmat dan
hidayah-Nya, saya dapat menyelesaikan makalah yang berjudul “Manfaat Android
Bagi Kehidupan” tepat pada waktunya. Penulisan Makalah

ini disusun untuk

memenuhi tugas mata kuliah Teknologi Informatika.

Dengan demikian penulis menyadari bahwa penulisan makalah ini masih jauh
dari kesempurnaan dan masih banyak kekurangannya. Dikarena keterbatasan dan
kemampuan penulis dalam hal mencari data yanag akan dijadikan sebagai sumber
pengembangannya. Maka dari itu, penulis sangat mengharapkan kritik dan saran dari
semua pihak yang bersifat membangun demi kesempurnaan penulisan makalah ini di
masa datang.

Selain itu tidak lupa penulis mengucapkan terima kasih kepada semua pihak
yang telah membantu penulis baik materi maupun spiritualnya dalam penulisan
makalah llmiah ini. Akhir kata penulis mengucapkan semoga makalah ilmiah ini
dapat bermanfaat bagi pembaca umumnya dan bagi penulis khususnya.

Semarang 20 Oktober 20113

3

BAB 1
PENDAHULUAN

A. Latar Belakang Masalah
Kebutuhan 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.
Sejak 1997 sampai sekarang, tidak ada perubahan versi HTML lagi. DI sisi
lain, tantangan layanan web saat ini sudah jauh berbeda. Contoh kebutuhan yang
berbeda adalah interaktivitas, dan layanan multimedia.Dengan berkembangnya Web
2.0, layanan web harus mudah dipakai.Contohnyatanya dapat dilihat pada
perkembangan Facebook dan Twitter yang semakin pesat.Ini dikarenakan kita bisa
mensimulasikan kehidupan sosial sehari-hari melalui internet, orang juga mudah
menggunakannya. Sehigga siapapun dia walaupun tanpa latar belakang teknologi
tetap bias menggunakan layanan ini.
Mudah dipakai dan interaktif, itulah 2 hal yang membuat layanan web bisa
berkembang

dengan

cepat

dan

mampu

menjangkau

seluruh

lapisan

masyarakat.Meskipun dengan javascript kita sudah mampu melakukan itu, tapi
dengan HTML5, kita bisa membuat itu dengan lebih simpel.
Misalnya kita ingin membuat form entry data yang bisa melakukan
pengecekan format alamat email. Itu bisa kita lakukan dengan javascript.Tapi dengan
HTML5, kita bisa melakukannya dengan lebih sederhana. Karena HTML5
menyediakan berbagai jenis field input termasuk email.Dengan jenis field tersebut,
kita tidak perlu membuat javascript panjang untuk mengecek format alamat email.

4

Berdasarkan fenomena tersebut maka sudah selayaknya kta perlu mempelajari
HTML5 dalam upaya kita untuk mengikuti perkembangan layanan web agar mampu
menggunakannya dengan lebih mudah serta lebih interaktif

B. Rumusan Masalah
Berdasarkan judul HTML5 Bagi 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

5

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). Secara garis besar, website bisa digolongkan menjadi
3 bagian yaitu : WebsitenStatis, Website Dinamis dan Website Interaktif.
Website Statis adalah web yang mempunyai halaman tidak berubah. Artinya adalah
untuk melakukan perubahan pada suatu halaman dilakukan secara manual dengan mengedit
code yang menjadi struktur dari website tersebut. Bersifat statis apabila isi informasi website
tetap, jarang berubah, dan isi informasinya searah hanya dari pemilik website. Contoh
website statis adalah berisi profil perusahaan statis hanya bisa diupdate oleh pemiliknya saja.

Website Dinamis merupakan website yang secara struktur diperuntukan untuk update
sesering mungkin. Bersifat dinamis apabila isi informasi website selalu berubah-ubah, dan isi
informasinya interaktif dua arah berasal dari pemilik serta pengguna website. Biasanya selain
utama yang bisa diakses oleh user pada umumnya, juga disediakan halaman backend untuk
mengedit kontent dari website. Contoh umum mengenai website dinamis adalah web berita
atau web portal yang didalamnya terdapat fasilitas berita, polling dan sebagainya.

Website Interaktif adalah web yang saat ini memang sedang booming. Salah satu
contoh website interaktif adalah blog dan forum. Di website ini user bisa berinteraksi dan
beradu argument mengenai apa yang menjadi pemikiran mereka. Biasanya website seperti
memiliki moderator untuk mengatur supaya topik yang diperbincangkan tidak keluar jalur.

6

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.unnes.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 :
Generic Domains
Merupakan domain name yang berakhiran dengan .com .net .org .edu .mil atau .gov.
Jenis domain ini sering juga disebut top level domain dan domain ini tidak berafiliasi
berdasarkan Negara, sehingga siapun dapat mendaftar.
Contoh:
.com

: merupakan top level domain yang ditujukan untuk kebutuhan komersial

.edu

: merupakan domain yang ditujukan untuk kebutuhan dunia pendidikan (education).

.gov

: merupakan domain untuk pemerintahan (govemment).

.mil

: merupakan domain untuk kebutuhan angkatan bersenjata (military)

.org

: domain untuk organisasi atau nembaga non profit (organization).

7

Country-Specific Domains

Yaitu domain yang berkaitan dengan dua huruf ekstensi, dan sering juga disebut second
level domain, seperti .id (Indonesia), .au(Australia), .uk(Inggris), .jp(Jepang) dan lain lain.
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.

8

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. Programprogram desain website salah satunya adalah Macromedia Firework, Adobe Photoshop,
Adobe Dreamweaver, Microsoft Frontpage, dll

9

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.

10

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
Pemeliharaan aplikasi web mengurangi biaya tanpa mengorbankan kualitas, nilai atau waktu
ke pasar dan juga memungkinkan inti R & D tim dari klien kami untuk fokus pada rilis
produk baru. Pengembang yang terampil memiliki keahlian yang sangat besar dalam
mengembangkan high end Solusi Aplikasi menggunakan Dot Net., AJAX, WEB 2.0, Java
Platform dan Microsoft. Bersih.Pemeliharaan website meliputi: Perangkat tambahan dan
perbaikan bug, Layanan paket rilis dan pelacakan patch, Forward / mundur port untuk
menggabungkan perangkat tambahan dengan upaya pengembangan produk inti, Koordinasi
dengan tim pengembangan untuk rilis di masa depan
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

11

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 membandingbandingkan 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.

12

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. Sejarah HTML5
Setelah berakhirnya masa pengembangan HTML4 pada tahun 1998,
dilanjutkan perkembangan HTML4 untuk XML yang dikenal dengan XHTML
1.0.XHTML 1.0 selesai dikembangkan pada tahun 2000. Saat itu sebenarnya HTML
akan mulai dikembangkan, namun masih menunggu proses pengembangan XHTML
2.0 yang mana selesai pada tahun 2003.
Tahun 2004 kembali diadakan workshop tentang evolusi untuk HTML5 dan
saat itulah muncul ide-ide dan gagasan tentang Semantic Web.Tahun 2007, W3C ikut
serta dalam pengembangan HTML5 dan terbentuklah suatu komunitas WHATWG
(Web Hypertext Application Technology Working Group).Perusahaan besar seperti
Mozilla, Opera dan Apple mengakui HTML5 dipublikasikan oleh W3C dengan
lisensi komunitas WHATWG.
HTML5 telah dipublikasikan secara resmi oleh W3C pada bulan Mei 2011
dan rencananya akan terus dikembangkan hingga tahun 2014 nanti. Walaupun
HTML5 masih terus dikembangkan, jangan khawatir untuk menggunakan HTML5
karena saat ini HTML5 hanya membutuhkan penyempurnaan saja, sudah tidak lagi
berada di masa percobaan yang bisa berstatus produksi gagal.

13

Meskipun HTML5 telah dikenal luas oleh para pengembang web sejak lama,
HTML5 baru mencuat pada April 2010 setelah CEO Apple Inc., Steve Jobs,
mengatakan bahwa dengan pengembangan HTML5, "Adobe Flash sudah tidak
dibutuhkan lagi untuk menyaksikan video atau menyaksikan konten apapun di
web."Sejauh ini browser desktop maupun browser mobile sudah mampu
mengimplementasikan HTML5, walaupun belum sepenuhnya sempurna.Browser
yang saat ini paling maju untuk fitur HTML5 atau semantic web adalah Google
Chrome.

HTML5 adalah suatu spesifikasi atau standard yang dikeluarkan oleh W3C
(World Wide Web Consortium) sebagai revisi dari standard HTML. Tujuan utamanya
telah meningkatkan bahasa dengan dukungan untuk multimedia terkini dengan tetap
mudah dibaca oleh manusia dan secara konsisten dimengerti oleh komputer dan
perangkat (web browser, parser, dll). HTML5 dimaksudkan untuk menggolongkan
tidak hanya HTML 4, tapi XHTML 1 dan DOM Level 2 HTML juga. HTML5 ini
merupakan hasil proyek dari lembaga persatuan website dunia, World Wide Web
Consortium (W3C) dan Web Hypertext Application Technology Working Group
(WHATWG). Proyek tersebut dimulai di tahun 2009 untuk menyempurnakan bahasa
penanda sebelumnya yang dianggap sudah lawas.
Tujuan utama dengan adanya HTML5 adalah mengurangi penggunaan pluginplugin 3rd party pada HTML sehingga dapat mempercepat kinerja web itu sendiri.
Plugin-plugin tersebut seperti Adobe Flash, Microsft Silverlight, Java dan lainlainnya. 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 World Wide Web Consortium untuk mendefinisikan sebuah bahasa
markah tunggal yang dapat ditulis dengan cara HTML ataupun XHTML.

14

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. Di masa depan, format HTML5 akan
menjadi sangat penting bagi penyedia layanan browser dan web desain, dalam
memajukan alat perambannya menjadi lebih kaya aplikasi, web dan web desain yg
interaktif dan menarik. Demikian pengakuan dari General Manager Internet Explorer
(IE) Dean Hachamovitch.
Spesifikasi HTML5 menggambarkan dukungan video tanpa menentukan
format video tertentu. H.264 adalah format yg sangat baik untuk mendukung HTML5
nya, IE9 nantinya juga akan mendukung pemutaran video H.264 saja. H.264 adalah
suatu standar industri, dengan dukungan hardware yg luas dan kuat. Dengan
standarisasi ini kita dapat dengan mudah menerima apa yang kita rekam, meskipun
dengan video pada kamera biasa, lalu meletakkannya di situs dengan sistem operasi
atau perangkat dgn dukungan H.264. Karena semua alasan tersebut, kita fokus
HTML5 video dan dukungan pada H.264.
Kendati format video akan sangat menarik jika dipasangkan dengan H.264,
Hachamovitch mengakui bahwa mayoritas video internet saat ini masih didominasi
berbasis Flash. Flash memang memiliki beberapa masalah, khususnya di sekitar
keandalan, keamanan, dan kinerja. Meskipun saat ini, Flash tetap merupakan bagian
penting dalam memberikan pengalaman konsumen yang terbaik di situs hingga hari
ini.
Pembaruan yang ada pada HTML5
Beberapa ahli mengklaim bahwa HTML5 adalah desain web masa depan, namun tak
seorangpun berani menjamin kebenaran informasi ini mengingat perkembangan teknologi
berubah sangat cepat. Berikut ini pemabaruan yang dibawa oleh HTML5:
1. Tidak perlu plugin eksternal lagi seperti Flash/photoshop untuk memutar video,audio
dan gambar.
2. Mampu menangani error handling lebih efisien
3. Ada beberapa element baru untuk menyederhanakan penulisan coding
4. Ada local storage nya, biasanya sering dimanfaatkan untuk aplikasi game
5. Mendukung element dan scripting untuk 3D

15

Selain beberapa fitur baru yang yang terdapat di atas, perlu kita ketahui bersama
bahwa HTML 5 juga memiliki fitur-fitur ini tidak dijumpai pada HTML versi sebelumnya
yaitu Canvas, Audio, Geolocation, WebGL, WebSocket, Local Storage, dan Offline
Application. Mari kita bahas satu-persatu secara umum

B. 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.

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.

Browser yang Mendukung HTML
Opera Web Browser (mulai dari Opera 9.2 sampai yang terbaru saat ini yaitu opera
10)

16

Safari (mulai dari versi 3.1)
FireFox (Mulai dari FireFox 3 )
Google Chrome (Mulai dari versi 3)
Internet Explorer (Mulai dari versi 8)

C. HTML5 Semantic

HTML5 Semantic adalah beberapa tag baru yang diperkenalkan dalam HTML5 untuk
mendukung struktur halaman yang lebih rapi. Beberapa elemen baru digunakan untuk
mengurangi pemakaian tag <div>.
Elemen-elemen baru yang ditambahkan pada HTML5 adalah:
Tag

Keterangan

<article>

Menspesifikasikan

konten

yang

bersifat

independen, seperti artikel, blog post, forum
post, dan sejenisnya.
<aside>

Digunakan

untuk

sebuah

subkonten.

Biasanya digunakan di dalam tag <article>.
<bdi>

Untuk teks yang tidak boleh terikat pada arah
teks-elemen induknya

<command>

Sebuah

button,

atau

radiobutton,

atau

checkbox.
<details>

Untuk menjelaskan detail tentang sebuah
dokumen atau sebagian dari dokumen.

<summary>

Digunakan pada sebuah ringkasan dan
sejenisnya di dalam tag <details>

<figure>

Untuk mengelompokkan sekumpulan section,
biasanya berupa video.

<figcaption>

Berisi caption/keterangan yang ditempatkan
di dalam tag <figure>

<footer>

Digunakan

sebagai

footer

dari

sebuah

halaman
<header>

Digunakan sebagai
halaman

header dari sebuah

17

<hgroup>

Digunakan untuk sekumpulan heading

<mark>

Digunakan pada teks yang akan di highlight

<meter>

Digunakan untuk pengukuran, dimana nilai
maksimal dan minimal telah ditentukan

<nav>

Digunakan untuk sekumpulan navigasi

<progress>

Membuat Progress bar

<ruby>

Digunakan untuk anotasi ruby

<rt>

Untuk menjelaskan anotasi ruby

<rp>

Menunjukkan elemen jika browser tidak
mendukung ruby

<section>

Untuk sebuah section di dalam halaman.
Seperti Bab, Footer, dan sebagainya

<time>

Untuk mendefinisikan waktu dan tanggal

<wbr>

Word Break. Untuk memisah suatu kata bila
diperlukan.

HTML5 Audio
Salah satu fitur baru HTML5 yang paling mencengangkan adalah disediakannya tag baru
yang memungkinkan kita untuk memutar audio sesuai yang kita inginkan tanpa
menggunakan plugin tambahan seperti flash player. Dengan menggunakan tag <audio> kita
sudah bisa memasukkan file mp3 dan ogg ke dalam halaman web kita.
Untuk menambahkan audio ke dalam web kita, cukup ketikkan kode berikut

<!DOCTYPE html>
<html>
<body>

<audio controls="controls">
<source src="music/FromHere.ogg" type="audio/ogg">
Your browser does not support the audio element.
</audio>
</body>
</html>

18

Sehingga akan menampilkan output seperti berikut :


Mozilla version 9.0.1

Google chrome Version 22.0.1229.94

Opera version 12.10 beta RC

Penjelasan dari tags diatas:
< <audio>, tag audio utama, digunakan untuk memasukkan audio ke dalam HTML.


<source>, digunakan untuk mengambil source file yang akan dimainkan audionya.
Atribut pada audio



Autoplay, atribut ini digunakan untuk member opsi kepada tag audio apakah langsung
dimainkan secara otomatis atau tidak.



Controls, atribut ini memberikan pilihan untuk menampilkan kontrol audio (volume,
seeker, play/pause button).

19



Type, digunakan untuk mendefinisikan tipe audio yang dimainkan.



Src, digunakan untuk mendefinisikan source audio yang dimainkan.
Saat ini, ada tiga tipe file audio yang sudah didukung HTML5 yaitu MP3, WAV, dan OGG.
Berikut adalah data dukungan browser terhadap audio.
Browser

MP3

Wav

Ogg

Internet Explorer 9

Ya

Tidak

Tidak

Firefox 4.0

Tidak

Ya

Ya

Google Chrome 6

Ya

Ya

Ya

Apple Safari 5

Ya

Ya

Tidak

Opera 10.6

Tidak

Ya

Ya

HTML5 Video
Fitur multimedia lainnya yang didukung oleh HTML5 adalah video. Jika selama ini kita
harus menggunakan flash player untuk memasukkan konten video, pada HTML5 kita tidak
perlu lagi menggunakannya.
Untuk menambahkan elemen video kita gunakan kode berikut

<!DOCTYPE html>
<html>
<body>

<video width="320" height="240" controls="controls">
<source src="video/movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>

</body>
</html>

Sehingga akan menampilkan output sebagai berikut :



20



HTML5 Canvas
Fitur yang lain pada HTML5 adalah <canvas>. Canvas memungkinkan kita untuk
memasukkan objek 2D atau 3D kedalam halaman web. Canvas juga sama seperti
GeoLocation, tidak bias bekerja sendiri. Dibutuhkan javascript untuk membuat objek di
dalamnya, baik 2D maupun 3D.
Untuk membuat objek di dalam canvas kita gunakan kode berikut :

<!DOCTYPE html>
<html>
<body>

21

<canvas

id="myCanvas"

width="200"

height="100"

#c3c3c3;">
Your browser does not support the HTML5 canvas tag.
</canvas>

<script>
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.fillStyle="#FF0000";
ctx.fillRect(0,0,150,75);
</script>

</body>
</html>

Sehingga kita dapatkan hasil output seperti berikut :





style="border:1px

solid

22

HTML5 Form Element

Pada HTML5 kita mengenal beberapa elemen form baru. Jika dahulu kita terbatas
pada input dan textarea, kali ini HTML5 menambahkan tiga elemen baru yaitu datalist,
keygen, dan output.
Namun untuk keygen, dukungan browser saat ini belum memenuhi standar keamanan,
sehingga lebih aman untuk para web programmer menggunakan enkripsi pada server-side
seperti md5, sha1, dan base64_encode.


Form Datalist
<!DOCTYPE html>
<html>
<body>

<form action="demo_form.asp" method="get">
<input list="browsers" name="browser">
<datalist id="browsers">
<option value="Internet Explorer">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist>
<input type="submit"></form>

</body>
</html>

23








Form Output

<!DOCTYPE html>
<html>
<body>

<form oninput="x.value=parseInt(a.value)+parseInt(b.value)">0
<input type="range" name="a" value="50">100 +
<input type="number" name="b" value="50">=
<output name="x" for="a b"></output>
</form>

</body>
</html>

24




Google Chrome Version 22.0.1229.94


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

25

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.

26

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:

27

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

28

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
2.1.

Proses Standardisasi W3C
Kelompok kerja untuk teknologi aplikasi web hypertext (WHATWG) mulai

menspesifikasikan HTML5 pada bulan juni 2004 dengan nama Web Applications 1.0.,
hingga pada bulan maret 2010 spesifikasi ini masuk ke bagian draft standar di WHATWG,
dan ke dalam bagian pengurusan draft di W3C. Ian Hickson mewakili Google ,Inc menjadi
editor HTML5.
Pada tahun 2007 Spesifikasi HTML5 diadopsi sebagai pekerjaan permulaan untuk
grup baru yang mengurus HTML di World Wide Web Consorsium (W3C). Grup ini pertama
kali mempublikasikan hasil draft pekerjaan pertama mereka pada tanggal 22 januari 2008.
Spesifikasi ini berstatus dalam tahap pengerjaan, dan diperkirakan akan tetap demikian
selama bertahun-tahun, meskipun sebagian dari HTML5 sudah dalam tahap penyelesaian dan
diimplementasikan pada penjelajah web sebelum keseluruhan spesifikasinya mencapai status
rekomendasi final.
Berdasarkan pada jadwal kerja W3C, HTML5 diperkirakan menjadi kandidat
rekomendasi pada akhir tahun 2010.Namun, publikasi pertama draft HTML 5 meleset selama
8 bulan.Permintaan dokumen terakhir dan tahap kandidat rekomendasi diharapkan dapat
dicapai pada tahun 2008, tetapi hingga bulan Juli 2010 HTML5 masih dalam tahapan draft
pengerjaan di W3C.WHATWG telah meminta penyelesaian terakhir untuk HTML5 sejak
bulan oktober tahun 2009.Editor HTML5, Ian Hickson, berharap spesifikasi HTML5 dapat
mencapai tahap kandidat rekomendasi pada tahun 2012.

29

Kriteria di W3C agar sebuah spesifikasi dapat 100% selesai dan penerapannya dapat
dilakukan pada dua atau lebih sistem yang berbeda . Pada wawancaranya dengan
TechRepublic, Hickson memperkirakan hal ini baru akan terjadi pada tahun 2022 atau
setelahnya. Meski demikian, banyak bagian dari spesifikasi sudah stabil dan telah dapat
diterapkan pada produk.

30

BAB III
PENUTUP

3.1.

Kesimpulan
Hyper Text Markup Language (HTML) adalah sebuah bahasa markup yang

digunakan untuk membuat sebuah halaman web, menampilkan berbagai informasi di dalam
sebuah penjelajah web internet dan formating hyper text sederhana yang ditulis kedalam
berkas format ASCII agar dapat menghasilkan tampilan wujud yang terintegerasi.
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.
Kelompok kerja untuk teknologi aplikasi web hypertext (WHATWG) mulai
menspesifikasikan HTML5 pada bulan juni 2004 dengan nama Web Applications 1.0.,
hingga pada bulan maret 2010 spesifikasi ini masuk ke bagian draft standar di WHATWG,
dan ke dalam bagian pengurusan draft di W3C. Ian Hickson mewakili Google ,Inc menjadi
editor HTML5.Pada tahun 2007 Spesifikasi HTML5 diadopsi sebagai pekerjaan permulaan
untuk grup baru yang mengurus HTML di World Wide Web Consorsium (W3C). Grup ini
pertama kali mempublikasikan hasil draft pekerjaan pertama mereka pada tanggal 22 januari
2008.
3.2.

Saran
1. Jangan mudah menyerah dalam mempelajari HTML5, meskipun terdapat
beberapa perbedaan dari versi sebelumnya.
2. Jika ingin membuat web dangan lebih mudah dan interaktif sebaiknya
menggunakan HTML5 daripada menggunakan javascript

Html makalah destika

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Was ist angesagt?

Was ist angesagt? (18)

Andere mochten auch

Andere mochten auch (11)

Ähnlich wie Html makalah destika

Ähnlich wie Html makalah destika (20)

Html makalah destika