Anda di halaman 1dari 12

ELEMEN DASAR

Jenis Dokumen Judul Batang Tubuh


<HTML></HTML> <TITLE></TITLE>

(terdapat pada awal dan akhir dari file HTML) (harus selalu terdapat pada mukadimah) (keterangan umum, seperti judul dsb.) (isi dari halaman HTML)

Mukadimah (Header) <HEAD></HEAD>


<BODY></BODY>

ANCANGAN STRUKTURAL
Kepala
<H?></H?>

(Heading spesifikasi untuk menetapkan 6 tingkatan kepala) [*]

Penataan (Align) Kepala Bagian (Division) Penataan Bagian Kutipan Blok (Block Quote)

<H? ALIGN=LEFT|CENTER|RIGHT></H?> <DIV></DIV>

<DIV ALIGN=LEFT|RIGHT|CENTER></DIV> <BLOCKQUOTE></BLOCKQUOTE>

[*]

(tampilan dengan jeda terhadap batas pinggir) (umumnya huruf miring) (umumnya huruf tebal) (umumnya huruf miring) (Code -

Penekanan (Emphasis)

<EM></EM>

Penguatan (Strong Emphasis) Kutipan singkat (Citation)

<STRONG></STRONG> <CITE></CITE>

Kode

<CODE></CODE>

untuk source code listings) Contoh Keluaran Masukan Papan Ketik Variabel Definisi
<SAMP></SAMP> <KBD></KBD> <VAR></VAR> <DFN></DFN>

(Sample Output) (Keyboard Input) (Variable) (Definition - jarang dipakai)

