Pelajaran TIK adalah pelajaran yang mudah, tinggal kita para siswa khususnya siswa SMPK PENABUR HI mau banyak latihan utamanya praktek setelah kita menguasai praktek tinggal kita konversikan ke teori. Semuanya menjadi mudah asalkan kita mau berusaha.

Tag HTML

PANDUAN HTML

Judul Asli: THE BARE BONES GUIDE TO HTML
oleh Kevin Werbach

Versi terakhir dokumen ini terdapat di http://werbach.com/barebones/.


ELEMEN DASAR



Jenis Dokumen

HTML/HTML

(terdapat pada awal dan akhir dari file HTML)


Judul

TITLE/TITLE

(harus selalu terdapat pada mukadimah)


Mukadimah (Header)

HEAD/HEAD

(keterangan umum, seperti judul dsb.)


Batang Tubuh

BODY/BODY

(isi dari halaman HTML)

  

ANCANGAN STRUKTURAL



Kepala

H?/H?

(Heading - spesifikasi untuk menetapkan 6 tingkatan kepala)


Penataan (Align) Kepala

H? ALIGN=LEFT|CENTER|RIGHT/H? [*]



Bagian (Division)

DIV/DIV



Penataan Bagian

DIV ALIGN=LEFT|RIGHT|CENTER/DIV



Kutipan Blok (Block Quote)

BLOCKQUOTE/BLOCKQUOTE [*]

(tampilan dengan jeda terhadap batas pinggir)


Penekanan (Emphasis)

EM/EM

(umumnya huruf miring)


Penguatan (Strong Emphasis)

STRONG/STRONG

(umumnya huruf tebal)


Kutipan singkat (Citation)

CITE/CITE

(umumnya huruf miring)


Kode

CODE/CODE

(Code - untuk source code listings)


Contoh Keluaran

SAMP/SAMP

(Sample Output)


Masukan Papan Ketik

KBD/KBD

(Keyboard Input)


Variabel

VAR/VAR

(Variable)


Definisi

DFN/DFN

(Definition - jarang dipakai)


