Struktur Dasar HTML (HyperText Markup Language)

Struktur Dasar HTML (HyperText Markup Language)


Gambar : Posisi HTML, Head , body dalam web 

Berikut ini adalah kode HTML yang baru saja kita buat:

Penulisan kode HTML selalu dimulai dengan mendeklarasi DOCTYPE, lalau menuliskan tag <html> dan di dalamnya terdapat tag <head> dan <body>.

Kalau kita perhatikan! struktur dasar kode HTML terdiri dari tiga bagian penting:

  • Bagian Deklarasi ( DOCTYPE )
  • Bagian Kepala ( HEAD )
  • Bagian Bodi ( Body )


1. DOCTYPE

Coba perhatikan kode pada baris pertama: <!DOCTYPE html>.

Ini adalah tag deklarasi untuk menyatakan tipe dokumen dan versinya. Pada contoh di atas, kita menyatakan dokumen ini bertipe HTML dan versinya adalah HTML 5. Nah, untuk HTML versi 4. beda lagi cara deklarasinya.

Contoh untuk HTML 4.01:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

Cukup panjang bukan !

Lalu apakah boleh kita tidak menulis kode <!DOCTYPE html> ini? Boleh-boleh saja, dokumen HTML-nya akan tetap bisa dibuka di web browser. Tapi  ini tentunya akan melanggar aturan standar yang dibuat W3C. O ya, kita bisa mengecek  apakah HTML yang ditulis sudah benar atau tidak di https://validator.w3.org/.

Berikutnya, di bawah tag deklarasi <!DOCTYPE html> terdapat tag pembuka untuk HTML:

       <html lang="en">

Tag <html> wajib ada di setiap dokumen HTML..

Pada tag ini, kita memberikan atribut lang="en" untuk menyatakan kalau konten dokumen HTML ini akan menggunakan bahasa inggris. Nah di dalam tag <html> ini, terdapat dua tag penting lagi, yakni: tag <head> dan tag <body>Setelah itu barulah terakhir tag HTML ditutup dengan </html>.

2. Bagian HEAD

Bagian HEAD adalah bagian kepala dari HTML. Dimulai dari tag <head> dan ditutup dengan </head>.

<!DOCTYPE html>


<html lang="en">


    <head>


        <title>Belajar HTML #01</title>


    </head>


    <body>


        <p>Hello World!</p>


    </body>


</html>

Pada bagian HEAD, biasanya digunakan untuk menuliskan tag-tag yang akan dibaca oleh mesin.

Seperti:

  • Tag meta untuk SEO;
  • Tag <title> untuk judul;
  • Tempat menulis kode CSS dan Javascript;
  • dan lain-lain.

3. Bagian BODY

Bagian BODY adalah bagian yang akan ditampilkan pada web browser. Penulisannya di mulai dari tag <body> dan ditutup dengan </body>.

<!DOCTYPE html>


<html lang="en">


    <head>


        <title>Belajar HTML #01</title>


    </head>


    <body>


        <p>Hello World!</p>


    </body>


</html>

Di sinilah nanti kita akan banyak menuliskan konten dengan berbagai macam tag. Saat ini kita baru mengisinya dengan tag <p>. Tag <p> adalah tag yang digunakan untuk membuat paragraf.





Post a Comment

Previous Post Next Post