Sistem Informasi

Belajar html tidaklah mudah, maka perlu ketekunan dan harus rajin mencoba dan mencoba.
Untuk mencoba, anda dapat mengunakan Edior Html Online dan pilih mode "Sumber" pada pojok kiri atas.
Sekarang kita mulai mempelajari apa itu html.

STRUKTUR DASAR DOKUMEN HTML
HTML merupakan singkatan dari HyperText Markup Language adalah script untuk menyusun dokumen-dokumen Web. Dokumen HTML disimpan dalam format teks reguler dan mengandung tag-tag yang memerintahkan web browser untuk mengeksekusi perintah-perintah yang dispesifikasikan.

Struktur dasar dokumen HTML adalah sebagai berikut:

OBJEKTIF:
Setelah mempelajari materi ini diharapkan anda dapat memahami penggunaan element-element untuk pemformatan teks.

MATERI:
Element BR(line break), Element P(paragraph), Element H1,H2,H3,H4,H5,H6(header), Element B(bold), Element I(italic), Element U(underline), Element PRE(preformated text), Element CENTER, Element BASEFONT, Element FONT, Element HR(horizontal rule)


ELEMENT BR (Line Break)
Element BR berfungsi untuk ganti baris. Dan element BR ini tidak mempunyai tag penutup.

Sintaks:
<br>

OBJEKTIF:
Setelah mempelajari materi ini diharapkan anda dapat memahami penggunaan element-element untuk pembuatan tabel.

MATERI:
Element TABLE, Element CAPTION, Element TH(table header), Element TR(table row), Element TD(table data)


ELEMENT TABLE
Element TABLE befungsi untuk membuat suatu data multidimensi yang terdiri atas kolom dan baris. Element ini mempunyai attribute seperti align, bgcolor, border, cellpadding(jarak antara tepi sel dengan isi sel), cellspacing(jarak antara sel), width(lebar tabel), height(tinggi tabel). Element TABLE berisikan element CAPTION, TH, TR dan TD.

Sintaks:
<table
   align="left"|"center"|"right"
   bgcolor="color"
   border="pixel"

OBJEKTIF:
Setelah mempelajari materi ini diharapkan anda dapat memahami penggunaan element-element untuk menghubungkan ke internal atau eksternal halaman web.

MATERI:
Element A


ELEMENT A
Element A befungsi untuk menghubungkan ke internal ataupun eksternal halaman web. Element ini mempunyai attribute href, name, dan target.  Attribute href berfungsi sebagai hypertext reference yang mempunyai nilai URI (uniform resource identifier) yang akan menghubungkan ke eksternal halaman web. Attribute name berfungsi untuk menghubungkan ke tempat tujuan dalam halaman web (anchor). Attribute target berfungsi untuk menampilkan halaman web pada suatu jendela frame atau jendela baru.

Sintaks:
<a href="uri" name="name" target="_blank"|"parent"|"_top"|"_self">
   ...........................
</a>

OBJEKTIF:
Setelah mempelajari materi ini diharapkan anda dapat memahami penggunaan element-element untuk menampilkan gambar.

MATERI:
Element IMG (Image)


ELEMENT IMG
Element IMG befungsi untuk menampilkan gambar. Element ini tidak mempunyai tag penutup dan mempunyai attribute yaitu align, alt (teks alternatif jika gambar tidak tampil), border, height, width, hspace (jarak kosong posisi horizontal, vspace (jarak kosong posisi vertikal), src (lokasi dari gambar itu disimpan beserta nama file-nya).

Sintaks:
<img
   align="left"|"right"|"top"|"middle"|"bottom"
   alt="text"
   border="pixel"
   width="pixel"|"%"
   height="pixel"|"%"
   hspace="pixel"
   vspace="pixel"
   src="uri">

OBJEKTIF:
Setelah mempelajari materi ini diharapkan anda dapat memahami penggunaan element-element frame untuk menampilkan informasi dalam bentuk subwindows.

MATERI:
Element FRAMESET, Element FRAME, Element NOFRAMES


ELEMENT FRAMESET
Element FRAMESET berfungsi untuk membagi isi jendela web browser menjadi beberapa bagian. Element ini mempunyai attribute yaitu cols (membagi jendela berdasarkan kolom), rows (membagi jendela berdasarkan baris), border , bordercolor, frameborder (untuk menampilkan border frame), dan framespacing (spasi antara frame). Element FRAMESET terletak di antara element HEAD dan BODY.

Sintaks:
<frameset
     cols="list"
     rows="list"
     border="pixel"
     bordercolor="color"
     frameborder="yes"|"no"
     framespacing="pixel">
   ...........................
</frameset>

OBJEKTIF:
Setelah mempelajari materi ini diharapkan anda dapat memahami penggunaan element-element untuk pembuatan form.

MATERI:
Element FORM, Element INPUT, Element SELECT, Element OPTION, Element TEXTAREA


ELEMENT FORM
Element FORM berfungsi untuk mendefinisikan form interaktif. Element ini mempunyai attribute yaitu action, dan method. Attribute action berisikan aksi terhadap form yang dikirim (URI) dan attribute method berisikan metode form melakukan proses pengiriman(GET/POST).

Sintaks:
<form action="action" method="GET"|"POST">
   ...........................
</form>

OBJEKTIF:
Setelah mempelajari materi ini diharapkan anda dapat memahami penggunaan element-element untuk pembuatan daftar urutan.

MATERI:
Element OL(ordered list), Element UL(unordered list), Element LI(list item).


ELEMENT OL (Orderd List)
Element OL berfungsi untuk membuat nomor daftar urut. Element ini mempunyai attribute yaitu start, dan type. Attribute start berfungsi untuk memberikan nilai awal dari daftar urutan, attribute type berfungsi untuk memilih bentuk daftar urutan yaitu A untuk abjad huruf besar, a untuk abjad huruf kecil, I untuk abjad romawi besar, i untuk abjad romawi kecil, 1 untuk angka decimal (default: start="1" type="1" ). Dalam element OL harus terdapat beberapa element LI.

Sintaks:
<ol start="number" type="A"|"a"|"I"|"i"|"1">
........................
</ol>