Haii.. sobat Hots WEB, HTML (HyperText Markup Language) adalah bahasa dengan
tanda-tanda khusus yang digunakan di awal era web untuk
menyajikan informasi. HTML merupakan script yang digunakan untuk menyusun/membuat dokumen web yang apabila kita melakukan desain terhadap html berarti kita telah melakukan tindakan pemograman. Namun HTML bukanlah sebuah bahasa pemograman karena hanya berisikan perintah-perintah tertentu agar dapat diakses atau diterjemahkan oleh browser. Jika kita ingin membuat suatu website atau blog maka pengetahuan tentang html ini sangat penting sebagai dasar utama. Secara mendasar, dokumen html mempunyai susunan sebagai berikut:
<html>
<head>
<title>Judul</title>
</head>
<body>
.
.
.
</body>
</html>
Kode HTML diawali dengan <html> dan diakhiri dengan
</html>. Beberapa hal penting dalam kode html :
- Tanda <> menyatakan sebuah tag
- Pada umumnya tag berpasangan. Contohnya <html> dengan
</html>, <head> dengan </head> dan <body> dengan
</body>.
- Tag yang tidak berpasangan antara lain adalah <br>
dan <hr>.
- Pada tag yang berpasangan, tag yang berkedudukan sebagai
tag penutup mempunyai bentuk berupa </>.
Contoh: Ketiklah script di bawah ini kemudian simpan dengan
nama lat1.html.
<head>
<title>Belajar HTML</title>
</head>
<body>
Ini adalah web pertama saya.
</body>
</html>
Untuk melihat hasilnya, silakan jalankan browser favorit
Anda, dengan cara membuka file lat1.html yang sudah Anda buat tadi dengan
menggunakan browser seperti contoh tampilan dibawah ini saya menggunakan
browser Mozila Firefox :
Keterangan:
Tag <TITLE> digunakan untuk memberi judul dokumen
HTML. Judul ini dapat Anda lihat pada pojok kiri atas (title bar) browser.
Ketika orang akan mem-bookmark web Anda, maka judul inilah yang akan disimpan.
Pada contoh di atas judul dokument html yaitu "Belajar HTML"
<BODY> adalah isi dokumen yang akan ditampilkan
dibrowser Anda. Isi dokumen pada contoh di atas adalah " Ini adalah web
pertama saya."
Terdapat dua pilihan dalam mendesain html :
Menuliskan secara manual tag-tag html ke dalam dokumen html.
Bagi para pemula pilihan ini dirasa lebih tepat karena dengan menuliskan
tag-tag html satu persatu maka akan menambah pemahaman mengenai cara kerja dan
perintah-perintah dalam HTML, meskipun cara ini akan menguras banyak waktu
tetapi segala sesuatu tidak ada yang instan oleh karenanya berusaha lebih keras
akan lebih baik dan akan terasa hasilnya ketika kita sudah mampu mengusai html.
Cara manual ini dapat dilakukan dengan menuliskan kode-kode html pada program
editor seperti notepad.
Menggunakan editor praktis yaitu sebuah program khusus yg
didesain untuk membuat, melakukan editing bahkan mempublishnya ke internet.
Adobe dreamweaver merupakan salah satu program yang banyak digunakan oleh para
desainer web dalam mendesain html. Para pemula yang malas untuk belajar kebanyakan
memilih pilihan yang kedua ini karena praktis dan tidak menguras waktu.
Struktur Dasar HTML
Struktur dasar html secara umum terbagi menjadi 2 bagian
yaitu header dan body. Komponen penyusun dari html meliputi tag, elemen, dan
atribut.
Tag
Tag adalah suatu teks khusus (markup) yang terdiri dari dua
karakter yaitu < dan >. 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 biasanya merupakan suatu
pasangan yang disebut dengan : 1. Tag awal, dinyatakan dalam bentuk <nama
tag> 2. Tag akhir, dinyatakan dalam bentuk </nama tag>. Format :
<nama tag> teks yang ditampilkan </nama tag>. Contoh : untuk
menampilkan teks dalam format teks miring Teks ini terlihat miring di browser
anda dengan perintah HTML <i>Teks ini terlihat miring di browser
Anda</i>
Contoh ketiklah kode berikut lalu simpan dengan nama
tag.html
<<html>
<head>
<title>Belajar HTML</title>
</head>
<body>
Ini adalah web pertama saya.
<h1>Ini adalah heading 1</h1>
<h2>Ini adalah heading 2</h2>
<h3>Ini adalah heading 3</h3>
<h4>Ini adalah heading 4</h4>
<h5>Ini adalah heading 5</h5>
<i>tulisan ini terlihat miring</i>
<b>tulisan ini terlihat tebal</b>
<u>tulisan ini bergaris bawah</u>
Maka setelah dokumen tag.html dibuka dengan menggunakan
mozilla firefox maka tampilannya akan seperti gambar di bawah ini.
Sekian Terima Kasiih..