HTML
Hyper Text Markup Language (HTML)
adalah sebuah bahasa markah yang digunakan untuk membuat sebuah halaman web,
menampilkan berbagai informasi di dalam sebuah penjelajah web Internet dan
pemformatan hiperteks sederhana yang ditulis dalam berkas format ASCII agar
dapat menghasilkan tampilan wujud yang terintegerasi. Dengan kata lain, berkas
yang dibuat dalam perangkat lunak pengolah kata dan disimpan dalam format ASCII
normal sehingga menjadi halaman web dengan perintah-perintah HTML. Bermula dari
sebuah bahasa yang sebelumnya banyak digunakan di dunia penerbitan dan
percetakan yang disebut dengan SGML (Standard Generalized Markup Language),
HTML adalah sebuah standar yang digunakan secara luas untuk menampilkan halaman
web. HTML saat ini merupakan standar Internet yang didefinisikan dan
dikendalikan penggunaannya oleh World Wide Web Consortium (W3C). HTML dibuat
oleh kolaborasi Caillau TIM dengan Berners-lee Robert ketika mereka bekerja di
CERN pada tahun 1989 (CERN adalah lembaga penelitian fisika energi tinggi di
Jenewa).
Sejarah
HTML pada awalnya dikembangkan
oleh Tim Berners-Lee sementara di CERN, dan dipopulerkan oleh browser Mosaic
dikembangkan di NCSA. Selama tahun 1990-an telah berkembang dengan pertumbuhan
eksplosif Web. Selama waktu ini, HTML telah diperpanjang dalam beberapa cara.
Web tergantung pada halaman Web penulis dan vendor berbagi konvensi yang sama
untuk HTML. Hal ini telah termotivasi bekerja bersama spesifikasi untuk HTML.
HTML 2.0 (November 1995, lihat
[RFC1866] [p.356]) telah dikembangkan di bawah perlindungan dari Internet
Engineering Task Force (IETF) untuk mengkodifikasi praktik umum di akhir tahun
1994. HTML + (1993) dan HTML 3.0 (1995, lihat [HTML30] [p.355]) mengusulkan
jauh lebih kaya versi HTML. Meskipun tidak pernah menerima konsensus dalam
standar diskusi, konsep ini mengarah pada adopsi berbagai fitur baru. Upaya
dari World Wide Web Consortium’s HTML Working Group untuk menata Common praktek
pada tahun 1996 menghasilkan HTML 3.2 (Januari 1997, lihat [HTML32] [p.356]).
Perubahan dari HTML 3.2 dirangkum dalam Lampiran A [p.311] 21 24 Desember 1999
18:26 Pengenalan HTML 4
Kebanyakan orang setuju bahwa
dokumen HTML harus bekerja dengan baik di berbagai browser dan platform.
Mencapai interoperabilitas menurunkan biaya untuk penyedia konten karena mereka
harus mengembangkan hanya satu versi dokumen. Jika upaya ini tidak dilakukan,
ada risiko yang lebih besar bahwa Web akan berpindah ke dalam dunia perangkat
lunak berpemilik
format tidak sesuai, akhirnya
mengurangi potensi komersial Web untuk semua peserta.
Setiap versi HTML telah berupaya
untuk merefleksikan konsensus di antara industri yang lebih besar pemain
sehingga investasi yang dilakukan oleh penyedia konten tidak akan sia-sia dan
bahwa dokumen mereka tidak akan menjadi tak terbaca dalam waktu singkat.
HTML telah dikembangkan dengan
visi bahwa segala macam perangkat tersebut harus berada dapat menggunakan
informasi di Web: PC dengan tampilan grafis dengan berbagai resolusi dan
kedalaman warna, telepon selular, perangkat tangan manusia, perangkat untuk
pidato untuk output dan input, komputer dengan bandwidth yang tinggi atau
rendah, dan seterusnya.
Kegunaan
Dengan menggunakan HTML anda
dapat membuat antara lain :
Memodifikasi format teks
Penggunaan HTML memungkinkan kita
untuk memodifikasi tampilan atau format dokumen yang akan kita transmisikan
melalui media Internet. Beberapa hal yang dapat dilakukan dalam menentukan
format dokumen ini adalah :
- Kita dapat menampilkan suatu
kelompok kata dalam beberapa ukuran yang dapat digunakan untuk judul, heading
dan sebagainya.
- Kita dapat menampilkan teks
dalam bentuk cetakan tebal
- Kita dapat menampilkan
sekelompok kata dalam bentuk miring
- Kita dapat menampilkan naskah
dalam bentuk huruf yang mirip dengan hasil ketikan mesin ketik
- Kita dapat mengubah-ubah ukuran
font untuk suatu karakter tertentu.
Menampilkan daftar sesuatu dalam
bentuk point-point (item)
Dengan HTML kita dapat
menampilkan daftar atau deretan informasi dalam bentuk point-point sehingga
lebih mudah dibaca dan dipahami
Membuat link
Konsep hypertext pada HTML
memungkinkan kita untuk membuat link pada suatu kelompok kata atau frase untuk
menuju ke bagian manapun dalam World Wide Web. Ada tiga macam link yang dapat
kita gunakan :
- Link menuju bagian lain dari
page
- Link menuju page lain dalam
satu web site
- Link menuju resource atau web
site yang berbeda
Menyisipkan citra
Dengan menyisipkan citra maka
tampilan page kita akan lebih menarik, interaktif dan informatif untuk
mendukung data-data lainnya dalam bentuk teks.
Menampilkan informasi dalam
bentuk tabel
Penampilan informasi dalam bentuk
tabel ini akan mempermudah pembaca untuk memahami informasi yang kita tawarkan.
Penggunaan tabel ini juga dapat dilakukan untuk menambah nilai estetika dari
page yang akan kita rancang.
Dokumen HTML sederhana
Secara garis besar, terdapat 4
jenis elemen dari HTML:
Struktural. Tanda yang menentukan
level atau tingkatan dari sebuah tulisan (contoh, <h1>Golf</h1>
akan memerintahkan peramban untuk menampilkan "Golf" sebagai tulisan
tebal besar yang menunjukkan sebagai Heading 1
Presentasional. Tanda yang
menentukan tampilan dari sebuah tulisan tidak peduli dengan level dari tulisan
tersebut (contoh, <b>boldface</b> akan menampilkan bold. Tanda
presentasional saat ini sudah mulai digantikan oleh CSS dan tidak
direkomendasikan untuk mengatur tampilan tulisan,
Hiperteks. Tanda yang menunjukkan
pranala ke bagian dari dokumen tersebut atau pranala ke dokumen lain (contoh,
<a href="http://www.wikipedia.org/"> Wikipedia</a> akan
menampilkan Wikipedia sebagai sebuah hyperlink ke URL tertentu),
Elemen widget yang membuat
objek-objek lain seperti tombol (<button>), daftar (<li>), dan
garis horizontal (<hr>). Konsep hiperteks pada HTML memungkinkan
pembuatan tautan pada suatu kelompok kata atau frasa untuk menuju ke bagian
manapun dalam World Wide Web,
Ada tiga macam pranala (link)
yang dapat digunakan:
Pranala menuju bagian lain dari
page.
Pranala menuju page lain dalam
satu web site.
Pranala menuju resource atau web
site yang berbeda.[16]
Selain markup presentasional,
markup yang lain tidak menentukan bagaimana tampilan dari sebuah tulisan. Namun
untuk saat ini, penggunaan tag HTML untuk menentukan tampilan telah dianjurkan
untuk mulai ditinggalkan, dan sebagai gantinya digunakan Cascading Style
Sheets.
Contoh
Untuk HTML 4 Strict [17]
<!DOCTYPE HTML PUBLIC
"-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head
bgcolor=black text=white>
<title>Selamat
Datang HTML</title>
</head>
<body>
<p>Halo
dunia!</p>
</body>
</html>
Untuk HTML 5 [18]
<!DOCTYPE HTML>
<html>
<head
style="background-color: black; color: white;">
<title>Selamat
Datang HTML</title>
</head>
<body>
<p>Halo
dunia!</p>
</body>
</html>
Head
Dokumen HTML diapit oleh tag
<HEAD></HEAD>. Di dalam bagian ini biasanya dimuat tag TITLE yang
menampilkan judul halaman pada titlenya browser. Selain itu Bookmark juga
menggunakan tag TITLE untuk memberi mark suatu web site. Browser menyimpan
“title” sebagai bookmark dan juga untuk keperluan pencarian (searching)
biasanya title digunakan sebagai keyword. Header juga memuat tag META yang
biasanya dapat digunakan untuk menentukan informasi tertentu mengenai dokumen
HTML. Anda bisa menentukan author name, keywords, dan lainnya pada tag META.
Contoh:
<meta name="author"
content="ubuntu-online">
Body
Bagian BODY, yang dinyatakan
dengan tag <BODY>…</BODY>, merupakan tubuh atau isi dari dokumen
HTML di mana anda meletakan informasi yang akan ditampilkan pada browser.
Tag
HTML tidak membedakan penggunaan
huruf besar ataupun huruf kecil dari suatu elemen. Suatu elemen HTML terdiri
dari tag-tag beserta teks yang ada dalam tag-tag tersebut. Tag ini dinyatakan
dengan tanda lebih kecil (<) dan tanda lebih besar (>).
Tag biasanya merupakan suatu
pasangan yang disebut dengan:
Tag awal, dinyatakan dalam bentuk
<nama tag>
Tag akhir, dinyatakan dalam
bentuk </nama tag>
Formatnya: <nama tag> teks
yang ditampilkan </nama tag>.
Contoh: untuk menampilkan teks
dalam format teks miring Teks ini terlihat miring di browser anda dengan
perintah HTML <i>Teks ini terlihat miring di browser Anda</i>
Atribut
Tag awal bisa memiliki beberapa
buah atribut yang menyatakan karakteristik dari tag tersebut. Misalnya, <P
STYLE="text-align:left"> digunakan untuk membuat rata kiri suatu
paragraf. Tag yang digunakan adalah <P> dan atribut yang menyertainya
adalah STYLE dengan nilai "text-align:left". Nilai atribut STYLE ditulis
dalam bahasa CSS.
Fitur HTML 5
FITUR YANG TERDAPAT PADA HTML5
Pada kali ini saya akan berbagi
mengenai fitur apa sajakah yang terdapat pada HTML5, poko bahasan yang lainnya
mengenai HTML5 akan dibahas pada blog lain yang akan saya berikan di bagian
bawah pada postingan ini, semoga bermanfaat 🙂
Sebagai informasi, html5 adalah
generasi berikutnya dari html 4, dimana pada html 5 ini ditambahkan fitur –
fitur baru yang mengedepankan penjalanan konten yang berat pada device dengan
tenaga rendah yang pastinya membuat para programer lebih mudah dalam
menerapkannya dan berakibat lebih user friendly dari sisi pengguna.
Pada HTML5 terdapat fitur elemen
<video>, <audio> dan <canvas>, tetapi juga integrasi dari
konten gambar grafis vektor (yang sebelumnya kita ketahui dengan tag
<object>). Artinya, konten multi media dan grafis dalam website akan
dapat ditangani dan dieksekusi dengan lebih mudah dan lebih cepat, tanpa
membutuhkan plugin dan dan API tambahan. Adapun fitur yang tersedia :
<canvas>, memungkinkan
menggambar menggunakan script kode seperti JavaScript. Dibandingkan dengan
versi terdahulunya yang perlu menggunakan aplikasi tambahan untuk membuat
interaksi seperti flash.
<audio> dan <video>,
merupakan tag penanda untuk konten audio dan video. Jadi kita dapat menyisipkan
konten audio dan video secara langsung, berbeda dengan generasi sebelumnya yang
harus menggunakan flash untuk menyisipkan konten ini.
, digunakan untuk menampilkan
konten interaktif (plugin) atau aplikasi eksternal.
<section>, digunakan untuk
mendefinisikan section apapun pada dokumen. Dapat dikategorikan bekerja seperti
div yang memisahkan section yang berbeda.
<article>, mendifinisikan
artikel, komentar pengguna atau sesuatau konten yang independen.
Local Storage, berfungsi sebagai
pengganti cache sebagai media penyimpan halaman history web. memungkinkan
menyimpan data cache lebih banyak pada local dibanding dengan browser biasa.
Web Workers, pada dasarnya
membuat proses load java script yang kadang kali mengganggui dengan menjadikan
proses lambat menjadi lebih cepat, shingga dapat dilakukan proses multi
tasking.
Semantic , membuat halaman web
lebih dinamis, diantaranya akan menghentikan programer dalam menggunakan tag
div atau nav sebagai navigasi.
