Belajar Mengenal Dasar - Dasar HTML


HTML

HTML merupakan singkatan dari Hypertext Markup Language adalah sebuah bahasa markah yang digunakan untuk membuat sebuah halaman web. HTML disimpan dalam fomat text reguler dan mengandung tag - tag yang memerintahkan web browser untuk mengeksekusi perintah - perintah yang di spesifikasikan. Bermula dari sebuah bahasa yang sebelumnya banyak digunakan di dunia penerbitan dan percetakan yang disebut dengan SGML (Standard Generalized Markup Language), HTML kali ini digunakan secara luas untuk menampilkan halaman web yang didefinisikan dan dikendalikan penggunaannya oleh World Wide Web Consortium (W3C).

Struktur Dasar HTML

Tampilan Struktur Dasar HTML
<!DOCTYPE html>
<html>
   <head>
        <title>Disini judul Halaman</title>
   </head>
   <body>
        Disini Penulisan informasi WEB
   </body>
</html>

Penjelasan :
  1. HTML
  2. Untuk menyatakan kepada browser bahwa dokumen web yang digunakan adalah HTML.

    Sintaks :
    <html>
       .....
    </html>

  3. HEAD
  4. Merupakan kepala dari dokumen HTML, yang diapit oleh tag <head></head> terletak diantara tag <html></html>. Biasanya dimuat oleh tag TITLE yang menampilkan judul halaman pada title browser, Tag TITLE biasanya digunakan sebagai keyword.

    Sintaks :
    <head>
       .....
    </head>

  5. BODY
  6. Tag BODY ini merupakan tubuh atau isi dari dokumen HTML, yang diapit oleh tag <body></body>. Tag body mempunyai atribut - atribut yang biasanya menspesifikasikan khususnya warna dan latar belakang dokumen yang akan ditampilkan di browser.

    Sintaks :
    <body>
       .....
    </body>

  7. TAG
  8. Tag adalah teks khusus (markup) berupa 2 karakter “<” (lebih kecil) dan “>” (lebih besar).
    Tag biasanya merupakan suatu pasangan yang disebut dengan :
    • Tag awal, dinyatakan dalam bentuk <nama tag>
    • Tag akhir, dinyatakan dalam bentuk </nama tag>
    Formatnya : <nama tag> Tampilan teks </nama tag>
    Contohnya : <title> Judul HTML </title>

    Tag - tag yang tertulis secara berpasangan pada suatu element HTML, tidak boleh tumpang tindih dengan pasangan tag - tag lainnya.

    Contoh penulisan tag yang benar.
    <html>
       <body>
            .....
       </body>
    </html>

    Contoh penulisan tag yang salah.
    <html>
       <body>
            .....
       </html>
    </body>

  9. Atribut
  10. Atribut adalah karakteristik tambahan pada suatu TAG yang mendefinisikan properti dari suatu element HTML. Secara umum nilai atribut harus berada dalam tanda petik satu atau dua.

    Misalnya :
    <body bgcolor="red" align="right"> akan menampilkan latar belakang halaman web menjadi merah dan text akan membuat rata kanan.

Membuat File HTML

Untuk menyunting dan menyimpan kode penulisan HTML kita bisa menggunakan software teks editor seperti Noteped, Noteped ++, DreamWeaver, atau yang lainnya. Dan agar bisa di tampilkan ke browser simpan dengan ekstensi .html atau .htm (Contoh : index.html atau index.htm) biasanya yang paling sering digunakan .html.

Contoh Sederhana menampilkan web HTML :
  1. Menggunakan HTML 4
  2. <!DOCTYPE HTML>
    <html>
       <head>
            <title>SubKode</title>
       </head>
       <body bgcolor="green">
            <b>Hallo!</b>
            <p align="center">Belajar Mengenal dasar - dasar HTML</p>
       </body>
    </html>

    Simpan Maka akan menampilkan di browser berikut ini.
    HTML versi 4
  3. Menggunakan HTML 5
  4. <!DOCTYPE HTML>
    <html>
       <head>
            <title>SubKode</title>
       </head>
       <body style="text-align:center;">
            <b>Hallo!</b>
            <p style="color:red; text-align:right;">Belajar Mengenal dasar - dasar HTML</p>
       </body>
    </html>

    Akan tampil dibrowser berikut ini.
    HTML versi 5
    Catatan :
    Keduanya sama saja hasilnya. Biasanya untuk media pembelajaran disekolah - sekolah menggunakan HTML 4.

Akhir Kata

Demikian Belajar Mengenal Dasar - Dasar HTML semoga yang benar-benar ingin paham tentang pembuatan website banyak - banyaklah latihan pasti akan mudah dikuasai dan hafal diluar kepala amin. Terima Kasih!

Referensi :

  • Petanikode
  • wikipedia

0 Komentar

- Kalau ada kesalahan lapor admin biar secepatnya diperbaiki.

- Jika berkenan silahkan berikan komentar anda mengenai artikel diatas.
- Gunakan kosa kata yang mudah dipahami.
- Usahakan Tidak berkomentar sebagai "Anonymous".

- Untuk menyisipkan kode, gunakan tag [pre] KODE ANDA [/pre].

Emoticon

Iklan Atas Artikel

Iklan Bawah Artikel

Atas