Idwebdesain.com - Pernahkah anda sadar ketika anda membuka sebuah website yang didalamnya terdapat berbagai konten seperti tulisan, video atau gambar? perlu anda ketahui bahwa semua tampilan tersebut ditampilkan di browser hanya dengan kode yang ada dalam sebuah file dokumen html. Dokumen HTML merupakan sebuah file yag di gunakan untuk menampilkan sebuah halaman website, HTML merupakan singkatan dari HyperText Markup Language. Dokumen ini sangat penting Tanpa HTML maka tidak akan ada halaman web.

HTML adalah bahasa untuk memarkup (memformat). HTML memberitahu Web Browser bagaimana cara menampilkan konten. HTML memisahkan "konten" (kata-kata, gambar, audio, video dan lainnya) dari "Penampilan" (Definisi dari tipe konten dan instruksi bagaimana tipe konten tersebut harus ditampilkan). HTML menggunakan beberapa elemen yang telah didefinisikan untuk mengidentifikasi tipe-tipe konten. Element-elemen memiliki satu atau lebih "tag" yang memiliki atau mengekspresikan konten. Tatag diawali dan diakhiri dengan  kurung siku, dan tag "penutup" (tag yang menandakan akhir dari konten) diawali dengan garis miring.

Sebagai contoh, elemen paragraf terdiri dari tag pembuka "<p>" dan tag penutup "</p>". Contoh berikit menampilkan sebuah paragraf yang terdapat dalam elemen paragraf HTML:

<p> Saya sedang membaca di website idewebdesain.com </p>

Ketika konten tersebut ditampilkan dalam web browser, maka akan terlihat seperti berikut:

Saya sedang membaca di website idewebdesain.com

Mengapa yang ada ada dalam tanda kurung siku tidak ditampilkan? Browser menggunakan tag sebagai indikator bagaimana konten yang terdapat di dalam tag ditampilkan.

dalam tag html memiliki elemen lainnya seperti contoh di bawah ini:
<p> Saya sedang membaca di <em>website</em> idewebdesain.com </p>
 maka akan terlihat seperti berikut:

Saya sedang membaca di website idewebdesain.com

Tag
Dokumen HTML ditulis dalam teks biasa, bisa juga ditulis menggunakan teks editor apapun yang memungkinkan isinya disimpan dalam teks biasa(Meski sebagian besar penulis HTML menganjurkan untuk menggunakan editor spesial yang memiliki syntax highligting dan menampilkan DOM). Nama tag bisa ditulis dengan huruf kecil atau huruf kapital. Akan tetapi, W3C (Konsorsium global yang mengurus standarisasi HTML) menganjurkan untuk menggunakan huruf kecil (dan XHTML mengharuskan menggunakan huruf kecil).

HTML menempelkan makna spesial terhadap apa saja yang diawali dengan tanda lebih kecil dari ("<") dan diakhiri dengan tanda lebih besar dari (">"). Markup tersebut disebut dengan tag. Pastikan untuk menutup tag, seperti halnya sebagian tag ditutup secara bawaan, dan yang lainnya mungkin menghasilkan error yang tidak diinginkan jika anda lupa menutup tag.

Dalam contoh di atas terdapat tag pembuka dan tag penutup. Tag penutup sama hanya dengan tag pembuka tapi memiliki tanda garis miring (forward slash /) sebelumnama tag atau sesudah tanda lebih kecil dari. Kebanyakan elemen-elemen HTML dituliskan menggunakan tag pembuka dan penutup. Tag pembuka dan penutup harus disarangkan secara benar, yakni tag penutup harus dituliskan sebagai kebalikan dari tag pembuka. Hal ini merupakan suatu aturan yang harus dipatuhi untuk penulisan kode yang valid

Berikut ini adalah contoh kode yang valid:

<em>Saya sedang <strong> Membaca </strong> artikel di idwebdesain.com</em>.

Dan berikut ini adalah contoh kode yang tidak valid:

Tidak valid:

<em> Saya sedang <strong>Membaca </em> artikel di idwebdesain.com</strong>.

Sebagian elemen tidak memiliki konten atau elemen lainnya. Elemen-elemen tersebut adalah elemen kosong dan tidak membutuhkan tag penutup. Berikut contohnya:

<img src="gambar.jpg">

Kebanyakan orang menuliskan markup elemen kosong ini dengan menambahkan garis miring (forward slash)(yang mana diperintahkan dalam XHTML).

<img src="gamar.jpg" />

Dalam HTML, tanda slash ini tidak memiliki fungsi teknis dan penggunaan tanda ini murni pemilihan gaya penulisan kode.

Contoh Dokumen HTML singkat tapi Sempurna
Yang dituliskan dibawah ini adalah contoh dokumen HTML sederhana. Anda dapat meng-copy codenya ke dalam teks editor, simpan dengan nama file myfirstdoc.html dan bukalah dengan browser. Pastikan Anda menyimpannya dengan character encoding UTF-8. Karena dokumen ini tidak menggunakan style maka dokumen ini akan terlihat sangat polos, tapi ini hanyalah tahap awal.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>Judul Website</title>
</head>
<body>
  <h1>Judul Halaman</h1>
  <!-- Note that it is "h" + "1", not "h" + the letter "one" -->
  <p>Contoh tulisan paragraf yang ditampilkan di halaman <abbr title="Hyper Text Markup Language">website</abbr>.</p>
</body>
</html>