Dalam membuat halaman HTML harus mempunyai struktur dasar yaitu: tag DOCTYPE, tag html, tag head, dan tag body. Meskipun struktur HTML tidak hanya terdiri dari struktur tersebut. Secara sederhana HTML terdiri dari header dan body, yang diawali dengan penulisan <!DOCTYPE html> kemudian tag pembuka <html> dan tag akhir </html>.
Baca Juga !!
Struktur Dasar HTML
Setiap halaman website memiliki struktur tersendiri, dimana struktur struktur dasar itu berupa tag yaitu DOCTYPE, tag html, tag head, dan tag body. Ini merupakan struktur dasar pada HTML yang kita akan gunakan untuk membuat halaman website HTML. Agar lebih paham strukur yang ada pada HTML kita bisa lihat contoh dibawah ini sebagi berikut:
- <!DOCTYPE html>
- <html>
- <head>
- <title>Arm4nChannel/Title dari Websiteku</title>
- </head>
- <body>
- <p>Tutorial ini tentang struktur dasar HTML</p>
- </body>
- </html>
Save sebagai
halaman.html dan jalankan file dengan cara double klik file tersebut,
atau klik kanan –> Open With –> Firefox. Hasil saat dijalankan di
browser:
Pengertian DOCTYPE
Doctype adalah
sebuah deklerasi yang digunakan untuk mengedentifikasikan suatu jenis
dokemen HTMK yang digunakan sehingga web browser yang kiita gunakan
dapat menentukan bagaimana memperlakukan Doctype ini. Untuk mengetahui
susunan HTML yang pertama kali kita temukan dan harus dipelajari yaitu Doctype, lihatlah kode dibawah ini agar lebih jelas memahaminya:
<!DOCTYPE html PUBLIC "-//W3C// DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Dimana kode di atas merupakan jenis XHTML 1.0 yang mana dokumen dengan deklarasi kode HTML-Nya yang akan diperlukukan dengan sangat ketat sesuai dengan rekomendasi dari W3C Jika kita tidak menuliskan DTD,
browser akan tetap menampilkan dan memproses halaman web kita seperti
tidak terjadi apa-apa. Namun browser sebenarnya menjalankan halaman HTML tersebut pada mode khusus yang disebut quirk mode.
Pada quirk mode, web browser menerjemahkan halaman web (terutama kode CSS) sedikit berbeda dari seharusnya. Ini karena web browser menganggap bahwa ketika DTD tidak
ditemuka, halaman tersebut kemungkinan besar merupakan halaman web
usang. Agar halaman ‘usang’ ini tetap tampil baik, web browser perlu
menggunakan aturan-aturan yang berbeda, yakni: quirk mode.
Cara
untuk mengetahui apakah web browser berjalan pada quirk mode atau
standard mode lebih mudah jika menggunakan web browser Mozilla Firefox.
Pada Firefox, klik kanan pada halaman web, lalu pilih Page Info. Pada
bagian Render Mode akan terlihat apakah quirk mode, atau standard mode.
Pengertian Tag <html>
Tag <html> merupakan tag pembuka untuk keseluruhan halaman web. Semua elemen dan attribut ataupun kode HTML harus berada di tag <html>. Tag ini akaan diakhiri dengan </html>.
Pengertian Tag <head>
Tag <head> adalah isi dari berbagai definisi sebuah halaman web. Apakah pentingnya? Tag <head> ditugaskan untuk mengambil sampel kode seperti CSS, JavaScript, dan jQuery untuk mendesain sebuah halaman web. Dimana CSS akan menyusun halaman web agar lebih rapi dan berseragam, sedangkan JavaScript akan membuat animasi seperti teks bergerak dan gambar bergerak, kalau jQuery merupakan library dari JavaScript. Didalam <head> ada tag <title>
yang berfungsi sebagai memberikan judul pada setiap halaman web.
Contohnya pada halaman web, “Arm4nChannel/Title dari Websiteku” akan
tampil sebagai judul, bisa di lihat pada Tab web browser kita. Di tag
inilah kita akan mendesain dan mengambil kode kodenya untuk membuat
halaman web tampak hidup.
Pengertian Tag <body>
Tag <body> yang merupakan tag yang paling penting, dikarenakan tag <body>
akan menampilkan semua elemen di dalam halaman web, seperti paragraf,
list, tabel, link, gambar, form, dan lainnya. tag body ini akan ditutup
dengan </body>. Kita akan menghabiskan waktu kita untuk menyusun halaman web didalam tag <body> ini.
Stuktur HTML yang
kita bahas disini adalah struktur yang sangat sederhana. Sebuah halaman
web bisa memiliki ratusan bahkan ribuan baris, yang ditulis dengan
berbagai tag HTML. Tag pertama yang akan kita bahas dalam tutorial berikutnya adalah tag <p> yang digunakan untuk membuat paragraf di dalam HTML !!
0 komentar:
Bijaklah saat Anda memberikan komentar atau kritik !!