Melalui tutorial HTML sebelumnya, kita sudah membahas cara penulisan tag HTML, cara menyimpan dan membuka file HTML, hingga memberikan komentar di dalam kode HTML. Pada tutorial HTML kali ini, kita akan memperdalam ilmu penulisan HTML dan menggabungkan semua ilmu yang sudah kita pelajari. Setiap file HTML mempunyai tata cara untuk melakukan penulisan. Ada bagian tertentu yang harus dituliskan pada file HTML. Tata cara ini belum pernah dibahas pada tutorial sebelumnya. Pada kesempatan kali ini saya akan memberikan tutorial HTML mengenai tata cara penulisan yang akan saya susun ke dalam bentuk kerangka. Saya namakan tutorial HTML ini sebagai kerangka HTML karena saya tidak mengetahui sebutan yang tepat untuk tutorial ini. Saya sendiri mempelajarinya secara otodidak dan saya menyimpulkannya dengan nama ini.

Tutorial HTML – Kerangka HTML – Bagian 7 (Bahasa Indonesia)

Awalnya saya akan memberikan sebuah kerangka dasar kode HTML seperti berikut ini.

Ada beberapa bagian dari tampilan kode di atas yang saya belum pernah jelaskan dari sebelumnya. OK, pada kesempatan ini saya akan menjelaskan semuanya satu persatu.

Tipe dokumen HTML

Baris pertama dimulai dari . Baris ini menunjukkan bahwa tipe dokumen ini adalah HTML. Baris ini digunakan oleh beberapa aplikasi untuk mengenali tipe dokumen ini. Banyak aplikasi mendeteksi dokumen html melalui ekstensi dokumen tapi ada sebagian aplikasi yang menggunakan baris ini untuk mengenali dokumen HTML. Sebaiknya kita menuliskan baris ini di setiap file HTML.

Tag HTML awal dari kode HTML

Tag HTML juga digunakan mesin peramban atau aplikasi lain untuk mengenali dokumen sebagai dokumen HTML. Tapi, tag HTML tidak sekedar memberikan identifikasi, tag HTML juga memberikan indikasi bahwa kode yang terletak di dalam tag HTML adalah kode HTML. Tag HTML merupakan pembatas di mana kode HTML berawal dan berakhir

2 Elemen Utama dokumen HTML

Di dalam setiap dokumen HTML terbagi atas 2 buah elemen utama yakni, head dan body. Kedua bagian ini juga ditandai dengan tag head dan body. Bagian head selalu ditulis terlebih dahulu dibandingkan dengan bagian body. Sebaiknya kedua bagian ini tidak ditulis secara terbalik. Karena perintah di dalam head akan dijalankan terlebih dahulu dibandingkan kode atau perintah di dalam body.

Saya berikan sebuah gambaran antara fungsi head dan body di dalam aplikasi peramban. Saya menggunakan Mozilla Firefox dan di bawah ini adalah screen shot dari hasil screenshotnya.

latihan 7 - 01 - mozilla firefox - screenshot 1

Pada gambar tersebut bagian head digunakan untuk mengatur tampilan pada aplikasi peramban sedangkan body digunakan untuk mengatur tampilan pada panel utama aplikasi peramban.

Elemen head mengatur data di dalam aplikasi peramban

Penulisan pada title hanya digunakan untuk mengatur data pada aplikasi peramban. Tag yang dapat digunakan pada bagian head, antara lain: title, meta, link, script, style dan lain sebagainya.

Perhatikan contoh berikut ini dengan menambahkan tag title ke dalam bagian head.

Kode di atas akan menghasilkan tampilan seperti yang ditunjukkan melalui hasil screenshot berikut ini:

latihan 7 - 02 - mozilla firefox - screenshot 2

Elemen body merupakan bagian dari tampilan utama

Bagian body merupakan tempat untuk menuliskan tampilan tag HTML yang diajarkan sebelumnya. Tampilan halaman harus dituliskan di dalam tag body. Mari perhatikan contoh penambahan kode HTML ke dalam body berikut ini:

Bila kode HTML di atas dijalankan akan menghasilkan tampilan seperti di bawah ini:

latihan 7 - 03 - mozilla firefox - screenshot 3

Pada intinya kerangka HTML di atas harus ada pada sebuah dokumen HTML. Pada praktek sebelumnya kita dapat menuliskan kode HTML tanpa mengikuti kerangka di sini. Tapi, kita tidak bisa menjamin terjadinya error pada kondisi atau perangkat tertentu. Jadi sebaiknya kita menggunakan kerangka standar di dalam setiap penulisan file HTML.

Tutorial Selanjutnya:
Tutorial HTML – Penulisan Judul – Bagian 8 (Bahasa Indonesia)