06 - Cara Menciptakan Struktur Dasar Html
Pada tutorial berguru HTML dasar sebelumnya kita telah mempelajari Pengertian Tag, Elemen, dan Atribut pada HTML. Dalam tutorial kali ini aku akan membahas wacana cara menciptakan struktur dasar halaman HTML.
Struktur Dasar HTML
Setiap halaman HTML setidaknya mempunyai struktur dasar yang terdiri dari : Tag DTD atau DOCTYPE, tag html, tag head, dan tag body. Inilah yang merupakan struktur paling dasar dari HTML, walaupun HTML tidak hanya berisi struktur tersebut.
Agar lebih gampang memahaminya, silahkan buka text editor (Notepad++), kemudian ketikkan instruksi berikut ini:
Contoh struktur dasar HTML:
<!DOCTYPE html> <html> <head> <title>Title dari Websiteku</title> </head><body> <p>Selamat Pagi Dunia, Hello World!</p></body></html> Save sebagai halaman.html dan jalankan file dengan cara double klik file tersebut, atau klik kanan –> Open With –> Firefox. Kita akan membahas tag-tag yang ditulis tersebut pada tutorial kali ini.
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Jika kita tidak menuliskan DTD, browser akan tetap menampilkan dan memproses halaman web kita ibarat tidak terjadi apa-apa. Namun browser sebetulnya menjalankan halaman HTML tersebut pada mode khusus yang disebut quirk mode.
Pada quirk mode, web browser menerjemahkan halaman web (terutama instruksi CSS) sedikit berbeda dari seharusnya. Ini alasannya web browser menganggap bahwa saat DTD tidak ditemuka, halaman tersebut kemungkinan besar merupakan halaman web usang. Agar halaman ‘usang’ ini tetap tampil baik, web browser perlu memakai aturan-aturan yang berbeda, yakni: quirk mode.
Cara untuk mengetahui apakah web browser berjalan pada quirk mode atau standard mode lebih gampang jikalau memakai web browser Mozilla Firefox. Pada Firefox, klik kanan pada halaman web, kemudian pilih Page Info. Pada bab Render Mode akan terlihat apakah quirk mode, atau standard mode.
Setelah DTD, tag berikutnya ialah tag <html>. Ini ialah tag pembuka dari keseluruhan halaman web. Semua instruksi HTML harus berada di dalam tag ini. Tag html dimulai dengan <html> dan diakhiri dengan </html>
Tag <head>
Elemen pada tag <head> umumnya akan berisi banyak sekali definisi halaman, ibarat instruksi CSS, JavaScript, dan kode-kode lainnya yang tidak tampil di browser.
Tag <title> dalam teladan kita sebelumnya dipakai untuk menampilkan title dari sebuah halaman web. Title ini biasanya ditampilkan pada bab paling atas web browser. Contohnya pada tampilan halaman.html, ‘Title dari Websiteku’ akan ditampilkan pada tab browser.
Tag <body>
Tag <body> akan berisi semua elemen yang akan tampil dalam halaman web, ibarat paragraf, tabel, link, gambar, dll. Tag body ini ditutup dengan </body>. Sebagian besar waktu kita dalam merancang web akan dihabiskan di dalam tag <body> ini.
Perhatikan bahwa setiap tag akan diakhiri dengan epilog tag. Termasuk <html> yang merupakan tag paling awal dari sebuah halaman web.
Stuktur HTML yang kita bahas disini ialah struktur yang sangat sederhana. Sebuah halaman web dapat mempunyai ratusan bahkan ribuan baris, yang ditulis dengan banyak sekali tag HTML. Tag pertama yang akan kita bahas dalam tutorial berikutnya ialah tag <p> yang dipakai untuk menciptakan paragraf di dalam HTML.
Pembahasan selanjutnya kita akan membahas "Tag Paragraf HTML"
Dosen Desain Web 1 | Muqorobin, S.Kom
