Tuesday, August 11, 2009

Belajar HTML Dasar (Part.I)

Belajar HTML dasarBelajar HTML Dasar? Apa gunanya kan sudah ada software atau program khusus untuk membuat blog atau website tanpa perlu melihat code HTML (WYSIWYG/ What You See Is What You Get)?. Bagi beberapa orang pertanyaan mengenai HTML dasar tersebut merupakan pertanyaan retoris namun bagi webmaster lainnya baik beginner atau senior kode-kode HTML dasar tersebut sangat penting bahkan di antara mereka hampir tidak pernah melihat tampilan asli yang tampil dengan program WYSIWIG tersebut, mereka membangun sebuah situs hanya dengan menulis kode-kode HTML. Memang benar dengan program WYSIWYG tersebut kita dapat membangun sebuah situs tanpa melihat kode HTML karena biasanya hasil yang kita buat akan seperti apa yang kita lihat pada saat membuat situs.

Pendapat saya mengenai belajar HTML dasar sangat penting terutama bagi pemula yang baru mengenal HTML dasar, hal ini akan bermanfaat pada saat kita membuat atau mengedit suatu blog atau website termasuk template, header, font dan sebagainya.

HTML (Hyper Text Mark Up Language) adalah dokumen murni yang dapat dibuat dengan berbagai Text Editor misalnya Notepad, Front Page, Dream Weaver dan Text Editor lainnya. File yang ini berextensi htm atau html.

Belajar HTML dasar sangat penting didalam membuat suatu website atau blog hal ini karena hampir semua web page menggunakan elemen-elemen HTML seperti head, body, paragraph, list, dan teks murni yang ditandai dengan tag. Tag HTML terdiri dari tanda lebih besar (">") dan tanda lebih kecil ("<") yang biasanya berpasangan contohnya : <h1> dengan </h1>, <h2> dengan </h2>, <b> dengan </b>, <td> dengan </td> dan tag-tag HTML lainnya. Tetapi ada beberapa tag HTML yang tidak perlu ditulis berpasangan seperti <hr /> dan <br /> namun sebaiknya ditulis berpasangan sebagai antisipasi rekomendasi HTML generasi mendatang.

Penulisan elemen dan tag HTML bisa dengan huruf besar atau kecil (tidak case sensitive) namun ini juga dikomendasikan agar ditulis dengan hurup sebagai antisipasi HTML generasi mendatang

Persiapan untuk belajar HTML dasar :

  1. 1 set PC (komputer) yang siap web dengan operating system Windows, Mac, atau Unix.
  2. Notepad atau text editor lainnya.
  3. Koneksi Internet. Browser seperti Internet Explorer, Mozilla Firefox, Opera, Safari, Google Chrome, atau browser lain.
  4. Siapkan ide dan semangat belajar.
Silahkan tulis contoh sederhana penulisan HTML pada notepade setelah itu simpan dengan nama contoh.html :

Belajar HTML dasar

Setelah di simpan, buka browser misalnya Mozilla Firefox kemudian open file tersebut maka hasilnya akan tampak seperti gambar di bawah ini :

Belajar HTML dasar

Penjelasan :
  1. Tag pertama <html> memberitahu browser bahwa ini merupakan awal dari dokumen HTML diakhiri dengan tag </html> untuk memberitahu browser bahwa ini adalah akhir dari dokumen HTML.
  2. Text diantara <head> dan </head> adalah informasi header.
  3. Text diantara <title> dan </title> akan ditampilkan di sudut kiri atas browser (lihat tanda panah merah).
  4. Text diantara <body> dan </body> merupakan isi HTML yang akan ditampilkan pada browser.
Berikut ini adalah beberapa contoh Tag HTML dasar :
  1. <html> : Definisi sebuah dokumen HTML
  2. <head> : Informasi Header
  3. <title> : Menampilkan title atau judul yang terlihat pada browser bagian kiri atas
  4. <h1>,<h2>,....<h6> : Definisi Heading 1sampai 6
  5. <p> : Definisi sebuah paragraph
  6. <br /> : Sisipkan line break atau baris baru
  7. <hr /> : Membuat garis horizontal
  8. <!--> : Definisi untuk komentar
  9. <b> : Teks ditulis tebal (bold)
  10. <i> : Teks ditulis miring (italic)
  11. <u> : Teks ditulis dengan garis bawah (underline)