BAB II LANDASAN TEORI
2.8. Pemrogaman Web
2.8.1 HTML (Hypertext Markup Language)
HTML (Hypertext Markup Language) adalah suatu bahasa yang digunakan untuk membuat halaman hypertext/web pada internet. Dengan konsep hypertext ini, untuk membaca suatu dokumen tidak harus dilakukan secara urut, baris demi baris, halaman demi halaman, melainkan dapat melompat dari satu topik ke topik lainnya yang dipilih secara langsung, seperti halnya pada online Help dari suatu aplikasi Windows.
HTML dirancang untuk platform independent yang artinya dapat digunakan tanpa tergantung pada suatu platform tertentu. Isi dokumen HTML pada layer yang beresolusi rendah tidak akan berbeda dengan isi yang terlihat
pada layar grafis dengan resolusi tinggi. Perbedaan utama hanya terlihat pada warna dan gambar yang tidak bisa ditampilkan pada monitor yang beresolusi rendah/non grafis, sedangkan isinya sama.
Setiap level dari HTML merupakan pengembangan dari level HTML se-belumnya. Ini berarti bahwa setiap level baru HTML memperbaiki dan me-nambahkan kemampuan–kemampuan dan fasilitas–fasilitas baru tanpa mengubah cara kerja dari level HTML sebelumnya.
Ciri utama dari dokumen HTML adalah selalu ditandai dengan awalan <HTML> dan diakhiri dengan </HTML>, yang menyatakan bahwa isi dokumen tersebut adalah merupakan dokumen HTML. Selain itu juga terdapat Elemen dan Tag. Elemen dan Tag tersebut yang membedakan dokumen HTML dengan dokumen lainnya. Elemen dan Tag tersebut juga berfungsi untuk memformat dan menandai suatu bagian tertentu dari dokumen HTML. Elemen pada dokumen HTML dibagi menjadi dua kategori utama, yaitu elemen–elemen <HEAD> yang memberikan informasi tentang dokumen tersebut, seperti judul dokumen. Sedangkan Elemen yang lain yaitu elemen–elemen <BODY> yang berfungsi menentukan bagaimana isi suatu dokumen ditampilkan oleh browser, seperti paragraf, list, tabel dan lain– lain.
Struktur Dokumen HTML terlihat sebagai berikut <HTML> <HEAD> *****Bagian Head***** </HEAD> <BODY> *****Bagian Body*****
</BODY> </HTML>
2.8.1.1. Tabel
Informasi dalam tabel biasanya ditampilkan secara ringkas dalam beberapa baris sehingga membuat orang lebih mudah untuk menyerap informasi yang disampaikan.
Dalam membuat tabel diperlukan beberapa bagian dasar pada tag–tag tabel di-antaranya adalah :
1. Table Row atau baris tabel adalah baris–baris pada suatu tabel, yang di-nyatakan dengan pasangan tag <TR>…..</TR>
2. Table Data atau data tabel, yaitu tempat dimana memasukkan informasi dalam suatu tabel, yang dinyatakan dengan pasangan tag <TD>…..</TD>
3. Table Header adalah judul tabel yang terletak pada bagian paling atas atau paling kiri dari suatu tabel, yang dinyatakan dengan pasangan tag <TH>…..</TH>
4. Caption adalah judul tabel yang terletak di bagian luar suatu tabel, bagian atas atau bagian bawah tabel. Pasangan tag yang digunakan adalah <CAPTION>….</CAPTION>
Selain elemen–elemen yang tersebut diatas, tabel juga mempunyai bermacam–macam atribut yang berguna antara lain :
1. Border, untuk membuat batas tepi dari suatu tabel 2. Width untuk mengatur lebar tabel.
3. Align untuk mengatur bentuk horizontal data di dalam tabel, seperti kiri, tengah atau bagian kanan.
4. Valign, untuk mengatur perataan vertikal dari suatu data, seperti atas, tengah atau bawah.
5. Cellspacing dan Cellspading, untuk mengatur spasi antar sel dan spasi didalam sel. Sel adalah tempat dimana data atau judul kolom berada.
6. Bgcolor, untuk menentukan warna tabel.
2.8.1.2. Form
Form digunakan untuk membuat formulir di halaman web. Seperti namanya, form digunakan untuk mengambil input dari user dan akan diolah lebih lanjut. Form pada halaman web didefinisikan dengan pasangan tag <FORM> dan </FORM>. Tag <FORM> memiliki dua atribut yang penting, yaitu atribut METHOD untuk menentukan bagaimana form diberlakukan dan atribut ACTION yang sering diisikan URL tempat pemrosesan form selanjutnya. Struktur dasar
form adalah :
<FORM>[METHOD=”[POSTGET]”ACTION=”URL”]> …
…
</FORM>
form memiliki beberapa komponen antara lain : 1. Input Box
Input Box adalah inputan pada form yang memungkinkan user me-masukkan string dalam satu baris. Untuk membuat Input Box HTML me-nyediakan tag <INPUT> dan memanfaatkan atribut TYPE=”Text”. Atribut pada tag Input Box lainnya adalah NAME untuk menyatakan nama dari Input Box tersebut,
Value untuk menyatakan nilai dari suatu input dan SIZE untuk menyatakan panjang dari sebuah input.
Syntax penggunaan :
<INPUT TYPE=”Text” NAME=”VarNama” SIZE=”15” VALUE= ”Yes”> 2. Radio Button
Radio Button juga merupakan inputan dari form. Untuk membuat Radio Button ini memanfaatkan atribut TYPE=”Radio”. Untuk lebih jelasnya dapat dilihat pada contoh dibawah ini :
<INPUT CHECKED TYPE=”Radio” NAME=”Kelamin” VALUE= ”Pria”>Pria
<INPUT TYPE=”Radio” NAME=”Kelamin” VALUE=”Wanita”>Wanita
Dari contoh diatas dapat dilihat atribut CHECKED yang menandakan bahwa Radio Button tersebut diaktifkan. Pada Radio Button ini hanya memberikan satu nilai/pilihan dalam satu form.
3. Checked Box
Pada input tipe Checked Box user dapat memilih lebih dari satu pilihan. Pilihan ini biasanya digunakan untuk memasukkan data yang sifatnya opsional. Sama seperti Input Box dan Radio Button, Checked Box ini di-gunakan pada atribut <INPUT>. Berikut syntak penulisan dalam penggunaan check box:
Hobi :
<INPUT TYPE=”Checkbox” NAME=”Hobi” VALUE=”Soccer”> Sepakbola <INPUT CHECKED TYPE=”Checkbox” NAME=”Hobi” VALUE= ”Badminton”>Bulutangkis
<INPUT CHECKED TYPE=”Checkbox” NAME=”Hobi” VALUE= ”Internet”> Internet
Pada contoh diatas dapat dilihat bahwa user dapat memilih hobi lebih dari satu hobi yaitu bulutangkis dan internet.
4. Button
Ada dua macam tombol yang ada pada form HTML. Yang pertama dengan memberikan submit pada atribut type atau dengan menggunakan atribut reset. Submit digunakan untuk melakukan action pada tag <FORM>, sedangkan reset digunakan untuk menghapus nilai pada seluruh isi form.
Syntaknnya sebagai berikut :
<INPUT TYPE=”Submit” VALUE=”Send info”> <INPUT TYPE=”Reset” VALUE=”Clear form”>