Pages

Tuesday, August 28, 2012

Pengenalan HTML

Apa itu HTML?
Hypertext Markup Language (HTML) adalah salah satu format yang banyak dipakai dalam pembuatan dokumen halaman web. sederhananya merupakan kode-kode tertentu yang disebut sintaks yang dituliskan kedalam suatu file yang meberikan aturan main pada browser bagaimana dan seperti apa halaman dokumen tersebut ditampilkan. file HTML bereksistensi *.html bisa juga *.htm
Bagaimana Membuat file HTML?
Untuk membuat file HTML bisa dengan editor teks biasa seperti Notepad dll. namun pada saat sekarang telah banyak editor HTML yang memiliki tampilan bersifat WYSIWYG sepert Macromedia Dreamweaver, Adobe GoLive, MS FrontPage
yang bisa menampilakan file tersebut dalam bentuk sintaks HTML biasa maupun seperti apa yang akan ditampilkan browser.
Jika anda pemula sangat saya anjurkan untuk membuat secara manual menggunakan notepad dll dengan langsung mengetikkan kode demi kode HTML ke dalam file yang anda buat. Kenapa? jika menggunakan software tertentu anda tidak akan terbiasa dengan tag HTML.anda akan dimanjakan oleh tools yang digunakan dalam software tersebut untuk membuat tampilan halaman HTML, ini akan menyulitkan jika anda ingin mengedit kembali file tersebut secara manual.
Struktur Dasar Html
Kode HTML harus berada dalam sebuah tag kontainer. Yaitu diawali dengan <namatag> dan diakhiri dengan
</namatag>. Struktur dasar HTML berisi elemen-elemen atau tag sebagai berikut:
<html>
<head>
<title>Judul Halaman/Caption</title>
</head>
<body>
Isi web/konten
</body>
</html>

Keterangan:
  • <html>..</html>
    Mendefinisikan bahwa teks yang berada antara kedua tag tersebut adalah file HTML.
  • <head> .. </head>
    Sebagai informasi page header. Di dalam tag ini kita bisa meletakkan tag-tag TITLE, BASE, ISINDEX, LINK, SCRIPT, STYLE & META dll
  • <title> .. </title>
    Sebagai titel atau judul halaman. Kalimat yang ada dalam tag ini akan muncul pada title bar browser Anda.
  • <body> .. </body>
    Didalam tag inilah yang menjadi inti halaman web yaitu bagian yang akan ditampilkan sebagai isi halaman pada browser. Di dalam tag ini bisa diletakkan berbagai page attribute seperti bgcolor, background, text, link, vlink, alink, leftmargin,topmargin dll
Sekarang kita langsung saja membuat file HTML, ikuti langkah-langkah berikut :
  • Buat sebuah folder tempat menyimpan file HTML yang akan kita buat.
  • Buka notepad atau editor teks lainnya untuk lebih memudahkan saya merekomendasikan untuk menggunakan editor yang memang dikhususkan untuk editor pemograman seperti PSPAD, Notepad++ dll. untuk tutorial ini saya menggunakan PSPAD. download PSPAD
  • Jika menggunakan Notepad maka buat sebuah file teks baru, jika menggunakan PSPAD buat sebuah file HTMLpengenalan-html1
  • Ketik kode dasar html di atas, lihat contoh :
<html>
<head>
<title>HTML pertamaku</title>
</head>
<body>
Ayo belajar HTML
</body>
</html>

pengenalan-html2



  • Simpan halaman tersebut kedalam folder yang kita buat sebelumnya dan beri nama misalnya index.htm
pengenalan-html3
  • jika menggunakan Notepad pada pilhan ‘Save as Type’ pilih ‘All Files’.
pengenalan-html4
Dalam pemograman web anda harus membuat sebuah file dengan nama index.html yang berfungsi sebagai file pertama yang akan dibuka, bila browser anda arahkan ke folder tersebut. Untuk nama file selanjutnya terserah anda :)
  • Buka file yang telah disimpan tersebut dengan browser anda. caranya dengan index.html > klik kanan > Open With > pilih salah satu browser anda misalnya Internet Explore/Mozilla Firefox.
pengenalan-html5
Sampai pada tahap ini anda telah berhasil membuat sebuah file HTML, untuk lebih dalam lagi silahkan baca tulisan saya selanjutnya.
Jika ada kendala mari kita diskusikan disini.
Selamat mencoba...

Tugas TIK Kelas XI
SMA Negeri 1 Indralaya Utara
SMA Model Pendidikan Karakter
Sumber Materi : http://www.masriadi.net/pengenalan-html.html

Posted in • Pemrograman Web •  

1 comments: