Pages

Sabtu, 18 Juni 2011

HTML


HTML (Hypertext Markup Language) adalah salah satu script Markup Language untuk membangun aplikasi Web. Markup Language sendiri adalah bahasa penandaan (markup) yang digunakan untuk memberi ciri khas pada sebuah dokumen atau teks yang ingin ditonjolkan. Pemberian tanda itu dilakukan dengan cara meletakkan tag diantara dokumen atau teks tersebut.

Command HTML biasanya disebut TAG. TAG digunakan untuk menentukan tampilan dari dokumen HTML.


Penulisan Tag :
<BEGIN TAG>  < /END TAG>
Contoh :
<HTML>
..............
</HTML>

Bentuk dari tag HTML sebagai berikut:
<ELEMENT ATTRIBUTE = value>
Contoh :
<BODY BGCOLOR=”red”>
Element = nama tag
Attribute = atribut dari tag
Value = nilai dari atribut

Struktur dokumen HTML
<html>
<head>
<title> ... </title>
</head>
<body>
...
</body>
</html>

Definisi :
<html> = mendefinisikan bahwa file tersebut bertipe HTML
<head> = menampung tag <title>
<title> = membuat judul halaman web
<body> = tempat menuliskan script HTML

List Item (LI)
List item di gunakan untuk mengelompokkan data baik berurutan (ordered list) maupun yang tidak berurutan (unordered list).
Tag = <ul>
Attribut = type
Value = disc (titik), square (kotak), circle (lingkaran)
Contoh : <ul type=”disc”><li>nama saya</li></ul>

Ordered List (Numbering)
Tag = <ol>
Attribut = type Value = I, i, A, a
Attribut = start Value = n (begin number)
Contoh : <ol type=”A” start=”1”><li>nama saya</li></ol>

Definition List
Definition List terdiri diapit oleh tag <DL> … </DL> dan <DT> tag menentukan definition term serta <DD> tag menentukan definition itu sendiri.
Contoh : <DL><DD> ................</DL>

