HTML adalah singkatan dari Hyper Text Markup Language.
Hyper Text : metode dimana Anda dapat bergerak leluasa di web -
dengan mengklik pada sebuah teks khusus yang disebut "hyperlink" yang
membawa Anda ke halaman berikutnya. Kata hiper itu sendiri berarti tidak linear
- yaitu Anda dapat pergi ke tempat manapun di Internet kapanpun Anda
inginkan dengan hanya mengklik sebuah link (sebuah teks yang berfungsi
sebagai link).
Markup Language : adalah apa yang tag HTML lakukan dengan text,
ini sama seperti Anda menandai bold text, italics text, headings,
bullets, dst. ( cara penulisan informasi tata letak dalam dokumen ).
Jadi Apa itu HTML ?
"HTML adalah "bahasa ibu" dari browser Anda.
HTML digunakan untuk membuat sebuah website.
Dengan HTML, dapat menggambarkan struktur halaman menggunakan bahasa markup, seperti “paragraph,” “list,” “table,” "heading", "text", "photos", dst.
Web browser (seperti Google Chrome, Internet Explorer, Firefox, Safari) akan membaca dokumen HTML dan menampilkannya sebagai halaman web.
Browser tidak menampilkan tag HTML, tetapi menggunakan tag itu untuk menafsirkan isi halaman web tersebut.
Dengan HTML, dapat menggambarkan struktur halaman menggunakan bahasa markup, seperti “paragraph,” “list,” “table,” "heading", "text", "photos", dst.
Web browser (seperti Google Chrome, Internet Explorer, Firefox, Safari) akan membaca dokumen HTML dan menampilkannya sebagai halaman web.
Browser tidak menampilkan tag HTML, tetapi menggunakan tag itu untuk menafsirkan isi halaman web tersebut.
HTML adalah bahasa markup.
- Sebuah bahasa markup terdiri dari seperangkat markup tag
- Tag menggambarkan isi dokumen (document content)
- Dokumen HTML berisi HTML tags dan plain text (teks biasa)
- Dokumen HTML ini juga disebut halaman web (web page)
Contoh sebuah dokumen HTML sederhana:
<!DOCTYPE html>
<html>
<head>
<title>Judul Website</title>
</head>
<body>
<h1>First Heading</h1>
<p>First paragraph</p>
</body>
</html> Keterangan :
!DOCTYPE deklarasi mendefinisikan jenis/versi dokumen (ini contoh versi terbaru HTML5)
Teks antara tag <head> dan </ head> merupakan wadah untuk semua elemen head
Teks antara tag <title> dan </title> menjelaskan nama/judul website
Teks antara tag <html> dan </ html> menjelaskan halaman webTeks antara tag <body> dan </ body> adalah isi halaman yang terlihat
Teks antara tag <h1> dan </ h1> ditampilkan sebagai judul pertama
Teks antara tag <p> dan </ p> ditampilkan sebagai sebuah paragraf pertama
Tag HTML
- Tag HTML juga biasa disebut dengan markup tag HTML
- Tag HTML adalah kata kunci (nama tag) yang dikelilingi oleh kurung sudut (angle brackets) seperti: <html>
- Tag HTML biasanya diterapkan berpasangan seperti <b> dan </ b>
<b> juga disebut sebagai tag awal/tag pembukaContoh penulisan tag HTML :
</b> disebut juga sebagai tag akhir/tag penutup
<namatag>konten</namatag>
Elemen HTML
Adalah semua yang ada di antara tag pembuka dan tag penutup.| tag pembuka | Element content | tag penutup |
|---|---|---|
| <p> | This is a paragraph | </p> |
| <a href="#"> | This is a link | </a> |
| <body> | elemen isi body | </body> |
Seperti contoh dokumen HTML diatas, terdiri dari 6 elemen HTML, yaitu :
elemen <html>, elemen <head>, elemen <title>, elemen <body>, elemen <h1>,elemen<p>
Di dalam elemen <head> dapat mencakup script, menginstruksikan browser di mana untuk menemukan style sheet, memberikan informasi meta, dan banyak lagi.
Tag HTML yang dapat ditambahkan ke bagian kepala: <title>, <style>, <meta>, <link>, <script>, <noscript>, dan <base>.
Elemen-elemen Head HTML
* Untuk referensi lengkap HTML head elemen, kunjungi : www.w3schools.com/html/html_head.asp
elemen <html>, elemen <head>, elemen <title>, elemen <body>, elemen <h1>,elemen<p>
Elemen <head>
Tag <head> adalah wadah untuk semua elemen head.Di dalam elemen <head> dapat mencakup script, menginstruksikan browser di mana untuk menemukan style sheet, memberikan informasi meta, dan banyak lagi.
Tag HTML yang dapat ditambahkan ke bagian kepala: <title>, <style>, <meta>, <link>, <script>, <noscript>, dan <base>.
Elemen <title>
Tag <title> mendefinisikan judul dokumen.
Elemen <title> diperlukan dalam semua dokumen HTML / XHTML .
Fungsi Elemen <title>:
- menampilkan judul website di toolbar browser
- memberikan judul halaman ketika ditambahkan ke favorit
- menampilkan judul halaman di hasil mesin pencarian (search engine result)
| Tag | Description |
|---|---|
| <head> | Mendefinisikan informasi tentang dokumen |
| <title> | Mendefinisikan judul dokumen |
| <base> | Mendefinisikan sebuah alamat default atau target default untuk semua link pada halaman |
| <link> | Mendefinisikan hubungan antara dokumen dan sumber/resource eksternal, umunya digunakan untuk link ke style sheet |
| <meta> | Mendefinisikan metadata tentang dokumen HTML (page description, keywords, author,robot,index, last modified, dan metadata yang lain) |
| <script> | Mendefinisikan client-side script, seperti Javascript |
| <style> | Mendefinisikan informasi style untuk dokumen, menentukan bagaimana style ditampilkan di browser |
HTML DASAR
HTML Heading (Judul)
HTML Heading ini dituliskan dengan kode tag <h1> sampai <h6>.
<h1>heading 1</h1>
<h2>heading 2</h2>
<h3>heading 3</h3>
<h2>heading 2</h2>
<h3>heading 3</h3>
HTML Paragraf
HTML Paragraf didefinisikan dengan tag <p>.
<p>Paragraf pertama.</p>
<p>Paragraf kedua.</p>
<p>Paragraf kedua.</p>
HTML Link
Link HTML didefinisikan dengan tag <a>.
<a href="http://problogiz.blogspot.com">Problogiz</a>
note: link address ditetapkan dalam atribut href ="..."HTML Images
Gambar HTML didefinisikan dengan tag <img>.
<img src="banner problogiz.png" width="250" height="100">
note: nama file dan ukuran gambar disediakan sebagai atribut.<!DOCTYPE> Declaration
<!DOCTYPE> declaration diperlukan browser untuk menampilkan halaman web (web page) dengan benar.<!DOCTYPE> declaration harus diletakkan pertama dalam dokumen HTML Anda, sebelum tag <html>.
<!DOCTYPE> declaration : mendefinisikan jenis atau versi dokumen ( contoh diatas jenis deklarasi untuk HTML 5)
*Ada berbagai macam dokumen di web, dan browser hanya dapat menampilkan
halaman HTML dengan benar 100% jika ia tahu jenis dan versi HTML yang
digunakan.
HTML5 (HTML vesri Terbaru)
<!DOCTYPE html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
"http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Versi-versi HTML
Sejak awal diciptakan oleh seorang ilmuwan bernama Tim Berners-Lee
pada tahun 1990. Sejarah HTML terus berkembang dengan berbagai macam
versi dan kemajuan. Saat ini mulai diperkenalkan HTML versi terbaru HTML
5. Meskipun belum standar W3C namun, browser utama mendukung banyak
elemen baru HTML5 dan API. HTML5 kabarnya akan direkomendasikan
oleh W3C pada tahun 2014 dan kandidat pengganti versi sebelumnya (XHTML
1.0 dan HTML 4.01)
| Version | Year |
|---|---|
| HTML | 1991 |
| HTML+ | 1993 |
| HTML 2.0 | 1995 |
| HTML 3.2 | 1997 |
| HTML 4.01 | 1999 |
| XHTML 1.0 | 2000 |
| HTML5 | 2012 |
| XHTML5 | 2013 |