Alamat Pengarang (Author's Address) Huruf ukuran Besar Huruf Ukuran Kecil

<ADDRESS></ADDRESS> <BIG></BIG> <SMALL></SMALL>

FORMAT TAMPILAN
Huruf Tebal Huruf Miring N3.0b Garis Bawah Huruf Coret N3.0b Huruf Coret Huruf Geser Bawah Huruf Geser Atas Huruf Mesin Ketik Pra-format (Preformatted) Jarak Huruf
<B></B> <I></I> <U></U> <STRIKE></STRIKE> <S></S> <SUB></SUB> <SUP></SUP> <TT></TT> <PRE></PRE>

(Bold) (Italic) (Underline - jarang digunakan) (Strikeout - jarang digunakan) (Strikeout - jarang digunakan) (Subscript) (Superscript) (Typewriter - huruf berjarak tetap) (menampilkan dengan jarak praformat) (mengatur jarak huruf)

<PRE WIDTH=?></PRE>

Rata Tengah

<CENTER></CENTER>

[*]

(Center - berlaku untuk teks maupun gambar) (Blinking - tag terlucu sampai kini) (Font Size - boleh diisi dari 1 sampai 7) (boleh diisi 1 sampai 7; ukuran standard/default=3)

N1.0 Huruf Kedip

<BLINK></BLINK>

Ukuran Huruf

<FONT SIZE=?></FONT>

Rubah Ukuran Huruf N1.0 Basis Ukuran Huruf

<FONT SIZE="+|-?"></FONT> <BASEFONT SIZE=?>

Warna Huruf N3.0b Pilih Jenis Huruf N3.0b Teks Multi Kolom N3.0b Jarak Batas Kolom N3.0b Lebar Kolom N3.0b Celah (Spacer) N3.0b Jenis Celah N3.0b Ukuran Celah N3.0b Dimensi Celah N3.0b Penataan Celah

<FONT COLOR="#$$$$$$"></FONT> <FONT FACE="***"></FONT> <MULTICOL COLS=?></MULTICOL> <MULTICOL GUTTER=?></MULTICOL> <MULTICOL WIDTH=?></MULTICOL> <SPACER> <SPACER TYPE=horizontal| vertical|block> <SPACER SIZE=?> <SPACER WIDTH=? HEIGHT=?> <SPACER ALIGN=left|right|center>

(default = 10 pixels)

ACUAN DAN GRAFIK


Acuan pada dokumen tertentu
<A HREF="URL"></A>

Acuan pada sasaran dalam <A HREF="URL#***"></A> dokumen


<A HREF="#***"></A>

(bila terdapat pada dokumen lain) (bila terdapat

pada dokumen yang sama) N2.0 Jendela Sasaran (Target Window) Penamaan sasaran pada dokumen Kaitan(Relationship) Kaitan terbalik (Reverse Relationship) Peragaan Gambar Penataan Letak Gambar N1.0 Penataan Letak Gambar Alternatif Teks
<A HREF="URL" TARGET="***| |_blank|_self|_parent|_top"></A> <A NAME="***"></A> <A REL="***"></A> <A REV="***"></A> <IMG SRC="URL"> <IMG SRC="URL" ALIGN=TOP|BOTTOM|MIDDLE|LEFT|RIGHT> <IMG SRC="URL" ALIGN=TEXTTOP| ABSMIDDLE|BASELINE|ABSBOTTOM> <IMG SRC="URL" ALT="***">

(jarang digunakan) (jarang digunakan)

(saat gambar belum/tidak ditampilkan) (membutuhkan program script)

Daerah Gambar (Imagemap) Daerah Gambar pihak klien Uraian Daerah Gambar Pembagian Daerah Gambar Dimensi Gambar Garis Batas Ruang Pembatas N1.0 Gambar Low-Res Proxy N1.1 Pemindahan Tarik N2.0 Objek Cantum

<IMG SRC="URL" ISMAP>

<IMG SRC="URL" USEMAP="URL"> <MAP NAME="***"></MAP> <AREA SHAPE="RECT" COORDS=",,," HREF="URL"|NOHREF> <IMG SRC="URL" WIDTH=? HEIGHT=?> <IMG SRC="URL" BORDER=?> <IMG SRC="URL" HSPACE=? VSPACE=?> <IMG SRC="URL" LOWSRC="URL"> <META HTTP-EQUIV="Refresh" CONTENT="?; URL=URL"> <EMBED SRC="URL">

(in pixels) (dalam satuan pixel) (dalam satuan pixel) (Client Pull) (Embed Object mencantumkan objek pada dokumen)

N2.0 Ukuran Objek

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

PEMISAH
Paragraf
<P></P>

[*]

(tag penutup seringkali tak diperlukan) [*] (pindah ke baris berikut) (Clear Textwrap) (Horizontal Rule) (dalam satuan pixel) (dalam satuan pixel) (dalam persentasi terhadap lebar halaman) (Solid Line - tanpa pola 3D) (No Break mencegah ganti baris) (Word Break - letak ganti baris bila diperlukan)

Align Text Pndah Baris Putus Penataan Baris Garis Datar Penataan Letak Garis Tebal Garis Lebar Garis

<P ALIGN=LEFT|CENTER|RIGHT></P> <BR> <BR CLEAR=LEFT|RIGHT|ALL> <HR> <HR ALIGN=LEFT|RIGHT|CENTER> <HR SIZE=?> <HR WIDTH=?>

N1.0 Lebar Garis Persentasi <HR WIDTH="%">

Garis Pejal N1.0 Tanpa Ganti Baris

<HR NOSHADE> <NOBR></NOBR>

N1.0 Sambung Suku Kata

<WBR>

DAFTAR
Daftar Tanpa Nomor Kompak
<UL><LI></UL>

(Unordered List Cantumkan <LI> sebelum tiap butir) (Compact)

<UL COMPACT></UL>

Jenis Butiran

<UL TYPE=DISC|CIRCLE|SQUARE> <LI TYPE=DISC|CIRCLE|SQUARE> <OL><LI></OL>

(Bullet Type - berlaku umum bagi butir terdaftar) (berlaku khusus pada butir ini dan selanjutnya) (Ordered List Cantumkan <LI> sebelum tiap butir) (berlaku umum untuk semua butir dalam daftar) (berlaku khusus pada butir ini dan selanjutnya) (berlaku umum untuk semua butir dalam daftar) (berlaku khusus pada butir ini dan selanjutnya) (Definition List <DT>=istilah, <DD>=uraian)

Daftar Bernomor

Kompak Jenis Penomoran

<OL COMPACT></OL> <OL TYPE=A|a|I|i|1> <LI TYPE=A|a|I|i|1> <OL START=?> <LI VALUE=?> <DL><DT><DD></DL>

Nomor Mulai

Daftar Definisi

Kompak Daftar Menu Kompak Daftar Direktori Kompak

<DL COMPACT></DL> <MENU><LI></MENU> <MENU COMPACT></MENU> <DIR><LI></DIR> <DIR COMPACT></DIR>

(Cantumkan <LI> sebelum butir menu) (Cantumkan <LI> sebelum tiap butir direktori)

LATAR BELAKANG DAN WARNA


Latar Belakang Gambar
<BODY BACKGROUND="URL">

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

Warna Latar Belakang <BODY BGCOLOR="#$$$$$$"> [*] Warna Huruf Teks Warna Acuan
<BODY TEXT="#$$$$$$"> <BODY LINK="#$$$$$$">

[*] [*]

Acuan Lepas Kunjung <BODY VLINK="#$$$$$$"> [*] Acuan Aktif


<BODY ALINK="#$$$$$$">

(Visited Link) (Active Link)

[*]

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

HURUF SPESIAL(these must all be in lower case)


Special Character < > & " Registered TM Copyright Spasi tak putus &#?;
&lt; &gt; &amp; &quot; &reg; &copy; &nbsp;

(where ? is the ISO 8859-1 code)

Non-breaking Space

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

FORMULIR
Rancangan Formulir N2.0 Mengirimkan File Input Field Nama Field Nilai Field Kotak Periksa
<FORM ACTION="URL" METHOD=GET|POST></FORM> <FORM ENCTYPE="multipart/formdata"></FORM> <INPUT TYPE="TEXT|PASSWORD|CHECKBOX|RADIO| IMAGE|HIDDEN|SUBMIT|RESET"> <INPUT NAME="***"> <INPUT VALUE="***"> <INPUT CHECKED>

Define Forms File Upload

(checkboxes dan radio boxes) (dalam satuan jumlah karakter)

Ukuran Field

<INPUT SIZE=?>

Panjang Maksimum <INPUT MAXLENGTH=?>

(dalam satuan karakter) Selection List

Daftar Pilihan Nama Daftar Pilihan Jumlah Pilihan Banyak Pilihan

<SELECT></SELECT> <SELECT NAME="***"></SELECT> <SELECT SIZE=?></SELECT> <SELECT MULTIPLE>

(dapat memilih lebih dari satu) (butir yang dapat dipilih)

Pilihan

<OPTION>

Pilihan Default Ukuran Input Box Nama Input Box N2.0 Rangkuman Teks

<OPTION SELECTED> <TEXTAREA ROWS=? COLS=?></TEXTAREA> <TEXTAREA NAME="***"></TEXTAREA> <TEXTAREA WRAP=OFF|VIRTUAL|PHYSICAL></TEXTAREA>

Wrap Text

TABEL
Rancangan Tabel Garis Batas Tabel Celah Sel Penyangga Sel Lebar Tabel Lebar Tabel Persentasi
<TABLE></TABLE>

[*] Cell Spacing Cell Padding (dalam satuan pixel) (dalam satuan persen terhadap lebar halaman)

<TABLE BORDER=?></TABLE> <TABLE CELLSPACING=?> <TABLE CELLPADDING=?> <TABLE WIDTH=?> <TABLE WIDTH="%">

Baris dalam Tabel Penataan Letak Baris

<TR></TR> <TR ALIGN=LEFT|RIGHT| CENTER|MIDDLE|BOTTOM VALIGN=TOP|BOTTOM|MIDDLE>

Sel dalam Tabel Penataan Letak Sel Tanpa Ganti Baris Rentang Kolom Rentang Baris N1.1 Lebar Sel N1.1 Lebar Sel Persentasi

<TD></TD> <TD ALIGN=LEFT|RIGHT| CENTER|MIDDLE|BOTTOM VALIGN=TOP|BOTTOM|MIDDLE> <TD NOWRAP> <TD COLSPAN=?> <TD ROWSPAN=?> <TD WIDTH=?> <TD WIDTH="%">

(harus ada dalam setiap baris tabel)

Columns to span Rows to span (dalam satuan pixel) (dalam satuan persen terhadap lebar tabel) (Table Header seperti data dengan Bold dan Center)

N3.0b Warna Sel Kepala Tabel

<TD BGCOLOR="#$$$$$$"> <TH></TH>

Penataan Letak Kepala Tabel <TH ALIGN=LEFT|RIGHT| Tanpa Baris Baru Rentang Kolom Rentang Baris N1.1 Lebar Kepala Tabel N1.1 Lebar Persentasi
<TH NOWRAP> <TH COLSPAN=?> <TH ROWSPAN=?> <TH WIDTH=?> <TH WIDTH="%">

CENTER|MIDDLE|BOTTOM VALIGN=TOP|BOTTOM|MIDDLE>

Columns to Span Rows to Span (dalam satuan pixel) (dalam persentasi terhadap lebar tabel) Caption (di atas / di bawah tabel)

N3.0b Warna Kepala Tabel Keterangan Tabel Penataan Keterangan

<TH BGCOLOR="#$$$$$$"> <CAPTION></CAPTION> <CAPTION ALIGN=TOP|BOTTOM>

FRAMES
N2.0 Dokumen dalam Frame
<FRAMESET></FRAMESET>

(sebagai

pengganti <BODY>) N2.0 Tinggi Baris Frame N2.0 Tinggi Baris Frame N2.0 Lebar Kolom Frame N2.0 Lebar Kolom Frame N3.0b Lebar Garis Batas N3.0b Garis Batas N3.0b Warna Garis Batas N2.0 Rancangan Frame
<FRAMESET ROWS=,,,></FRAMESET> <FRAMESET ROWS=*></FRAMESET> <FRAMESET COLS=,,,></FRAMESET> <FRAMESET COLS=*></FRAMESET> <FRAMESET BORDER=?> <FRAMESET FRAMEBORDER="yes|no"> <FRAMESET BORDERCOLOR="#$$$$$$"> <FRAME>

(dalam satuan pixel atau %) (* = ukuran relatif) (dalam satuan pixel atau %) (* = ukuran relatif)

(isi dari frame individu)

N2.0 Tampilan Dokumen Frame <FRAME SRC="URL"> N2.0 Nama Frame N2.0 Lebar Batas N2.0 Tinggi Batas N2.0 Scrollbar?
<FRAME NAME="***"|_blank|_self| _parent|_top> <FRAME MARGINWIDTH=?> <FRAME MARGINHEIGHT=?> <FRAME SCROLLING="YES|NO|AUTO">

(batas kiri dan kanan) (batas atas dan bawah) Memungkinkan scrolling pada frame

N2.0 Ukuran Frame tak bisa diubah N3.0b Batas Frame N3.0b Warna Garis Batas N2.0 Isi tanpa Frame

<FRAME NORESIZE> <FRAME FRAMEBORDER="yes|no"> <FRAME BORDERCOLOR="#$$$$$$"> <NOFRAMES></NOFRAMES>

(bagi browser yang tak mampu frame)

JAVA
Applet Nama File Applet Parameter Applet Sumber Applet Identifier Applet
<APPLET></APPLET> <APPLET CODE="***"> <APPLET PARAM NAME="***"> <APPLET CODEBASE="URL"> <APPLET NAME="***">

(sebagai rujukan di tempat lain pada halaman sama) (untuk browser tanpa kemampuan Java browsers) (in pixels) (in pixels)

Teks Alternatif

<APPLET ALT="***">

Penataan Applet Ukuran Applet

<APPLET ALIGN="LEFT|RIGHT|CENTER"> <APPLET WIDTH=? HEIGHT=?>

Celah batas Applet <APPLET HSPACE=? VSPACE=?>

LAIN-LAIN
Komentar Prolog HTML 3.2 Mampu Cari Prompt Perintah Cari URL dari file ini N2.0 Nama Dasar Window Kaitan
<!-- *** --> <!DOCTYPE HTML PUBLIC "//W3C//DTD HTML 3.2//EN"> <ISINDEX> <ISINDEX PROMPT="***"> <A HREF="URL?***"></a> <BASE HREF="URL"> <BASE TARGET="***"> <LINK REV="***" REL="***" HREF="URL">

(tidak ditampilkan oleh browser) [*] (indikasi indeks yang dapat dicari-temukan) (teks sebagai prompt) (gunakan tanda tanya yang sebenarnya) (harus terletak di header) (harus terletak di header) (Relation dan Reverse Relation, harus terletak di header)

Informasi Meta

<META>

(harus terletak di header) (Style Sheet - belum didukung sepenuhnya) (belum didukung sepenuhnya)

Lembar Gaya Penulisan <STYLE></STYLE> Scripts


<SCRIPT></SCRIPT>

Anda mungkin juga menyukai