Alamat Pengarang (Author's Address)

ADDRESS/ADDRESS



Huruf ukuran Besar

BIG/BIG



Huruf Ukuran Kecil

SMALL/SMALL


  

FORMAT TAMPILAN



Huruf Tebal

B/B

(Bold)


Huruf Miring

I/I

(Italic)

N3.0b

Garis Bawah

U/U

(Underline - jarang digunakan)


Huruf Coret

STRIKE/STRIKE

(Strikeout - jarang digunakan)

N3.0b

Huruf Coret

S/S

(Strikeout - jarang digunakan)


Huruf Geser Bawah

SUB/SUB

(Subscript)


Huruf Geser Atas

SUP/SUP

(Superscript)


Huruf Mesin Ketik

TT/TT

(Typewriter - huruf berjarak tetap)


Pra-format (Preformatted)

PRE/PRE

(menampilkan dengan jarak pra-format)


Jarak Huruf

PRE WIDTH=?/PRE

(mengatur jarak huruf)


Rata Tengah

CENTER/CENTER [*]

(Center - berlaku untuk teks maupun gambar)

N1.0

Huruf Kedip

BLINK/BLINK

(Blinking - tag terlucu sampai kini)


Ukuran Huruf

FONT SIZE=?/FONT

(Font Size - boleh diisi dari 1 sampai 7)


Rubah Ukuran Huruf

FONT SIZE="+|-?"/FONT


N1.0

Basis Ukuran Huruf

BASEFONT SIZE=?

(boleh diisi 1 sampai 7; ukuran standard/default=3)


Warna Huruf

FONT COLOR="#$$$$$$"/FONT


N3.0b

Pilih Jenis Huruf

FONT FACE="***"/FONT


N3.0b

Teks Multi Kolom

MULTICOL COLS=?/MULTICOL


N3.0b

Jarak Batas Kolom

MULTICOL GUTTER=?/MULTICOL

(default = 10 pixels)

N3.0b

Lebar Kolom

MULTICOL WIDTH=?/MULTICOL


N3.0b

Celah (Spacer)

SPACER


N3.0b

Jenis Celah

SPACER TYPE=horizontal| vertical|block


N3.0b

Ukuran Celah

SPACER SIZE=?


N3.0b

Dimensi Celah

SPACER WIDTH=? HEIGHT=?


N3.0b

Penataan Celah

SPACER ALIGN=left|right|center


  

ACUAN DAN GRAFIK



Acuan pada dokumen tertentu

A HREF="URL"/A



Acuan pada sasaran dalam dokumen

A HREF="URL#***"/A

(bila terdapat pada dokumen lain)

A HREF="#***"/A

(bila terdapat pada dokumen yang sama)

N2.0

Jendela Sasaran (Target Window)

A HREF="URL" TARGET="***| |_blank|_self|_parent|_top"/A



Penamaan sasaran pada dokumen

A NAME="***"/A



Kaitan(Relationship)

A REL="***"/A

(jarang digunakan)


Kaitan terbalik (Reverse Relationship)

A REV="***"/A

(jarang digunakan)


Peragaan Gambar

IMG SRC="URL"



Penataan Letak Gambar

IMG SRC="URL" ALIGN=TOP|BOTTOM|MIDDLE|LEFT|RIGHT


N1.0

Penataan Letak Gambar

IMG SRC="URL" ALIGN=TEXTTOP| ABSMIDDLE|BASELINE|ABSBOTTOM



Alternatif Teks

IMG SRC="URL" ALT="***"

(saat gambar belum/tidak ditampilkan)


Daerah Gambar (Imagemap)

IMG SRC="URL" ISMAP

(membutuhkan program script)


Daerah Gambar pihak klien

IMG SRC="URL" USEMAP="URL"



Uraian Daerah Gambar

MAP NAME="***"/MAP



Pembagian Daerah Gambar

AREA SHAPE="RECT" COORDS=",,," HREF="URL"|NOHREF



Dimensi Gambar

IMG SRC="URL" WIDTH=? HEIGHT=?

(in pixels)


Garis Batas

IMG SRC="URL" BORDER=?

(dalam satuan pixel)


Ruang Pembatas

IMG SRC="URL" HSPACE=? VSPACE=?

(dalam satuan pixel)

N1.0

Gambar Low-Res Proxy

IMG SRC="URL" LOWSRC="URL"


N1.1

Pemindahan Tarik

META HTTP-EQUIV="Refresh" CONTENT="?; URL=URL"

(Client Pull)

N2.0

Objek Cantum

EMBED SRC="URL"

(Embed Object - mencantumkan objek pada dokumen)

N2.0

Ukuran Objek

EMBED SRC="URL" WIDTH=? HEIGHT=?


  

PEMISAH



Paragraf

P/P [*]

(tag penutup seringkali tak diperlukan)


Align Text

P ALIGN=LEFT|CENTER|RIGHT/P[*]



Pndah Baris

BR

(pindah ke baris berikut)


Putus Penataan Baris

BR CLEAR=LEFT|RIGHT|ALL

(Clear Textwrap)


Garis Datar

HR

(Horizontal Rule)


Penataan Letak Garis

HR ALIGN=LEFT|RIGHT|CENTER



Tebal Garis

HR SIZE=?

(dalam satuan pixel)


Lebar Garis

HR WIDTH=?

(dalam satuan pixel)

N1.0

Lebar Garis Persentasi

HR WIDTH="%"

(dalam persentasi terhadap lebar halaman)


Garis Pejal

HR NOSHADE

(Solid Line - tanpa pola 3D)

N1.0

Tanpa Ganti Baris

NOBR/NOBR

(No Break - mencegah ganti baris)

N1.0

Sambung Suku Kata

WBR

(Word Break - letak ganti baris bila diperlukan)

  

DAFTAR




Daftar Tanpa Nomor

ULLI/UL

(Unordered List - Cantumkan LI sebelum tiap butir)



Kompak

UL COMPACT/UL

(Compact)



Jenis Butiran

UL TYPE=DISC|CIRCLE|SQUARE

(Bullet Type - berlaku umum bagi butir terdaftar)


LI TYPE=DISC|CIRCLE|SQUARE

(berlaku khusus pada butir ini dan selanjutnya)



Daftar Bernomor

OLLI/OL

(Ordered List - Cantumkan LI sebelum tiap butir)



Kompak

OL COMPACT/OL




Jenis Penomoran

OL TYPE=A|a|I|i|1

(berlaku umum untuk semua butir dalam daftar)


LI TYPE=A|a|I|i|1

(berlaku khusus pada butir ini dan selanjutnya)



Nomor Mulai

OL START=?

(berlaku umum untuk semua butir dalam daftar)


LI VALUE=?

(berlaku khusus pada butir ini dan selanjutnya)



Daftar Definisi

DLDTDD/DL

(Definition List - DT=istilah, DD=uraian)



Kompak

DL COMPACT/DL




Daftar Menu

MENULI/MENU

(Cantumkan LI sebelum butir menu)



Kompak

MENU COMPACT/MENU




Daftar Direktori

DIRLI/DIR

(Cantumkan LI sebelum tiap butir direktori)



Kompak

DIR COMPACT/DIR



  

LATAR BELAKANG DAN WARNA



Latar Belakang Gambar

BODY BACKGROUND="URL"

(Tiled Background)


Warna Latar Belakang

BODY BGCOLOR="#$$$$$$"[*]

(Background Color - urutan: merah/hijau/biru)


Warna Huruf Teks

BODY TEXT="#$$$$$$" [*]



Warna Acuan

BODY LINK="#$$$$$$" [*]



Acuan Lepas Kunjung

BODY VLINK="#$$$$$$" [*]

(Visited Link)


Acuan Aktif

BODY ALINK="#$$$$$$" [*]

(Active Link)

(Info lanjut di http://werbach.com/web/wwwhelp.html#color)

 

HURUF SPESIAL(these must all be in lower case)



Special Character

&#?;

(where ? is the ISO 8859-1 code)


<

'<



>

'>



&

'&amp



"

'quot



Registered TM

®'&reg



Copyright

©'&copy



Spasi tak putus

'&nbsp

Non-breaking Space

(Daftar lengkap huruf khusus terdapat di http://www.uni-passau.de/%7Eramsch/iso8859-1.html)

 

FORMULIR



Rancangan Formulir

FORM ACTION="URL" METHOD=GET|POST/FORM

Define Forms

N2.0

Mengirimkan File

FORM ENCTYPE="multipart/form-data"/FORM

File Upload


Input Field

INPUT TYPE="TEXT|PASSWORD|CHECKBOX|RADIO| IMAGE|HIDDEN|SUBMIT|RESET"



Nama Field

INPUT NAME="***"



Nilai Field

INPUT VALUE="***"



Kotak Periksa

INPUT CHECKED

(checkboxes dan radio boxes)


Ukuran Field

INPUT SIZE=?

(dalam satuan jumlah karakter)


Panjang Maksimum

INPUT MAXLENGTH=?

(dalam satuan karakter)


Daftar Pilihan

SELECT/SELECT

Selection List


Nama Daftar Pilihan

SELECT NAME="***"/SELECT



Jumlah Pilihan

SELECT SIZE=?/SELECT



Banyak Pilihan

SELECT MULTIPLE

(dapat memilih lebih dari satu)


Pilihan

OPTION

(butir yang dapat dipilih)


Pilihan Default

OPTION SELECTED



Ukuran Input Box

TEXTAREA ROWS=? COLS=?/TEXTAREA



Nama Input Box

TEXTAREA NAME="***"/TEXTAREA


N2.0

Rangkuman Teks

TEXTAREA WRAP=OFF|VIRTUAL|PHYSICAL/TEXTAREA

Wrap Text

  

TABEL



Rancangan Tabel

TABLE/TABLE [*]



Garis Batas Tabel

TABLE BORDER=?/TABLE



Celah Sel

TABLE CELLSPACING=?

Cell Spacing


Penyangga Sel

TABLE CELLPADDING=?

Cell Padding


Lebar Tabel

TABLE WIDTH=?

(dalam satuan pixel)


Lebar Tabel Persentasi

TABLE WIDTH="%"

(dalam satuan persen terhadap lebar halaman)


Baris dalam Tabel

TR/TR



Penataan Letak Baris

TR ALIGN=LEFT|RIGHT| CENTER|MIDDLE|BOTTOM
VALIGN=TOP|BOTTOM|MIDDLE



Sel dalam Tabel

TD/TD

(harus ada dalam setiap baris tabel)


Penataan Letak Sel

TD ALIGN=LEFT|RIGHT| CENTER|MIDDLE|BOTTOM
VALIGN=TOP|BOTTOM|MIDDLE



Tanpa Ganti Baris

TD NOWRAP



Rentang Kolom

TD COLSPAN=?

Columns to span


Rentang Baris

TD ROWSPAN=?

Rows to span

N1.1

Lebar Sel

TD WIDTH=?

(dalam satuan pixel)

N1.1

Lebar Sel Persentasi

TD WIDTH="%"

(dalam satuan persen terhadap lebar tabel)

N3.0b

Warna Sel

TD BGCOLOR="#$$$$$$"



Kepala Tabel

TH/TH

(Table Header - seperti data dengan Bold dan Center)


Penataan Letak Kepala Tabel

TH ALIGN=LEFT|RIGHT| CENTER|MIDDLE|BOTTOM
VALIGN=TOP|BOTTOM|MIDDLE



Tanpa Baris Baru

TH NOWRAP



Rentang Kolom

TH COLSPAN=?

Columns to Span


Rentang Baris

TH ROWSPAN=?

Rows to Span

N1.1

Lebar Kepala Tabel

TH WIDTH=?

(dalam satuan pixel)

N1.1

Lebar Persentasi

TH WIDTH="%"

(dalam persentasi terhadap lebar tabel)

N3.0b

Warna Kepala Tabel

TH BGCOLOR="#$$$$$$"



Keterangan Tabel

CAPTION/CAPTION

Caption


Penataan Keterangan

CAPTION ALIGN=TOP|BOTTOM

(di atas / di bawah tabel)

 

FRAMES


N2.0

Dokumen dalam Frame

FRAMESET/FRAMESET

(sebagai pengganti BODY)

N2.0

Tinggi Baris Frame

FRAMESET ROWS=,,,/FRAMESET

(dalam satuan pixel atau %)

N2.0

Tinggi Baris Frame

FRAMESET ROWS=*/FRAMESET

(* = ukuran relatif)

N2.0

Lebar Kolom Frame

FRAMESET COLS=,,,/FRAMESET

(dalam satuan pixel atau %)

N2.0

Lebar Kolom Frame

FRAMESET COLS=*/FRAMESET

(* = ukuran relatif)

N3.0b

Lebar Garis Batas

FRAMESET BORDER=?


N3.0b

Garis Batas

FRAMESET FRAMEBORDER="yes|no"


N3.0b

Warna Garis Batas

FRAMESET BORDERCOLOR="#$$$$$$"


N2.0

Rancangan Frame

FRAME

(isi dari frame individu)

N2.0

Tampilan Dokumen Frame

FRAME SRC="URL"


N2.0

Nama Frame

FRAME NAME="***"|_blank|_self| _parent|_top


N2.0

Lebar Batas

FRAME MARGINWIDTH=?

(batas kiri dan kanan)

N2.0

Tinggi Batas

FRAME MARGINHEIGHT=?

(batas atas dan bawah)

N2.0

Scrollbar?

FRAME SCROLLING="YES|NO|AUTO"

Memungkinkan scrolling pada frame

N2.0

Ukuran Frame tak bisa diubah

FRAME NORESIZE


N3.0b

Batas Frame

FRAME FRAMEBORDER="yes|no"


N3.0b

Warna Garis Batas

FRAME BORDERCOLOR="#$$$$$$"


N2.0

Isi tanpa Frame

NOFRAMES/NOFRAMES

(bagi browser yang tak mampu frame)

JAVA



Applet

APPLET/APPLET



Nama File Applet

APPLET CODE="***"



Parameter Applet

APPLET PARAM NAME="***"



Sumber Applet

APPLET CODEBASE="URL"



Identifier Applet

APPLET NAME="***"

(sebagai rujukan di tempat lain pada halaman sama)


Teks Alternatif

APPLET ALT="***"

(untuk browser tanpa kemampuan Java browsers)


Penataan Applet

APPLET ALIGN="LEFT|RIGHT|CENTER"



Ukuran Applet

APPLET WIDTH=? HEIGHT=?

(in pixels)


Celah batas Applet

APPLET HSPACE=? VSPACE=?

(in pixels)

LAIN-LAIN



Komentar

!-- *** --

(tidak ditampilkan oleh browser)


Prolog HTML 3.2

!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN" [*]



Mampu Cari

ISINDEX

(indikasi indeks yang dapat dicari-temukan)


Prompt

ISINDEX PROMPT="***"

(teks sebagai prompt)


Perintah Cari

A HREF="URL?***"/a

(gunakan tanda tanya yang sebenarnya)


URL dari file ini

BASE HREF="URL"

(harus terletak di header)

N2.0

Nama Dasar Window

BASE TARGET="***"

(harus terletak di header)


Kaitan

LINK REV="***" REL="***" HREF="URL"

(Relation dan Reverse Relation, harus terletak di header)


Informasi Meta

META

(harus terletak di header)


Lembar Gaya Penulisan

STYLE/STYLE

(Style Sheet - belum didukung sepenuhnya)


Scripts

SCRIPT/SCRIPT

(belum didukung sepenuhnya)