HTML adalah sebuah ‘markup language’ untuk mendeskripsikan dokumen web (halaman web).
- HTML merupakan singkatan dari ‘Hyper Text Markup Language’.
- ‘Markup Language’ adalah kumpulan tag markup.
- Halaman HTML dideskripsikan oleh tag HTML.
- Setiap ‘Tag HTML’ mendeskripsikan konten halaman yang berbeda.
Contoh Dokumen HTML sederhana
<!DOCTYPE html> <html> <head> <title>Page Title</title> </head> <body> <h1>Ini Tulisan Heading</h1> <p>Ini Tulisan Paragraf.</p> </body> </html>
Penjelasan Singkat
- Deklarasi ‘DOCTYPE’ mendefinisikan tipe dokumen yang menjadi HTML.
- Teks antara <html> dan </html> mendeskripsikan sebuah dokumen HTML.
- Teks antara <head> dan </head> memberikan penjelasan tentang dokumen.
- Teks antara <title> dan </title> memberikan sebuah judul untuk dokumen.
- Teks antara <body> dan </body> mendeskripsikan konten halaman yang nampak.
- Teks antara <h1> dan </h1> mendeskripsikan sebuah heading (tajuk).
- Teks antara <p> dan </p> mendeskripsikan sebuah paragraf.
Penggunaan deskripsi ini, ‘Web Browser’ dapat menampilkan sebuah halaman dengan tajuk (heading) dan paragraf.
Tag HTML
Tag HTML adalah kata kunci (nama tag) yang diapit dengan kurung sudut ‘< >’.
<nama tag> konten </nama tag>
- Tag HTML biasanya berpasangan seperti <p> dan </p>.
- Sepasang tag, pasangan yang pertama adalah ‘tag awal’, sedangkan pasangan tag yang kedua adalah ‘tag akhir’.
- ‘Tag akhir’ ditulis seperti ‘tag awal’, tapi ditambah dengan garis miring ‘ / ’ sebelum nama tag.
‘Tag awal’ sering disebut ‘tag pembuka’ (opening tag). Sedangkan ‘tag akhir’ sering disebut ‘tag penutup’ (slosing tag).
Web Browser
Tujuan web browser (Chrome, IE, Firefox, Safari) adalah untuk membaca dokumen HTML dan menampilkannya.
Browser tidak menampilkan ‘tag HTML’, akan tetapi menggunakannya untuk mementukan bagaimana cara untuk menampilkan dokumen.
Struktur Halaman HTML
Di bawah ini merupakan visualisasi struktur halaman HTML.
Browser hanya menampilkan warna putih pada area <body>.
Deklarasi <!DOCTYPE>
- Deklarasi <!DOCTYPE> membantu browser agar menampilkan halaman web secara tepat.
- Ada beberapa tipe dokumen yang berbeda pada web.
- Untuk menampilkan sebuah dokumen secara tepat, browser harus mengetahui kedua tipe dan versi itu.
- Deklarasi ‘DOCTYPE’ tidak tergolong ‘case sensitive’. Jadi semua bentuk dapat diterima.
<!DOCTYPE html> <!DOCTYPE HTML> <!doctype html> <!Doctype Html>
Contoh diatas menunjukkan tidak ada efek, hanya karena perbedaan penulisan huruf besar dan huruf kecil.
‘Case Sensitive’ : Tulisan akan dibedakan antara huruf besar dan huruf kecil.
Deklarasi Umum
HTML5
<!DOCTYPE html>
HTML 4.01
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
XMTML 1.0
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
"Semua tutorial dan contoh kita akan menggunakan HTML5".
Versi HTML
Pada masa-masa awal perkembangan web, ada banyak versi HTML.
Version
|
Year
|
HTML
|
1991
|
HTML 2.0
|
1995
|
HTML 3.2
|
1997
|
HTML 4.01
|
1999
|
XHTML
|
2000
|
HTML5
|
2014
|
English Version: http://www.w3schools.com/html/html_intro.asp
