Struktur Dasar dan Komponen Utama Dokumen HTML (HTML bagian 2)

                                             

Struktur Dasar HTML

Seperti umumnya dokumen lain, dokumen  HTML  terdiri dari teks-teks dan bahkan  lebih dari itu.  Dokumen HTML juga dapat mengandung suatu gambar, suara,  ataupun video.  Satu hal yang membedakan dokumen HTML dengan dokumen-dokumen  lainnya adalah adanya elemen-elemen  HTML beserta tag-tagnya. Elemen  dan tag HTML berfungsi untuk menformat atau menandai suatu bagian tertentu dari  dokumen HTML dan juga untuk menentukan struktur bagian tersebut dalam dokumen HTML. Elemen dan Tag inilah yang  merupakan ciri utama dari suatu dokumen  HTML. Secara garis besar, untuk menuliskan sebuah dokumen HTML  dibutuhkan  kerangka penulisan dengan tag-tag dasar, yaitu HTML, HEAD, TITLE dan BODY.

·           HTML : Untuk penanda bahwa dokumen yang dibuat adalah dokumen web

·           HEAD : Untuk judul, boleh ada atau tidak

·           TITLE : Judul untuk masing-masing halaman, ditampilkan di atas browser

·           BODY : Informasi yang ingin dimunculkan diletakkan di bagian ini

Sebagai contoh :

<html>

<head>

<title>teks pada title bar web browser</title>

</head>

<body>

Berisi tentang text, gambar, atau apapun yang

tampil pada dokumen web.

</body>

</html>

Seperti terlihat, struktur file HTML diawali dengan sebuah tag <html> dan ditutup dengan tag </html>. Di dalam tag ini terdapat dua buah bagian besar, yaitu yang diapit oleh tag <head>...</head> dan tag <body>...</body>. Bagian yang diapit oleh tag HEAD merupakan  header dari halaman HTML dan tidak ditampilkan pada browser. Bagian ini berisi tag-tag header  seperti <title>...</title> yang berfungsi untuk mengeluarkan judul pada title bar  window  web browser. Bagian kedua, yang diapit oleh tag BODY merupakan bagian yang akan ditampilkan pada halaman web browser nantinya. Pada bagian ini  akan  dituliskan semua jenis informasi berupa teks dengan bermacam format maupun gambar yang ingin disampaikan kepada pengguna nantinya.

 

Komponen Utama Dokumen HTML

Ada dua komponen utama pembentuk dokumen HTML, dua komponen itu adalah elemen dan tag. Dengan adanya dua komponen ini, maka kita dapat membuat dokumen HTML dengan baik.

1.        Elemen

Dalam dokumen HTML, elemen dibagi menjadi dua kategori utama, yaitu elemen-elemen <HEAD> yang memberikan informasi tentang dokumen tersebut. Elemen <HEAD> ini meliputi judul dokumen atau hubungannya dengan dokumen lain.

Elemen lain yaitu elemen-elemen <BODY> yang menentukan bagaimana isi suatu dokumen ditampilkan oleh browser. Isi elemen  ini misalnya paragraf, list (daftar), tabel dan lain-lain. Di dalam elemen HTML terdiri dari tag-tag beserta teks yang ada dalam tag-tag tersebut.

2.        Tag

Pada saat web browser menampilkan suatu web page, browser tersebut akan membaca teks-teks pada dokumen HTML, dan mencari kode khusus yang disebut tag. Tag diapit oleh tanda <..>. Tag biasanya merupakan pasangan, yang disebut tag awal dan tag akhir. Tag  awal  dinyatakan dalam  bentuk  <nama tag>  sedang tag akhir dinyatakan dalam bentuk  </nama tag>.  Format umum suatu tag berpasangan adalah :


<nama tag> Teks yang akan ditampilkan </nama tag>


Penulisan program yang baik adalah secara terstruktur. Artinya antara tag pertama dan tag berikutnya tidak saling tumpang tindih.

Penulisan Tag yang tumpang tindih :


        <tag1>

                teks tag1

        <tag2>

                teks tag 2

        </tag1>

        </tag2>


Penulisan Tag yang benar :


        <tag1>

            teks tag1

        <tag2>

            teks tag 2

        </tag2>

        </tag1>


Kemungkinan kesalahan yang terjadi pada saat menjalankan program adalah lupa memberi tag awal atau tag akhir, sehingga web page yang dihasilkan akan terlihat lain dari yang diinginkan. Tidak semua tag mengikuti aturan seperti diatas, melainkan terdapat beberapa macam bentuk tag yang  dikenal oleh HTML, dimana umumnya tag-tag dalam HTML muncul dalam bentuk seperti berikut ini :


<nama tag>teks</nama tag>

<nama tag>

<nama tag atribut1=argument  atribut2=argumen

dst>

<nama tag antribut=argumen>teks</nama tag>

 

Baca juga : Elemen Dasar HTML (HTML bagian 3)

 

Ini merupakan lanjutan dari HTML bagian 1 yang merupakan salah satu materi dari matakuliah jurusan sistem informasi, untuk info tentang jurusan silakan kunjungi :

Website Sistem Informasi

WebsiteUniversitas Dharma Andalas


Share this

Related Posts

Previous
Next Post »