Rabu, 22 Oktober 2008

Hyper Text Markup Languange (HTML)

HTML adalah kependekan dari Hyper Text Markup Languange. Fasilitas Hypertext merupakan metode yang menautkan (link) satu dokumen ke dokumen lain melalui suatu teks. HTML merupakan halaman yang berada pada suatu situs internet atau Web. Jadi, suatu situs terdiri atas beberapa halaman HTML atau Web page.
Sesungguhnya HTML merupakan kumpulan kode-kode yang ditampilkan dalam format Tag untuk ditampilkan dalan halaman Web. Biasanya hyperlink ada pada halaman Web yang jika diklik oleh pengguna, browser akan menampilkan dokumen yang tertaut dengan link tersebut.
Untuk membuat suatu dokumen HTML, sama halnya seperti anda membuat dokumen dalam Ms Word atau perangkat lunak lainnya. Hanya saja dalam pembuatan dokumen HTML, biasanya dibuat memakaki editor Notepad atau Ms FrontPage.


Elemen-Elemen HTML

<Head>
Tag <head> memiliki fungsi untuk mendeskripsikan header atau keterangan yang di dalamnya memiliki elemen-elemen sebagai berikut

  • Tag <title>, digunakan untuk memberi judul dari suatu homepage.
  • Tag <base>, lokasi URL lengkap dari dokumen ini.
  • Tag <link>, link dokumen ini dan dokumen lain.
  • Tag <meta>, Informasi tentang dokumen itu sendiri.

<Body >
Tag body berfungsi menyediakan untuk penyediaan tempat untuk mengisi teks yang akan ditampilkan. Beberapa atribut yang menyertai tag body

  • Background, digunakan untuk membuat background image
  • Bgcolor, digunakan untuk menentukan warna belakang.
  • Bgproperties, digunakan untuk menentukan nilai property background
  • Leftmargin, dugunakn untuk menentukan batas kiri halaman dalam satuan pixel.
  • Topmargin, digunakan untuk menentukan batas atas halaman dalam satuan pixel.
  • Text, digunakn untuk menentukan warna teks
  • Link, digunakan untuk menentukan warna link yang belum dikunjungi
  • Alink, digunakan untuk menentukan warna link yang aktif
  • Vlink, digunakan untuk menentukan warna link yang sudah dikunjungi

Tag yang Digunakan di Bagian Body

  • < h3 &gt; :Headline, ukuran dari huruf yang paling besar adalah ukuran < h1 >
  • < P &gt; : Tag paragraph, dan tulisan akan pindahke baris berikutnya
  • < OL &gt; atau < LI &gt; : Untuk penulisan tag bernomor
  • < UL &gt; atau < LI &gt; : Untuk penulisan tag tidak bernomor
  • < HR &gt; : Menampilkan garis horizontal
  • < B> : Mencetak tebal
  • < I> :Mencetak miring
  • < U> : Garis bawah teks
  • < BIG> : Memperbesar teks
  • < Small> : Memperkecil teks
  • < Center> : Mengetengahkan teks
  • < BR>: Membuat garis baru dalam teks
  • < PRE> : Digunakan untuk membuat table sederhana
  • < IMG> : Menampilkan image (gambar)

LINK merupakan perintah yang digunakan untuk menghubungkan halaman yang satu dengan yang lain. Untuk membuat link, anda harus membuat minimal dua dokumen HTML.

Contoh: < a href="HTML Pertamaku.html" >Komentar Anda </a >

Cara membuat dokumen HTML yang sederhana seperti berikut:

Cara 1
Klik Start-Program-Accessories-Notepad

Cara 2
Setelah berada pada editor Notepad, ketiklah contoh teks berikut :
Contoh:
<html >
<head >
<title> Latihan HTML </title >
</head >
<body>
Saya adalah seorang murid
</body >
</html >

Cara 3
Ingat setiap menulis tag diawalnya harus isi tanda kurang dari dan besar dari
harus diakhiri "/"(garis miring)

Cara 4
Simpan dengan cara klik File Save, beri nama Contohnya HTML pertamaku.html

Cara 5
Setelah disimpan bukalah windows eksplorer anda, dan cari data notepad yang anda
ketik tadi

Cara 6
Setelah diklik jadilah HTML sederhana anda


HTML Terdiri dari sepasang kode yang disisipkan dalam suatu dokumen untuk mengontrol tampilan dokumen di layar monitor oleh Web Browser, seperti Netscape atau Mosaik. Apabila kita akan memandang suatu dokumen di Internet kita harus menggunakan Web Browser dan disana ada fasilitas "View source" untuk melihat kode-kode web page ini. Suatu dokumen berisi kode-kode ini disebut HTML.

Suatu dokumen HTML harus mempunyai formulir yang tepat, sehingga dapat dikenal dan di Interpretasikan dengan tepat oleh perangkat lunak dari Browser. Ada dua hal yang anda perhatikan yaitu kode pembuka dan penutup didalam kurung (< >),dan (). Sebagai contoh suatu HTML akan dibuka oleh dan ditutup oleh dan hal ini adalah keharusan akan tetapi tidak semuanya pakai kode penutup. Editor Googletis akan membantu pembuatan dasar-dasar struktur dokumen untuk anda.