FONT
Dengan tag <FONT> kita bisa menentukan format tampilan font dalam document HTML seperti color, size, style dan lainya.
Attribute
Color = Untuk menentukan warna font, bisa menggunakan nama font atau hexadecimal (#000000 - #ffffff)
Size = Untuk menentukan ukuran dari font
Face = Untuk menentukan jenis font biasanya dalam satu list ada beberapa font dan akan di baca mulai dari yang paling kiri.

COLOR
Color merupakan attribute yang bisa ditambahkan pada beberapa element seperti body, font, link dan lainya. Color dibagi dalam tiga ketegori warna primer yaitu red, green dan blue. Masing-masing color didefinisikan dalam dua digit hexadecimal number.
#FF0000 = Red
#00FF00 = Green
#0000FF = Blue
#000000 = Black
#FFFFFF = White

Alignment
Align attribute digunakan untuk menentukan perataan object dalam document HTML baik berupa text, object, image, paragraph, division dan lain-lain.
Value :
Left = rata kiri
Right = rata kanan
Center = rata tengah
Justify = rata kanan kiri

Quotes / Indenatasi
Untuk membuat indentasi paragraph kita bisa menggunakan BLOCKQUOTE, untuk indentasi pendek anda bisa gunakan element Q.

Grouping Element
Tag DIV dan SPAN di gunakan untuk mengelompokkan element-element HTML. Span digunakan untuk mendefinisikan inline content sementara div digunakan untuk block-level content.

Preformatted Text
Tag PRE digunakan untuk menampilkan text sesuai dengan format aslinya.
Contoh : <pre>           nama saya </pre>

Image
Untuk memasukkan image ke dalam halaman web, gunakan Tag Img.
Attribute pada tag Img
Align = posisi gambar (left, right, center, justify)
Width = menentukan panjang gambar (pixel)
Height = menentukan tinggi gambar (pixel)
Contoh :
<img src="foto.jpg" align=”center” width=”150” height=”100”>

Marquee
Tag Marquee digunakan untuk membuat tulisan/ objek bergerak.
Attribute :
Direction = menentukan arah gerakan (left, right, up, down)
Scrolldelay = menentukan delay pergerakan
Bgcolor = menentukan bgcolor dari marquee
Contoh :
<marquee direction=”up” scrolldelay=”100” bgcolor=”#000000”>suwecanata.co.cc</marquee>
Maka tulisan suwecanata.co.cc  akan bergerak.

Hyperlink
Link atau hyperlink memungkinkan para pengguna halaman web dapat melompat ke dan dari halaman ke halaman dalam web. Tag yang digunakan untuk link dalam web adalah tag <a>.
Alamat link bisa dikategorikan menjadi 2 yaitu :
  1. Absolute Address, merupakan full internet address (URL) yang meliputi protocolnetwork location dan path dan nama file.
    Contoh: http ://www.suwecanata.co.cc
  2. Relatif Address, URL yang tidak menyebutkan protocol dan network locationya (hanya path dan nama filenya).
    Contoh : <a href=”http://suwecanata.co.cc> suwecanata.co.cc </a>
    Tulisan suwecanata.co.cc akan nge-link ke alamat http://suwecanata.co.cc


Link ke Section tertentu dalam Document
Untuk membuat link ke section tertentu dalam satu dokumen gunakan property name untuk membuat nama tujuan dari link.
Syntax name anchor:
<a name=”nama”>Judul Topik</a>
untuk membuat link ke name :
<a haref=”#nama”>Menuju ke topic nama</a>

Link Ke bagian tertentu Document Lain
Untuk membuat link ke bagian tertentu dokumen lain anda bisa gunakan anchor name di document yang menjadi tujuan hyperlink.
Contoh :
<a haref=”latih_1.html#nama”>Menuju ke topic nama di dokumen latih_1.htm</a>

Table
Semua table dimulai dengan tag perintah <table> dan berhenti dengan tag perintah </table>. Baris dan kolom dalam table dapat dibuat dengan tag perintah <tr> (table row) untuk membuat baris, sedangkan tag perintah <td> (table detail) untuk membuat kolom. Tag perintah <th> digunakan untuk menambah header pada table.
Contoh pengunaan tabel :
<table border="1">
                <tr>
                                <th>Kode</th>
                                <th>Judul</th>
                                <th>Pengarang</th>
                </tr>
                <tr>
                                <td>BK001</td>
                                <td width="100">Membangun Aplikasi </td>
                                <td>M. Syafii</td>
                </tr>
                <tr>
                                <td>BK002</td>
                                <td width="400">Pemrograman Internet </td>
                                <td>Ady Wicaksono</td>
                </tr>
</table>

Merge Cell / Penggabungan Cell
Untuk menggabungkan dua atau beberapa cell dalam table digunakan atribut colspan dan rowspan yang dimiliki oleh Tag <TD>Atribut colspan untuk merge column dan rowspan untuk merge baris.

FORM
Form menyediakan sebuah metode yang efisien dan konsisten untuk mengumpulkan informasi. Tag <FORM> digunakan untuk membuat form dalam dokumen HTML.
Attribut :
Accept = Mendefinisikan MIME yang di izinkan oleh server yang memuat script untuk memproses form. Syntax: ACCEPT=”Internet Media Type”
Method = Menentukan bagaimana data akan di kirim ke server.
GET – data akan di kirim dengan menggunakan query string pada URL.
POST – data akan di kirim ke server sebagai block data ke script. Syntax: METHOD=”POST|GET”
Action = Menentukan lokasi dari script yang akan memproses data dari form Syntax: ACTION=”URL”

HTML Input Element
Pada saat membuat form, kita bisa meletakkan kontrol-kontrol pada form untuk inputan dari user. Semua kontrol biasanya di letakkan di antara tag <FORM></FORM> tapi juga bisa meletakkan kontrol diluar tag tersebut. Untuk menambahkan kontrol gunakan tag <input>.
Text = Input type=“text“
Checkbox = Input type=“checkbox“
Radio = Input type=“radio“
TextArea tag <TEXTAREA></TEXTAREA>
ComboBox / List Box (Selection)
Tag <SELECT> digunakan untuk membuat komponen combobox, sementara untuk item dari combobox menggunakan tag <OPTION>. 
Button = Input type=“button”

Tidak ada komentar:

Posting Komentar