Setiap bahasa komputer pasti memiliki strukturnya tersendiri, termasuk HTML. Dalam HTML, struktur dasar tersebut terdiri dari DTD (Document Type Declaration) atau DOCTYPE, tag HTML itu sendiri, tag head dan tag body, walaupun HTML tidak hanya berisi struktur dasar tersebut.
Sebagai contoh, buka teks editor kalian dan ketik script berikut ini.
<!DOCTYPE html>
<html>
<head>
<title>Judul Halaman</title>
</head>
<body>
<p>Paragraf</p>
<p>Hello World!</p>
</body>
</html>
Hasil di web browser.
.png)
Berikut penjelasan untuk setiap struktur dasar dalam HTML berdasarkan contoh diatas.
DTD atau DOCTYPE
DTD atau DOCTYPE merupakan tag paling awal dari HTML. Ini untuk memberitahu kepada web browser bahwa dokumen yang akan diproses adalah HTML. DOCTYPE ditulis tergantung versi HTML yang digunakan. Dalam contoh diawal menggunakan HTML5 sebagai versi terbaru yang ditulis sebagai <!DOCTYPE html>. Sebelum versi ini digunakan, DTD ditulis lebih kompleks dalam penulisannya karena harus merujuk pada DTD yang digunakan. Misalnya pada HTML 4.01 ditulis sebagai berikut.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
Dimana dari contoh diatas, DTD ini mencantumkan versi HTML yang digunakan, yakni "HTML 4.01 Transitional//EN", lalu diikuti dengan link dimana aturan DOCTYPE berada, yakni "http://www.w3.org/TR/html4/loose.dtd".
Bila ini tidak ditulis, web browser akan tetap memproses halaman website seperti tidak ada masalah apapun. Namun browser sedang membaca dokumen tersebut dalam mode "quirk mode" dimana halaman website ditampilkan secara berbeda. Quirk mode merupakan mode dalam browser yang menganggap HTML tersebut sudah usang, karena penulisan tanpa DTD digunakan untuk browser-browser lama yang belum ada standar baku dari W3C (World Wide Web Consortium) dan IEF (Internet Engineering Task Force) dalam standarisasi penulisan dokumen HTML.
Tag <html>
Ini merupakan tag pembuka dari keseluruhan halaman web. Semua kode HTML termasuk struktur dasar berikutnya harus ditulis dalam tag <html> ini. Dalam contoh diatas, tag <html> berisi seluruh tag yang berada di bawahnya, seperti <head>, <title>, <body> dan <p> beserta tag penutupnya.
Tag <head>
Ini merupakan bagian kepala dari HTML. Umumnya disini ditulis berbagai definisi dari halaman website, seperti judul website, CSS, bahasa halaman website, dan kode-kode lainnya yang tidak tampil di browser. Dalam contoh diatas, <head> berisi <title> yang akan menampilkan judul halaman website.
Tag <body>
Tag ini merupakan bagian badan dari HTML. Semua elemen pada website, seperti paragraf, gambar, video, dll. akan ditampilkan dalam tag ini. Dalam contoh diatas, <body> berisi <p> yang merupakan tag untuk menampilkan paragraf.
Mayoritas waktu dalam merancang tampilan website akan dihabiskan di bagian ini. Perhatikan bahwa hampir setiap elemen akan diakhiri dengan penutup tag ini, termasuk <body> yang ditutup dengan </body>, kecuali tag yang bersifat self-closing tags.
Kesimpulan
Struktur-strukur dasar ini adalah strukur yang sangat sederhana dan harus ada dalam HTML. Sebuah halaman web bisa puluhan bahkan hingga ribuan baris, yang ditulis dengan berbagai elemen HTML. Saat ini, web browser "memaafkan" cara penulisan seperti tanpa tag penutup, penulisan kalimat diluar tag body, dll. dan browser akan tetap menampilkannya seperti tidak ada kesalahan. Namun hal ini akan berpengaruh bila sudah menggunakan bahasa HTML yang kompleks dan bahkan melibatkan CSS, PHP atau JavaScript.
0 Komentar