BELAJAR WEB ONLINE
BAHASA
HTML
(Hypertext Markup Language)
HTML Merupakan
suatu script dimana kita bisa menampilkan informasi dan daya kreasi kiata lewat
Internet.HTML memiliki perbedaan dengan dokumen teks biasa.misalnya:perbedaan
yang paling men-colok adalah pada dokumen word,banyaknya karakter akan
terbatasi oleh besarnya kertas.Sedangkan HTML tak memiliki batasan teks.
HTML adalah
Bahasa pemrograman yang fleksibel di mana kita bisa meletakkan skrip dari
bahasa pemrograman lain seperti JAVA,Visual Basic,C dan lain-lain.jika HTML
tersebut tidak dapat mendukung suatu perintah pemrograman tertentu.Browser
tidak akan menampilkan kotak dialog”Syntax Error” jika terdapat penulisan kode
yang keliru pada skrip HTML sepanjang kode-kode yang kita tuliskan merupakan
kode-kode HTML tanpa penambahan kode-kode dari luar seperti java. Oleh karena itu,jika terjadi syntax
error pada skrip HTML ,efek yang paling jelas adalah HTML tersebut tak akan
ditampilkan pada halaman jendela Browser.
1.
Sejarah
HTML
Konsep hypertext bagi kebanyakan orang
merupakan sesuatu yang baru.ide pembuatan
Hypertext itu sendiri muncul
tatkala kita akan memberikan suatu penjelasan khusus terhadap dokumen lainnya
lewat suatu link.HTML memiliki arti bahwa dalam suatu dokumen teks terdapat dua
bagian yang khusus,yaitu bagian teks itu sendiri dan bagian elemen-elemen yang
menjelaskan teks-teks itu.Konsep HTML diciptakan pertama kali oleh IBM pada
tahun 1980 pada saat tercetus ide untuk meletakkan elemen-elemen yang menandai
bagian suatu dokumen seperti judul,alamat,dan isi dokumen.Lalu ,pada akhirnya
elemen-elemen itu menjadi suatu program untuk melakukan pemformatan dokumen
secara otomatis.Bahasa pemrograman untuk melakukan tugas tersebut disebut
markup Language,atau lebih lengkapnya IBM menamai program tersebut Generalized
Markup Language(GML)
a.
SGML KE HTML
HTML dulu merupakan salah satu bagian dari SGML ini.Seorang peneliti yang
bernama Tim Berners-Lee dari CERN-yang kini menjadi direktur W3C mengemukakan
suatu ide tentang pembuatan suatu skrip bahasa pemrograman dan dokumen yang
bisa diakses oleh seluruh komputer tanpa melihat jenis platform-nya apakah
windows,UNIX,Linux,dan sebagainya.Semenjak itu HTML justru lebih populer
daripada SGML
2.
Perkembangan HTML
Hingga kini HTML telah mencapai versi 3.02
yang telah kita pakai sekarang ini
I.
HTML VERSI 1.0
HTML Versi 1.0 merupakan HTML Pionir yang di dalamnya masih terdapat banyak sekali kelemahan
sehingga wajar jika tampilanyang di hasilkan sangat sederhana.Kemampuan yang
dimiliki versi 1.0 ini antara lain heading,paragraf,hyper-
Text,list,serta cetak tebal dan miring pada teks.Versi ini juga mendukung
peletakan image pada dokumennya tanpa memperbolehkan meletakkan text di
sekelilingnya.
II.
HTML VERSI 2.0
Pada versi ini,penambahan kualitas HTML terletak pada kemampuan untuik
menampilkan suatu form pada dokumen.Dengan adanya form ini ,maka kita dapat
memasukkan nama,alamat,serta saran dan kritikan.HTML Versi 2.0 ini merupakan
pionir dari adanya Homepage interaktif.
III.
HTML VERSI 3.0
Versi HTML 3.0 menambahkan beberapa fasilitas baru seperti FIGURE yang merupakan perkembangan dari IMAGE
untuk meletakkan gambar dan tabel.selain itu,HTML ini mendukung adanya
rumus-rumus matematika dalam dokumennya.
IV.
HTML VERSI 3.2
HTML Versi 3.2 merupakan HTML yang sering kita gunakan saat ini.Di
dalamnya terdapat suatu teknologi untuk meletakkan teks di sekeliling
gambar,gambar sebagai latar belakang,tabel,frame stylesheet,dan
lain-lain.Selain itu pada HTML Versi ini,kita bisa menggunakan script di luar
HTML untuk mendukung kinerja HTML kita tersebut seperti JAVASCRIPT,VBSCRIPT,dan
lain-lain
V.
HTML VERSI 4.0
HTML Versi 4.0 ini merupakan HTML Versi terakhir pada saat buku ini
dibuat.HTML ini memuat banyak sekali perubahan dan revisi dari pendahulunya
.Perubahan ini hampir terjadi di segala perintah-perintah HTML seperti
table,image,link,text,meta,imagemaps,form,dan lain-lain.Selain Itu versi ini
menambahkan beberapa perintah seperti
ABBR,ACRONYM,BDO,BUTTON,FIELDSET,INS,LABEL,LEGEND,OBJECT,OPTGROUP,PARAM,TBODY,TFOOT,THEAD,dan
Q.
3.
Mendesain
HTML
Mendesain HTML berarti melakukan suatu tindakan pemrograman.itu berarti
jika anda desainer Homepage,maka anda adalah seorang programmer.Mendesain
Homepage tidaklah hanya sebatas menuliskan perintah-perintah tertentu agar HTML
kita dapat di akses di Browser.Mendesain Homepage adalah suatu seni
tersendiri.Homepage-yang merupakan implementasi dari HTML-merupakan refleksi
dari orang yang membuatnya.Untuk itu kita perlu mendesainnya denagn baik agar
para netter merasa tertarik dan betah untuk mengunjunginya(bahkan kalau bisa
memboookmark-nya).Mendesain HTML dapat dilakukan dengan dua cara,yaitu dengan
menggunakan HTML Editor,seperti Netcape Navigator Gold,microsoftword,dan
lain-lain,atau menuliskan script sendiri.Ada kelebihan dan kekurangan dari dua
caradiatas.Kelebihan cara pertama,proses desain homepage dapat langsung di
lihat dan energi kita tidak banyak di keluarkan.Namun kelemahanny6a dengan HTML
Editor ,kita tidak bisa mensisipi suatu perintah tertentu seperti
frame,form,dan lain-lain.Sedangkan dengan perintah script sendiri,energikita
cukup banyak terkuras,dan hasilnya tak langsung dapat di lihat.script tersebut
harus di buka oleh web Browser.Namun kelebihannya kita bebas menyisipi suatu
perintah-bahkan perintah yang bukan merupakan default HTML,seperti JAVASCRIPT.
Beberapa web Browser ,Seperti Netscape Navigator,memiliki suatu fasilitas
untuk mendesain Homepage lewat HTML Editornya.Cara mendesain seperti ini akan
terasa lebih menyenangkan di mana kita tidak perlu menghafal kode-kode perintah
dan untuk HTML Editor yang mendukung kemampuan WYSIWYG.hasil desain homepagenya
dapat langsung kita lihat.HTML Editor ini bisa dimanfaatkan bagi mereka yang
masih awam terhadap bahasa pemrograman HTML ini.caranya,setelah mendesain suatu
Homepage tertentu.htm tersebut kita buka lewat text-editor,seperti Notepad for
windows.
4.
Bagian-Bagian
pada HTML
HTML terdiri dari beberapa bagian fungsinya
sebagai tanda suatu kelompk perintah tertentu,misalnya perintah form,frame.
1) Elemen dan Tag
Elemen pada HTML dapat didefinisikan sebagai suatu kode tertentu yang
akan menyediakan tempat untuk meletakkan beberapa kode di dalamnya.Berbeda
dengan Tag yang menangani satu kode saja.Untuk lebih jelasnya perhatikan skema
elemen di bawah ini.
<HTML>
.......elemen Pembuka..........
<HEAD>
.......di sini dapat anda masukkan kode-kode untuk untuk menuliskan
keterangan tentang dokumen anda........
</HEAD>
<BODY>
.....DISINI DAPAT ANDA MASUKKAN KODE-KODE UNTUK ME-LAYOUT TAMPILAN
Homepage anda..........
</BODY>
</HTML>
......ELEMEN PENUTUP.............
2) Referensi Perintah –perintah HTML
Referensi
Tag-tag HTML
Tag
|
PENJELASAN
|
NN
|
IE
|
DTD
|
<!--...-->
|
Memberi
komentar
|
3.0
|
3.0
|
|
<!DOCTYPE>
|
Difinisi
dokumen
|
|||
<a>
|
Membuat
link
|
3.0
|
3.0
|
|
<abbr>
|
abbr
|
6.2
|
||
<acronym>
|
akronim
|
6.2
|
4.0
|
|
<address>
|
Menuliskan
Alamat
|
4.0
|
4.0
|
|
<applet>
|
Menuliskan
applet
|
2.0
|
3.0
|
|
<area>
|
Menjadi
area
|
3.0
|
3.0
|
|
<b>
|
Menebalkan
huruf
|
3.0
|
3.0
|
|
<base>
|
Link ke
suatu dokumen
|
3.0
|
3.0
|
|
<basefont>
|
Default
ukuran,warna ,jenis font
|
3.0
|
3.0
|
TF
|
<bdo>
|
bdo
|
6.2
|
5.0
|
STF
|
<big>
|
Membesarkan
teks
|
3.0
|
3.0
|
STF
|
<blockquote>
|
Menuliskan
teks khusus
|
3.0
|
3.0
|
STF
|
<body>
|
Menyatakan
isi suatu dokumen
|
3.0
|
3.0
|
STF
|
<br>
|
Menuliskan
baris baru
|
3.0
|
3.0
|
STF
|
<button>
|
Memberikan
tombol
|
6.2
|
4.0
|
STF
|
<caption>
|
Menuliskan
judul pada tabel
|
3.0
|
3.0
|
STF
|
<center>
|
Menegahkan
teks
|
3.0
|
3.0
|
TF
|
<cite>
|
Referensi
teks ke sumber yang lain
|
3.0
|
3.0
|
STF
|
<code>
|
Menuliskan
suatu teks sebagai kode program
|
3.0
|
3.0
|
STF
|
<col>
|
Membuat
kolom
|
3.0
|
STF
|
|
<colgroup>
|
colgoup
|
3.0
|
STF
|
|
<dd>
|
dd
|
3.0
|
3.0
|
STF
|
<del>
|
Menghapus
teks
|
6.2
|
4.0
|
STF
|
<dir>
|
Menampilkan
daftar list
|
3.0
|
3.0
|
TF
|
<div>
|
Mensetting
suatu kelompok teks menjadi perataan teks
|
3.0
|
3.0
|
STF
|
<dfn>
|
mendefinisi
|
3.0
|
STF
|
|
<dl>
|
Menampilkan
list
|
3.0
|
3.0
|
STF
|
<dt>
|
dt
|
3.0
|
3.0
|
STF
|
<em>
|
em
|
3.0
|
3.0
|
STF
|
<fieldset>
|
Menampilkan
fieldset
|
6.2
|
4.0
|
STF
|
<font>
|
Mengatur
font,ukuran,warna
|
3.0
|
3.0
|
TF
|
<form>
|
Membuat
form
|
3.0
|
3.0
|
STF
|
<frame>
|
Membuat
frame
|
3.0
|
3.0
|
F
|
<frameset>
|
Mensetting
file-file sebagai frame
|
3.0
|
3.0
|
F
|
<h1> to <h6>
|
header
|
3.0
|
3.0
|
STF
|
<head>
|
Membuat
header
|
3.0
|
3.0
|
STF
|
<hr>
|
Membuat
suatu garis
|
3.0
|
3.0
|
STF
|
<html>
|
Dokumen
html
|
3.0
|
3.0
|
STF
|
<i>
|
Membuat
suatu teks miring
|
3.0
|
3.0
|
STF
|
<iframe>
|
Membuat
i-frame
|
6.0
|
4.0
|
TF
|
<img>
|
Menampilkan
gambar
|
3.0
|
3.0
|
STF
|
<input>
|
Memasukkan
data
|
3.0
|
3.0
|
STF
|
<ins>
|
Memasukkan
teks
|
6.2
|
4.0
|
STF
|
<isindex>
|
isindex
|
3.0
|
3.0
|
TF
|
<kbd>
|
Memasukkan
teks pada keyboard
|
3.0
|
3.0
|
STF
|
<label>
|
Membuat
label
|
6.2
|
4.0
|
STF
|
<legend>
|
legend
|
6.2
|
4.0
|
STF
|
<li>
|
li
|
3.0
|
3.0
|
STF
|
<link>
|
Membuat
link
|
4.0
|
3.0
|
STF
|
<map>
|
Link ke
map
|
3.0
|
3.0
|
STF
|
Color
Name
|
Color
HEX
|
Color
|
