CARA MEMBUAT HTML SEDERHANA
Kalau membaca tulisan ini, maka yang anda baca pada dasarnya adalah dokumen HyperText Markup Language (HTML). Itu adalah tipe dokumen yang digunakan untuk membuat halaman web yang ditemui pada berbagai situs web. Cara membuat HTML relatif sederhana dan hanya membutuhkan aplikasi text editor, seperti notepad di Windows. Untuk produktifitas lebih baik, saya sarankan untuk menggunakan text editor dengan fitur yang dapat menandai kode HTML dengan variasi warna, seperti aplikasi Notepad++ yang harus diinstal terlebih dahulu.
Untuk mulai membuat HTML, pertama-tama mari kita lihat bagaimana struktur minimal dari dokumen HTML dibawah ini:
<!DOCTYPE html> <html> <head> <meta charset=”utf-8”> <title>Cara Membuat HTML | 9trilliun.com</title> </head> <body> <h1>Cara Membuat HTML</h1> <p>Contoh Struktur Minimal Dokumen HTML</p> </body> </html>Simpan dokumen diatas dari teks editor dengan nama index.html. Pada bagian paling atas contoh dokumen HTML terdapat teks <!DOCTYPE html> yang merupakan deklarasi doctype. Deklarasi tersebut adalah cara untuk memberikan petunjuk ke peramban web (web browser) agar menampilkan dokumen HTML sesuai dengan standar yang ditentukan oleh World Wide Web Consortium (W3C), yaitu organisasi yang bertanggung-jawab untuk membuat standarisasi berbagai teknologi yang digunakan di web, salah satunya adalah HTML.
Setelah deklarasi doctype, terdapat teks <html>. Ini disebut dengan tag. Seperti yang bisa dilihat pada contoh dokumen HTML diatas, ada beberapa tags berbeda selain <html>. Sebagian besar tag mempunyai pasangannya, sebagai contoh tag pembuka <html> selalu ditutup dengan </html> (perhatikan garis miring “/” pada tag penutup). Tidak semua tag mempunyai pasangan, seperti <meta> yang berdiri sendiri.
Secara garis besar dokumen HTML dibagi menjadi 2 bagian. Bagian pertama yang berada didalam <head> tags berisi informasi mengenai dokumen HTML itu sendiri. Sementara yang berada didalam <body> tags adalah bagian yang ditampilkan oleh peramban web ke pengguna. Segala sesuatu yang anda baca dan lihat pada tulisan ini, diletakkan didalam pasangan body tags.
Mari kita lihat daribagian pertama. Didalam head tags terdapat <meta charset=”utf-8”> tag. Teks charset=”utf-8” disebut dengan atribut untuk meta tag. Atribut terdiri dari pasangan name dan value. Dalam hal ini name adalah charset dan value adalah utf-8. Meta tag digunakan untuk menginformasikan peramban web, kalau dokumen HTML ini menggunakan character set UTF-8. Bahasa dengan huruf latin, seperti bahasa Inggris dan Indonesia dapat menggunakan character set UTF-8.
Setelah meta tag terdapat <title>Cara Membuat HTML | 9trilliun.com</title>. Pasangan tags pembuka dan penutup dengan konten yang ada didalamnya disebut dengan elemen HTML. Pada contoh, title element mempunyai konten berupa teks “Cara Membuat HTML | 9trilliun.com”. Teks tersebut yang berada dalam elemen title menunjukkan judul dokumen HTML. Ini adalah satu-satunya informasi dalam head yang ditampilkan oleh peramban web, tepatnya bisa dilihat di tab yang ada di peramban itu sendiri.
Bagian kedua dari dokumen HTML berada dalam elemen body. Pada contoh didalam body terdapat 2 elemen, yaitu h1 dan p. Ketika anda menulis surat, biasanya dimulai dengan judul (heading) dan diikuti dengan beberapa paragraf dibawahnya. Begitu juga dengan menulis dengan HTML. Tulisan tersebut bisa mempunyai judul yang ditandai dengan h1. Suatu tulisan bisa dibagi lagi menjadi beberapa bagian dan dimulai dengan sub-judul. Anda bisa menandai sub-judul dengan elemen h2, h3, …. , hingga h6. Sementara paragraf dalam tulisan bisa ditaruh didalam elemen p.
Kalau anda sudah menyalin contoh dokumen HTML diatas dan menyimpannya sebagai index.html melalui teks editor, maka sekarang saatnya untuk mencoba menampilkan dokumen tersebut di peramban web. Klik kanan index.html, arahkan mouse cursor ke menu Open with di Windows dan pilih peramban web yang ingin digunakan untuk menampilkan dokumen tersebut, seperti Google Chrome atau Mozilla Firefox. Apabila anda mengikuti semua petunjuk yang sudah disebutkan, maka peramban web akan menampilkan teks “ Cara Membuat HTML | 9trilliun.com” tanpa tanda petik. Bila teks tersebut muncul di peramban web, maka anda sudah berhasil membuat dokumen HTML.
