|
Haloo, nama saya Itok
Melalui web ini
saya akan memberi tahu temen-temen yang belum mengerti bahasa HTML agar
bisa membuat home pagenya sendiri. HTML singkatan dari HyperTex
Markup Lnguage. File HTML biasanya berakiran .HTM atau .HTML.
Untuk Certrin internet, akirannya adalah .HTML (4huruf), Sebab server
Centrin menggunakan UNIX sebagai system operasinya. File HTML ini dibuat
dengan pengolahan kata murni (biasanya NotePAD yang ada di windows)
Seperti halnya
pengolahan kata, HTML pun mempunyai kode-kode khusus yang disebut markup,
yaitu kode-kode khusus yang menentukan bagaimana suatu blok
harus diproses oleh aplikasi. Bila pada pengolahan kata markup
menentukan bagaimana suatu teks harus di format, maka pada dokumen HTML,
markup menentukan teks (heading, judul, paragrap, dll).tag adalah
suatu elemen dalam HTML yang dimulai dengan star-tag (contoh:<u>).
Dan biasanya diakiri dengan end-tag (contoh:</u>).
Jadi,untuk membuat agar tampilan dilayar seperti berikut:
Saya ingin belajar bahasa HTML.
anda harus mengetikkan seperti ini pada dokumen
HTML anda:
saya ingin <u>belajar</u>
bahasa HTML.
Berikut ini adalah tag-tag yang sering dipakai
untuk memformat teks
<B>Tebal</B>
<I>Italic</I>
<U>Garis bawah</u>
|
Tebal
Italic
Garis bawah
|
Anda pun
boleh dari ketiga tag diatas, misal untuk membuat suatu teks dicetak tebal,
italic dan bergaris bawah maka anda dapat menuliskan seperti
ini dalam dokumen anda.
<B><I><U>
tebal,italic dan bergaris bawah</U></I></B>
Perhatikan urutannya.Star-tag yang ditulis
lebih awal,star-end nya harus ditulis lebih akhir!
Selain itu ,tag berikut sebaiknya anda kuasai
juga!
| <ENTER>Rata
tengeh<ENTER>
<HR>
|
rata tengah
|
|
<H1>SATU</H1> |
SATU
|
|
<H2>DUA</H2> |
DUA
|
|
<H3>TIGA</H3> |
TIGA
|
|
<H4>EMPAT</H4> |
EMPAT
|
|
<H5>LIMA</H5> |
LIMA
|
|
<H6>ENAM</H6> |
ENAM
|
STRUKTUR DOKUMEN HTML YANG
SEDERHANA
Pada umumnya HTML yng apaling sederhana adalah
sebagai berikut. Mengapa saya sebutkan"pada umumnya"?karena
pada beberapa kasus, anda boleh menghilangkan (atau malah harus
menghilangkan )beberapa elemen yang tercantum di bawah ini.
<HTML>
<HEAD>
<TITLE>Judul dokumen anda</TILLE>
</HEAD>
Ketikkan teks anda disini.
Misal,anda boleh membuat teks yang
dicetak <B>tebal</B>
</BODY>
</HTML>
Bila dokumen HTML diatas anda lihat dengan WEB
browser (misal Netscape), Maka yang akan tampak di layar adalah:
Ketikkan teks anda disini.Misal, anda boleh
membuat teks yang dicetak tebal
Perhatikan! walau pada dokumen HTML, kalimat
"Ketikkan teks anda disini."tidak satu baris dengan Kalimat
"Misal, anda boleh membuat teks yang dicetak <B>tebal</B>",
namun pada tampilan WEB bowser, kalimat -kalimat itu akan ditampilkan
dalam satuuu baris !Agar kedua kalimat itu dapat dipisahkan menjadi dua
baris, anda harus menambah teg <BR> yang
berarti "break".jadi, penulisannya diubah menjadi seperti ini:
Ketkkan teks anda disini.<BR>
Misal, anda boleh membuat teks yang
dicetak<B>tebal</B>
Hasilnya :
Ketkkan teks anda disini.
Misal,anda boleh membuat teks yang dicetak
tebal
ANCHOR (HYPERLINK)
Salah satu kemampuan yang membuat WWW menarik
adalah anda bisa berpindah dari satu WEB page ke WEB page yang lain
hanya dengan meng-klik suatu teks yang diformat sebagai hyperlink.
Contoh :dengan meng-klik bolehmail
ini anda bisa berpindah menuju ke E-mailnya bolehmail
Sebenarnya hyperlink dapat dibagi dua,yaitu:
# Internal link
#external link
Hyperlink pada contoh diatas termasuk external
link,karena dokumen yang dituju tidak berada didalam dokumen HTML ini.jadi
mungkin saja berada di file yang lain pada server yang sama atau bahkan
berada dinegara lain.sedang sebaliknya adalah internal link.Silahkan
klik kaya sastra yang
merupakan internal link. link ini akan membwa anda ke awal
dokumen.
Bagaimana cara membuatnya?Yang paling mudah
adalah external link yaitu anda cukup mengetikkan:
Hyperlink ke<A HREF="HTTP://WWW.YAHOO.COM">Yahoo</A>corporation
yang hasilnya akan tampak seperti
dibawah ini:
Hyperlink ke Yahoo
corporation
Yang agak sulit mungkinmembuat internal
link,karena anda selain harus membuat tag seperti diatas anda juga harus
mendefinisikan tempat dimana hyperlink itu akan menuju.Ini contohnya:
<HTML>
<HEAD>
<TITLE>Contoh internal link</TITLE>
</HEAD>
<BODY>
<A NAME="disini">
Ketkkan teks anda disini .<BR>
Misal,anda boleh membuat teks yang dicetak<B>tebal</B>
Lalu ini adalah contoh internal link yang akan
membawa kita ke<A HREF="#disini">awal</A>dokumen
atau ke<A HREF="#disana">akhir</A>dokumen.
<A NEME="disana">
</BODY>
</HTML>
GAMBAR (IMAGE)
Sebuah WEB page tanpa gambar ibarat sayur tanpa
air (waduh, kayak apa tuh...??) Gambar-gambar ini boleh berformat .GIF
atau .JPG dan boleh diletakkan diserver anda (dengan resiko space pada
server semakin berkurang ) atau kita mabil gambar dari servernya orang
lain (yang begini ini sering disebut dengan"mencuri bandwidh")
Teknik terakir ini lebih banyak resikonya. Misal apabila tiba-tiba
gambar itu dihapus oleh yang "empunya" atau server tempat
gambar yang kita curi sedang down, maka gambar yang dimaksud tak akan
muncul dan hasilnya seperti ini:
jelek bukan...???
Gambar pun pada garis besarnya dapat dibagi dua :Gambar diam (statis)
dan gambar bergerak. Gambar diam contohnya fotoku pada dokumen karya
sastra. sedang gambar bergerak contohnya seperti gambar diatas ini.
Namun demikian, cara menampilkannya gambar tersebut adalah sama,yaitu:
<IMG SRC="ITOK.JPG">
Untuk menampilkan gambar foto-ku.
<IMG SRC="ANJINGEMAIL.GIF">
Untuk menampilkan gambar anjing diatas.
Karena gambar
foto itok maupun gambar anjingemail diatas berada pada direktori yang
sama dengan dokumen HTML ini, maka itok cukup menuliskan seperti itu.
Namun untuk anda yang direktori home pagenya lain, maka anda harus
menuliskan path-nya secara lengkap.untuk menampilkan gambar anjing tadi,
anda harus menuliskan:
<IMG SRC="WWW.GEOCITIES.COM/ITOK_823R/ANJINGEMAIL.GIF">
MEMPERCANTIK WEB PAGE
Sampai disini
sebenarnya temen-temen sudah bisa membuat WEB page yang bagus (tergantung
kreativitas temen-temen tentunya) untuk dipasang di home page anda.
Namun demikian, itok akan memberikan sedikit cara agar WEB page anda
semakin indah.
Perhatikan latar
belakang dari WEB page ini. anda akan melihat warna hiau tua. Bagaimana
cara membuatnya?, anda cukup bisa menuliskan tag-nya sbb:
<BODY BGCOLOR="#008000">
Untuk backround yang indah misalnya pada awal
home page ku http://itok4.tripod.com
terlihat berupa kotak-kotak batu bata. anda bisa membuatnya dengan
menggunakan tag sbb:
<BODY BACKROUND="BATU-BATA.JPG">
Karena backround tersebuat tidak berada pada
direktori atau tidak ada didalam file anda. Maka anda cukup melakukan
langgakah sbb yaitu dengan mengambil backround untuk disimpan dalam disk
anda.
Cara mengambilnya yaitu: arahkan mouse anda
hingga hanya menunjuk latar belakang yang kita kehendaki, lalu klik
tombol kanan mouse. Nanti akan muncul pop-up menu pilih "save
backround as....", isikan nama untuk file gambar ini (misalnya :latar.gif),
lalu selesai langkah berikutnya, ubah body page pada WEB page anda
hingga menjadi seperti ini:
<BODY BACKROUND="LATAR.GIF">
OK!! AKU RASA SUDAH CUKUP GITU
AJA , SELAMAT MENCOBA !! UNTUK LANGKAH-LANGAH BERIKUTNYA DALAM MEMBUAT
HOMEPAGE !!TRIK-TRIKNYA...!! HARAP ANDA MENUNGGU SESI INFO INTERNET YANG
SELANJUTNYA!!
|