Lebih dalam mengenai Struktur HTML
Pada dasarnya elemen HTML ada 2 kategori:
1. Elemen berfungsi untuk memberikan informasi atau mendeklarasikan dokumen tersebut.
2. Elemen berfungsi untuk menentukan bagaimana isi suatu dokumen ditampilkan pada browser.
Terus alat apa saja yang digunakan untuk membuat web HTML ? Ada 2 alat yang digunakan untuk membuat web HTML,antara lain :
1. Browser
Browser merupakan software yang di install di mesin client (komputer kita sebagai
pengguna website) yang berfungsi untuk menterjemahkan tag-tag HTML menjadi halaman web. Contoh browser Internet Explorer, Mozila, opera dan masih banyak yang lainya.
2. Editor
Editor adalah program yang bisa digunakan untuk membuat document HTML (Webpage/Halaman Web), ada banyak HTML editor yang bisa anda gunakan diantaranya: Ms FrontPage, Dreamweaver, Notepad, dll.
Struktur HTML
Struktur HTML
Bagaimana Struktur HTML itu sendiri ? HTML memiliki struktur dasar seperti di bawah ini:
<html>
<head>
<title>Belajar HTML</title>
</head>
<body>
Hallo Word!
</body>
</html>
Keterangan :
<html>....</html> : Merupakan tag pembuka dari dokumen html.Ini merupakan elemen paling penting dalam html,tanpa ini maka anda tidak bisa membuat desain web.
<head>...</head> :Merupakan kepala atau head dari dokumen html.Biasanya di dalam head,berisi tag <title>...</title> dan <script>....</script>
<title> ... </title> : Merupakan tag untuk memberikan judul pada dokumen html.
<body> ... </body> : Merupakan body atau tubuh dari dokumen html. Segala sesuatu yang ingin ditampilkan di dokumen html disimpan dalam tag body ini.
Catatan :Struktur HTML tadi, cukup Anda tuliskan ulang, kemudian pindahkan ke editor favorit anda, lalu simpan dan berikan nama filenya yakni nama-file.html
Tag dan Atribut
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>.
Tag awal bisa memiliki beberapa buah atribut yang menyatakan karakteristik dari tag tersebut. Misalnya,
Pada contoh ini tagnya memiliki nama <a> sedangkan atribut untuk tag <a> adalah href dan title. Sehingga baik nama tag dan atributnya harus berada di dalam tanda <…> seperti pada contoh.
<P ALIGN=”left”> digunakan untuk membuat rata kiri suatu paragraf. Tag yang digunakan adalah <P>
dan atribut yang menyertainya adalah ALIGN dengan nilai left. Nilai
atribut ALIGN hanya bisa berupa center, left, right atau justify.
Dalam sintak penulisan tag pada HTML,ada aturan-aturan yang harus diikuti dan dipahami.Penulisan Tag dalam HTML mengikuti
aturan-aturan sebagai berikut:
a) Setiap tag mempunyai nama yang
spesifik. Kadang-kadang diikuti opsi-opsi yang disebut atribut. Baik nama
maupun opsi harus berada dalam tanda <..>.
Contoh: <a
href="/wiki/PHP" title="PHP">PHP</a>
Pada contoh ini tagnya memiliki nama <a> sedangkan atribut untuk tag <a> adalah href dan title. Sehingga baik nama tag dan atributnya harus berada di dalam tanda <…> seperti pada contoh.
b) Sebagian besar tag berpasangan.
Penulisan untuk tag yang berpasangan adalah sebagai berikut : <namatag>….</namatag>
Contoh:
<TITLE>Paragraf</TITLE>
<strong>Cetak
Tebal</strong>
Pada tag yang berpasangan seperti
pada contoh ini, <TITLE>
adalah
tag awal dan </TITLE>
adalah
tag akhir. Perhatikan tanda / pada tag akhir.
c) Nama tag dan atribut-nya tidak
bersifat case sensitive. Penulisan <strong>Cetak Tebal</strong> memberikan hasil
yang sama dengan <STRONG>Cetak
Tebal</STRONG>.
d) Penulisan atribut suatu tag
diletakkan setelah nama tag. Jika ada lebih dari satu atribut maka digunakan spasi untuk
memisahkan. Urutan atribut tidak penting.
Contoh:
<FONT SIZE=3>Teks
Baru</FONT>
<FONT SIZE=5
FACE=“verdana“>Teks Baru </FONT>
e) Nilai dari atribut ditulis setelah
tanda sama dengan (=). Pada contoh sebelumnya (lihat bagian d) terlihat bahwa
atribut SIZE
dari
tag FONT memiliki nilai 5 sedangkan atribut FACE memiliki nilai “verdana”.
f) Jika nilai dari atribut hanya
tunggal, maka kita langsung menuliskan setelah tanda =. Jika lebih dari satu
maka dapat digunakan tanda ‘… ‘ atau “…”. Pada contoh bagian d, tampak bahwa
penulisan nilai untuk atribut SIZE tanpa menggunakan tanda “..”, sedangkan pada
atribut FACE
tanda
“..” untuk menandai kata verdana.
Berikut ini tag-tag yang banyak digunakan dalam HTML :
1. BACKGROUND
Atribut ini digunakan untuk mengeset gambar untuk digunakan sebagai latar
belakang pada sebuah halaman. Kita cukup menggunakan atribut berikut untuk
memilih sebuah gambar untuk dijadikan latar belakang. Cara penulisannya
adalah sebagi berikut:
<body background="url gambar/lokasi penyimpanan gambar">
Contoh:
<html>
<head>
<title>Judul Dokumen</title>
</head>
<body background="images/bg.jpg">
</body>
</html>
2. BGCOLOR
Bgcolor menentukan warna latar belakang dari halaman web. Misalnya, untuk mengatur warna latar belakang halaman agar berwarna merah, kita dapat menggunakan tag berikut :
<body bgcolor="#222222” >
3. HYPERLINK (<a>)
Atribut ini berguna untuk menentukan halaman yang akan dituju dengan mengklik link tersebut.
Contoh : <a href="home.html">Beranda</a>
Keterangan : href =halaman yang akan dituju.
4.LINEBREAK (<br>)
Tag ini digunakan untuk membuat baris baru pada suatu paragraf di dalam dokumen HTML.
5.PARAGRAF (<p>)
Tag ini digunakan untuk membuat paragraf dalam dokumen HTML.
Setelah anda membaca artikel ini,diharapkan anda bisa memahami struktur dasar HTML sehingga bisa menjadi pondasi untuk membuat dokumen HTML.
Terima kasih atas kunjungan anda.
Tidak ada komentar:
Posting Komentar