Warna

Warna, citra sebagai latarbelakang, dan beberapa hal akan dikontrol oleh Tag . Jika anda menggunakan Editor GeoCities secara otomatis telah dibuatkan tag anda tidak dapat membuat latarbelakang dari citra tapi itu dulu, sekarang GeoCities telah memiliki Editor HTML yang canggih. Anda dapat mengontrol home page yang sedang dibuat termasuk latarbelakang. Informasi dalam page ini akan membantu anda untuk mengembangkan dari pengertian dasar dari HTML.
Untuk mengontrol warna, tag ditulis seperti ini: Anda dibolehkan menggunakan seluruh item tersebut (bgcolor, text, link, vlink or alink), atau sebagian. Untuk menset latarbelakang, text, link, visited link, atau alink masukkan kode warna untuk xxxxxx seperti contoh diatas dan berikut ini ada beberapa warna yang dapat anda pergunakan :

  • Putih = FFFFFF
  • Kuning = FFFF66
  • Merah = FF0000
  • Abu-abu = CC9999
  • Biru = 0000FF
  • Hujau = 00FF00
  • Hitam = 000000
  • Terong = CC33FF
  • Biru muda = 00CCFF
Nilai tersebut diatas adalah nilai Hexadecimal, kombinasi warna dari Merah/Hijau/Biru yang menghasilkan warna baru. Penjelasan yang lebih lengkap dari nilai hexadecimal dapat anda lihat di home page ini atau di web lain. Coba converter warna hexadecimal ini dengan menggunakan kombinasi yang proporsional setiap warna dapat diarsipkan. Jika anda menginginkan seperti warna yang anda lihat di home page lain, anda dapat menggunakan "View Source" di browser yang sedang anda gunakan untuk melihat kode dari warna tersebut.

CATATAN: Mulailah dengan menambah tag sebagai percobaan pertama dalam hal ini akan anda dapatkan kombinasi warna seperti home page ini. Sekali anda berhasil, tinggal membuat percobaan selanjutnya yang lebih mantap.

Contoh sederhana pemakaian warna utk background :

  • (Hijau muda)
  • (Kuning muda)
  • (Coklat muda)
  • (Violet tua)


Garis Horizontal

Anda dapat menyisipkan sebuah garis horizontal (Horizontal Rule) dalam suatu dokumen dengan menyisipkan sebuah tag


. Sebagai defaultnya adalah garis biasa dengan ukuran dan ketebalan yang standard seperti ini:


Mengenai tag ini dikenal dengan Browser modern, dapat dibuat beberapa macam dari tampilan garis dengan menambah LINE=NUMBER, ketebalan dari suatu garis dapat ditentukan. Letak dari suatu garis juga dapat diatur sesuai dengan kebutuhan dengan menambahkan ALIGN=LEFT/RIGHT/CENTER. Ketebalan garis juga dapat ditentukan dengan menambahkan WIDTH=PERCENT.

Kombinasi dari penjelasan diatas dapat kita buat seperti ini


akan dibuatkan (tampilkan) suatu garis tebal yang hitam dan ditempatkan ditengah-tengah.


Catatan: Dalam pembuatan garis yang cantik seperti pelangi dll. tidak dibuat pakai tag
melainkan sebuah citra.


Membuat kelap-kelip

Untuk membuat teks atau graphik kelap-kelip cukup dengan menambahkan tag .

Kodenya Cok Agoes akan terlihat seperti ini:

<BLINK>Cok Agoes</BLINK>



Membuat lompatan ke dokumen lain

Untuk membuat lompatan ke dokumen lain di home page yang sama dapat dilakukan dengan mudah yaitu dengan mengklik yang bergaris bawah dan warna yang berbeda, ada dua cara melakukannya:

  1. Sisipkan target pada suatu tempat yang anda inginkan untul link lompatan seperti ini:

    teks_target

  2. Sisipkan Link untuk diklik dan langsung loncat kedokumen dimaksud.

    Hotlink

Teks hotlink akan terlihat bergaris bawah dan berwarna yang lain, jika pemakai meng-klik di browser web akan langsung melompat ke dokumen Hotlink.



Lompatan ke file yang lain dengan system yg sama

Diatas telah dibahas lompatan ke dokumen yang lain, dalam hal ini akan dibahas lompatan ke file lain, misalnya page yang membahas topik-topik khusus yang menarik.

Jika file yang mau dibuat lompatan masih di direktory yg sama cukup dengan menyebut file-nya saja seperti format berikut ini:

Buka rambo.gif



Lompat ke suatu dokumen dengan system yg berbeda

Dengan membuat lompatan hotlink ke suatu dokumen di system yang lain dimanapun berada sama halnya dengan lompatan dokumen dengan system yg sama hanya saja harus lengkap dibuat URL (Uniform Resource Locator) atau address Internet seperti contoh berikut ini:
Loncat ke Chat Page

Anda akan dibawa ketempat yg disebut Homepage Obrolan yang beralamat di http://members.tripod.com/~Simbolon/, lakukan sekarang juga.



2 komentar:

Rezem mengatakan...

it is crazzy..........

Rezem mengatakan...

Lanjut wahai kau mahluk ciptan tuhan.................jangan pantang menyerah.!!!!!!!!