Belajar Mengenal Dasar - Dasar Html
HTML
HTML merupakan kependekan dari Hypertext Markup Language yaitu sebuah bahasa markah yang dipakai untuk menciptakan sebuah halaman web. HTML disimpan dalam fomat text reguler dan mengandung tag - tag yang memerintahkan web browser untuk mengeksekusi perintah - perintah yang di spesifikasikan. Bermula dari sebuah bahasa yang sebelumnya banyak dipakai di dunia penerbitan dan percetakan yang disebut dengan SGML (Standard Generalized Markup Language), HTML kali ini dipakai secara luas untuk menampilkan halaman web yang didefinisikan dan dikendalikan penggunaannya oleh World Wide Web Consortium (W3C).
Struktur Dasar HTML
Tampilan Struktur Dasar HTML <!DOCTYPE html>
<html>
<head>
<title>Disini judul Halaman</title>
</head>
<body>
Disini Penulisan info WEB
</body>
</html>
<html>
<head>
<title>Disini judul Halaman</title>
</head>
<body>
Disini Penulisan info WEB
</body>
</html>
Penjelasan :
- HTML Untuk menyatakan kepada browser bahwa dokumen web yang dipakai yaitu HTML.
- HEAD
- BODY
- TAG Tag yaitu teks khusus (markup) berupa 2 huruf “<” (lebih kecil) dan “>” (lebih besar).
- Tag awal, dinyatakan dalam bentuk <nama tag>
- Tag akhir, dinyatakan dalam bentuk </nama tag>
- Atribut
Sintaks :
<html>
.....
</html>
.....
</html>
Merupakan kepala dari dokumen HTML, yang diapit oleh tag <head></head> terletak diantara tag <html></html>. Biasanya dimuat oleh tag TITLE yang menampilkan judul halaman pada title browser, Tag TITLE biasanya dipakai sebagai keyword.
Sintaks :
<head>
.....
</head>
.....
</head>
Tag BODY ini merupakan badan atau isi dari dokumen HTML, yang diapit oleh tag <body></body>. Tag body memiliki atribut - atribut yang biasanya menspesifikasikan khususnya warna dan latar belakang dokumen yang akan ditampilkan di browser.
Sintaks :
<body>
.....
</body>
.....
</body>
Tag biasanya merupakan suatu pasangan yang disebut dengan :
Contohnya : <title> Judul HTML </title>
Tag - tag yang tertulis secara berpasangan pada suatu element HTML, dilarang tumpang tindih dengan pasangan tag - tag lainnya.
Contoh penulisan tag yang benar.
<html>
<body>
.....
</body>
</html>
<body>
.....
</body>
</html>
Contoh penulisan tag yang salah.
<html>
<body>
.....
</html>
</body>
<body>
.....
</html>
</body>
Atribut yaitu karakteristik aksesori pada suatu TAG yang mendefinisikan properti dari suatu element HTML. Secara umum nilai atribut harus berada dalam tanda petik satu atau dua.
Misalnya : <body bgcolor="red" align="right"> akan menampilkan latar belakang halaman web menjadi merah dan text akan menciptakan rata kanan.
Membuat File HTML
Untuk menyunting dan menyimpan arahan penulisan HTML kita dapat memakai software teks editor ibarat Noteped, Noteped ++, DreamWeaver, atau yang lainnya. Dan biar dapat di tampilkan ke browser simpan dengan ekstensi .html atau .htm (Contoh : index.html atau index.htm) biasanya yang paling sering dipakai .html.
Contoh Sederhana menampilkan web HTML :
- Menggunakan HTML 4
- Menggunakan HTML 5
<!DOCTYPE HTML>
<html>
<head>
<title>Mas Fery’s</title>
</head>
<body bgcolor="green">
<b>Hallo!</b>
<p align="center">Belajar Mengenal dasar - dasar HTML</p>
</body>
</html>
<html>
<head>
<title>Mas Fery’s</title>
</head>
<body bgcolor="green">
<b>Hallo!</b>
<p align="center">Belajar Mengenal dasar - dasar HTML</p>
</body>
</html>
Simpan Maka akan menampilkan di browser berikut ini.
HTML versi 4 |
<!DOCTYPE HTML>
<html>
<head>
<title>Mas Fery’s</title>
</head>
<body style="text-align:center;">
<b>Hallo!</b>
<p style="color:red; text-align:right;">Belajar Mengenal dasar - dasar HTML</p>
</body>
</html>
<html>
<head>
<title>Mas Fery’s</title>
</head>
<body style="text-align:center;">
<b>Hallo!</b>
<p style="color:red; text-align:right;">Belajar Mengenal dasar - dasar HTML</p>
</body>
</html>
Akan tampil dibrowser berikut ini.
HTML versi 5 |
Catatan :
Keduanya sama saja hasilnya. Biasanya untuk media pembelajaran disekolah - sekolah memakai HTML 4.
Akhir Kata
Demikian Belajar Mengenal Dasar - Dasar HTML semoga yang benar-benar ingin paham perihal pembuatan website banyak - banyaklah latihan niscaya akan gampang dikuasai dan hafal diluar kepala amin. Terima Kasih!
Referensi :
- Petanikode
- wikipedia