HTML
HTML
digunakan untuk membangun suatu halaman web. Sekalipun banyak orang menyebutnya sebagai suatu bahasa pemrograman, HTML sama sekali bukan bahasa
pemrograman,
tapi merupakan bahasa markup (penandaan), terhadap sebuah dokumen
teks.
Simbol markup yang digunakan oleh HTML ditandai dengan tanda lebih kecil ( <
)
dan tanda
lebih besar ( > ) yang biasa disebut tag.
1. Dokumen
dan Penamaan HTML
Sebuah
file HTML merupakan file teks biasa yang mengandung tag-tag HTML. Karena
merupakan file
teks, maka HTML dapat dibuat dengan menggunakan teks editor yang
sederhana,
misalnya notepad. Dapat juga menggunakan HTML editor yang bersifat
WYSIWYG ( What You See Is What You Get ),
misalnya Frontpage atau Dreamwaver.
Untuk
menandai bahwa sebuah file teks merupakan file HTML, maka ciri yang paling
nampak
jelas adalah ekstensi filenya, yaitu .htm atau .html. Dalam pemberian nama
sebuah
dokumen bersifat case sensitive sehingga dokumen dengan nama a.html
akan
berbeda
dengan dokumen A.html.
2. Elemen
dan Tag HTML
Elemen
HTML yaitu komponen penyusun terkecil dari sebuah dokumen HTML. Untuk
menandainya.
Elemen dapat berupa teks murni, atau bukan teks, atau keduanya.
Untuk
menandai sebuah elemen dalam suatu dokumen HTML digunakan tag. Tag HTML
terdiri
dari sebuah simbol lebih kecil ( < ) dan dan lebih besar ( > ).
Nama
elemen ditunjukkan oleh nama dari tagnya. Suatu elemen biasanya ditandai dengan
pasangan
tag, walaupun ada beberapa nama elemen yang ditandai dengan satu tag tanpa
harus
berpasangan. Diantaranya:
• Image ( <img /> )
• Ganti Baris – Break ( <br /> )
• Horizontal Rule ( <hr /> )
• Input Field ( <input /> )
Tag dapat
mempunyai atribut. Atribut mendefinisikan sesuatu tentang tag tersebut. Atribut
digunakan
untuk mengubah default pemformatan dokumen dengan tag yang
bersangkutan.
Struktur
Element Struktur Dasar HTML
3.
Penggunaan Tag dan Atributnya
Dalam
pembuatan dokumen HTML penulisan elemen yang diawali dan diakhiri tanda tag
HTML,
memiliki syarat penulisan yaitu:
• Tag HTML diapit dengan dua karakter kurung sudut ( < dan > )
• Tag HTML secara normal selalu berpasangan misal
(<i>...</i>)
• Tag pertama dalam suatu pasangan adalah tag awal, dan tag yang
kedua
merupakan
tag akhir.
• Tag html tidak case sensitive. Ini artinya <b> sama dengan <B>
• Jika dalam suatu tag terdapat tag lain, maka penulisan tag akhir
tidak boleh
bersilang
dan harus berurutan. Misalnya <b><I>..Tebal dan
Miring..</I></b> 4. Tag Dasar HTML
4.1 HTML
Merupakan
tag dasar yang mendifinisikan bahwa dokumen adalah dokumen html. Tag ini
merupakan
suatu keharusan bagi pemrogram web untuk menuliskannya sebagai tag
pertama
dalam dokumen html. Penulisan tag seperti berikut ini :
<html> pada awal dokumen dan </html> pada akhir dokumen
4.2 Head
Bagian
Head sebenarnya tidak harus ada pada dokumen HTML, tetapi pemakaian head
yang benar
akan meningkatkan kegunaan suatu dokumen HTML. Isi bagian head –
kecuali
judul dokumen – tidak akan terlihat oleh pembaca dokumen tersebut. Penulisan
tag
seperti berikut ini :
<head> di awal setelah <html> dan </head> di akhir section head.
Elemen-elemen
pada bagian head akan mengerjakan tugas-tugas sebagai berikut :
• Menyediakan judul dokumen
• Menjembatani hubungan antar dokumen
• Memberitahu browser untuk membuat form pencarian
• Menyediakan metode untuk mengirim pesan ke tipe browser
Elemen
yang mungkin terdapat pada bagian head :
• Tag <title>, digunakan untuk memberi judul dokumen. Penggunaannya adalah
sebagai
berikut :
<title>Judul Dokumen</title>
• Tag <base>, digunakan untuk menentukan basis URL sebuah dokumen. Contoh
penggunaannya
adalah sebagai berikut berikut :
<base href="//www.alamat.com/direktori" />
3
• Tag <link>, digunakan untuk menunjukkan relasi antar dokumen HTML.
Tag ini
mempunyai beberapa atribut :
Contoh penggunaannya adalah sebagai berikut:
<link rel="stylesheet" href="http://alamat.com/style.css" type="text/css" />
• Tag <meta>, digunakan untuk mendefinisikan informasi-informasi di luar HTML
Informasi meta dapat digunakan oleh browser untuk menjalankan suatu aktivitas
yang belum didukung oleh HTML.
Tag <meta> mempunyai atribut :
Untuk
lebih memperjelas penggunaan atribut tag <META>
perhatikan contoh
berikut
ini :
<meta http-equiv="refresh" content="60" url="www.alamat.com" />
Perintah
diatas akan diterjemahkan oleh browser sebagai “tunggu 60 detik,
kemudian
panggil dokumen baru pada www.alamat.com". Jika atribut URL tidak
disertakan,
maka halaman itu sendiri yang akan dipanggil, jadi setara dengan
mengklik
tombol Refresh / Reload pada browser.
Penggunaan
elemen <meta> yang paling populer adalah penggunaan properti
Keyword
dan Description. Kedua properti ini sangat berguna untuk membantu kerja
search
engine. Biasanya search engine akan menggunakan teks yang disebutkan
pada
properti Keyword untuk mengindeks dokumen dan menggunakan teks yang
terdapat
pada properti Description untuk mendeskripsikan indeks tersebut.
4.3 BODY
Bagian
BODY merupakan isi dari dokumen HTML. Semua informasi yang akan
ditampilkan,
mulai dari teks, gambar, sound, dan lain-lain, akan ditempatkan di bagian ini.
Seperti
telah disebutkan di atas, bagian BODY diawali oleh tag <body> dan ditutup
</body>.
Atributnya:
01.latihan_01.html
4.4 Memberikan Komentar
Untuk
mempermudah pembacaan kembali kode-kode HTML, kadang-kadang
ditambahkan
komentar ke dalam sebuah dokumen. Agar komentar tidak dapat dibaca
pada
browser, maka harus digunakan tanda khusus, yaitu <!-- dan diakhiri dengan tanda -->.
01.latihan_0 2 .htm l
4.5 Memformat Dokumen HTML
Dalam HTML
terdapat beberapa tag yang dapat digunakan untuk memformat dokumen.
Tag-tag
tersebut diantaranya adalah :
• Tag <h#>, membuat heading sebuah
dokumen. Nilai n berkisar antara 1 hingga 6.
01.latihan_0 3 .htm l
• Tag <br />, membuat baris baru, tidak memerlukan penutup </br>
• Tag <p>, memulai paragaraf baru.
• Tag <hr />, membuat garis batas
horizontal, tidak memerlukan penutup </hr>
01.latihan_0 4 .htm l
• Tag <pre>, membuat tampilan dokumen HTML pada browser sama dengan
tampilan
pada teks editor. Dengan tag <pre>, maka tag <p> dan tag <br /> jadi
tidak
diperlukan lagi.
01.latihan_0 5 .htm l
• Tag <center>, Teks rata tengah
• Tag <ul> dan <ol>
Pemformat
dokumenlain yang akan sangat banyak berguna adalah LIST (daftar).
Ada
dua macam daftar, yaitu ORDERED lists (ol) dan UNORDERED lists (ul).
01.latihan_0 6 .htm l
4.6 Memformat Karakter
Melakukan
format terhadap karakter yang ditampilkan akan sangat berguna untuk
membuat
sebuah dokumen menjadi menarik dan informatif.
4.6.1 Logical Format
Logical
format akan menerapkan layout dokumen secara logis dan terstruktur. Semua tag
ini
memerlukan tag penutup. Tag-tag yang termasuk logical format adalah sebagai
berikut :
• <cite>, digunakan untuk menandai
suatu kutipan (citation).
• <code>, digunakan untuk menampilkan
kode-kode pemrograman, misalnya bahasa
C.
• <em>, digunakan untuk menandai
suatu teks yang ditekankan (cetak miring) oleh
penulis.
• <kbd>, digunakan untuk menandai
suatu teks yang harus dimasukkan oleh user
melalui
keyboard.
• <samp>, digunakan untuk menandai
suatu teks yang dimaksudkan sebagai contoh.
• <strong>, digunakan untuk menandai
bagian yang penting (cetak tebal) dari suatu
teks.
• <var>, digunakan untuk menampilkan
nama variabel.
• <dfn>, digunakan untuk menandai
sebuah subdefinisidari daftar definisi.
4.6.2 Physical Format
Physical
format adalah format terhadap fisik suatu font. Semua tag ini memerlukan tag
penutup.
Tag-tag yang termasuk physical format adalah sebagai berikut :
• <b>, untuk menampilkan huruf
tebal.
• <i>, untuk menampilkan huruf
miring.
• <u>, untuk menampilkan garis
bawah pada teks. <tt>, untuk menampilkan huruf
seperti
huruf mesin ketik.
• <strike>, untuk menampilkan garis
horizontal pada bagian tengah huruf.
• <big>, untuk menampilkan ukuran
huruf yang lebih besar.
• <small>, untuk menampilkan ukuran
huruf yang lebih kecil.
• <sub>, untuk menampilkan
subscript.
• <sup>, untuk menampilkan
superscript.
01.latihan_0 7 .htm l
0 komentar:
Post a Comment