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

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

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 plugin-

plugin 3rd party pada HTML sehingga dapat mempercepat kinerja web itu sendiri.

Plugin-plugin tersebut seperti Adobe Flash, Microsft Silverlight, Java dan lain-

lainnya. 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 header dari sebuah

halaman

<hgroup> Digunakan untuk sekumpulan heading

17

<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 :

         Mozilla version 9.0.1

20

                  Google chrome Version 22.0.1229.94

Opera version 12.10 beta RC

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" style="border:1px solid

#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 :

         Mozilla version 9.0.1

   

      Google chrome Version 22.0.1229.94

   Opera version 12.10 beta RC

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

Sehingga kita dapatkan hasil output seperti berikut :

         Mozilla version 9.0.1

Google chrome Version 22.0.1229.94

Opera version 12.10 beta RC

         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

Sehingga kita dapatkan hasil output seperti berikut :

         Mozilla version 9.0.1

Google Chrome Version 22.0.1229.94

 Opera version 12.10 beta RC

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