KETERAMPILAN KOMPUTER

Senin, 18 Februari 2013

HTML DASAR

A.   Sejarah HTML
Hypertext Markup Language (HTML) adalah bahasa yang digunakan untuk menulis halaman web. HTML merupakan pengembangan dari standar pemformatan dokumen teks yaitu Standard Generalized Markup Language (SGML). HTML sebenarnya adalah dokumen ASCII atau teks biasa, yang dirancang untuk tidak tergantung pada suatu sistem operasi tertentu.
HTML dibuat oleh
Tim Berners-Lee ketika masih bekerja untuk CERN dan dipopulerkan pertama kali oleh browser Mosaic. Selama awal tahun 1990 HTML mengalami perkembangan yang sangat pesat. Setiap pengembangan HTML pasti akan menambahkan kemampuan dan fasilitas yang lebih baik dari versi sebelumnya. Namun perkembangan resmi dikeluarkan pada bulan November 1995 oleh IETF (Internet Engineering Task Force). HTML 2.0 ini merupakan penyempurnaan dari HTML+ (1993).
HTML 3.0 (1995) memberikan kemampuan lebih daripada versi sebelumnya. Sebuah usaha dari World Wide Web Consortium’s (W3C) HTML Working Group pada tahun 1996 menghasilkan HTML 3.2. HTML versi ini secara resmi diterbitkan pada bulan Januari 1997.
HTML versi terbaru adalah HTML 4.01 yang dikeluarkan secara resmi oleh W3C pada tanggal 24 April 1998. HTML merupakan perbaikan dari HTML 4.0 yang lebih dulu diterbitkan. (18 Desember 1997).

B.   Dasar-Dasar HTML
Mendesain HTML berarti melakukan suatu tindakan pemrograman. Namun HTML bukanlah sebuah bahasa pemrograman. Namun HTML hanyalah berisi perintah-perintah yang telah terstruktur berupa tag-tag penyusun. Menuliskan tag-tag HTML tidaklah sebatas hanya memasukkan perintah-perintah tertentu agar HTML kita dapat di akses oleh browser. Mendesain HTML adalah adalah sebuah seni tersendiri. Homepage yang merupakan implementasi dari HTML adalah refleksi dari orang yang membuatnya. Untuk itu kita perlu mendesainnya dengan baik agar para pengunjung homepage yang kita buat merasa senang dan bermanfaat.
Mendesain HTML dapat dilakukan dengan dua cara:
  1. Menggunakan HTML Editor, seperti Microsoft FrontPage, Adobe Dreamweaver, dan editor HTML lainnya.
  2. Dengan cara menuliskan sendiri secara manual satu persatu tag-tag HTML ke dalam dokumen Notepad dan disimpan dengan format HTML.
Ada kelebihan dan kekurangan dari dua cara di atas. Cara pertama kelebihannya adalah HTML Editor merupakan sebuah program yang khusus didesain untuk membuat, melakukan editing bahkan mem-publish ke internet. Dengan kemampuannya menggabungkan kemudahan dan kecanggihan teknologi internet ke dalam dokumen HTML maka cara ini sangat disukai oleh para pemula dan desainer yang tidak ingin belajar lebih mendalam mengenai HTML.
Sedangkan cara kedua adalah menuliskan secara manual satu persatu tag-tag HTML. Hal ini sangat dirasakan sulit dikarenakan akan memakan tenaga dan waktu ekstra untuk melakukannya, ditambah lagi Anda harus melakukan cara-cara konvensional untuk melihat hasilnya pada web browser. Namun pada cara kedua adalah dasar dari segala bentuk HTML yang akan Anda pelajari, karena dengan cara itulah Anda akan lebih paham mengenai cara kerja dan berbagai perintah yang biasa dipakai pada bahasa HTML.

Perhatian !!
Jika anda baru pertama kali mengenal HTML, hindari Program WYSIWIG (What You See Is What You Get) seperti Dreamweaver atau Frontpage/Web Expression. Program-program ini memang memudahkan anda membuat website tetapi anda akan kurang memahami HTML, gunakan Frontpage atau Dreamweaver apabila anda sudah paham mengenai HTML.
Didalam html terdapat tag
Tag   : adalah bagian perintah/script yang tidak ditampilkan oleh halaman website
         Tag terbagi 2 macam :
-   Tag tunggal = tag yang berdiri sendiri contoh  <img src><br>
-   Tag berpasangan = tag yang memiliki bagian awal dan akhir/penutup
Contohmnya :
<html>   </html>
<body>  </body>

C.   STRUKTUR DASAR HTML
HTML adalah singkatan dari HyperText Markup Language adalah salah satu bahasa pemprograman web desaign dan juga biasa di sebut 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 HTML adalah sebagai berikut:
<html>
<head>
<title>Judul Dokumen HTML</title>
</head>
<body>
penulisan informasi Web
</body>
</html>

Dari struktur dasar HTML di atas dapat dijelaskan sebagai berikut:
a.    Tag
Adalah teks khusus (markup) berupa dua karakter "<" dan ">", sebagai
contoh <body> adalah tag dengan nama body.

Tag harus ditulis secara berpasangan, yang terdiri atas tag pembuka dan tag
penutup (ditambahkan karakter "/" setelah karakter "<"),
sebagai contoh <body> ini adalah tag pembuka isi dokumen HTML, dan
</body> ini adalah tag penutup isi dokumen HTML.

b.    Element
Element terdiri atas tiga bagian, yaitu tag pembuka, isi, dan tag penutup.
Sebagai contoh untuk menampilkan judul dokumen HTML pada web
browser digunakan element title, dimana:
<title> ini adalah tag pembuka judul dokumen HTML
Judul Dokumen HTML ini adalah isi judul dari dokumen HTML
</title> ini adalah tag penutup judul dokumen HTML
Tag-tag yang ditulis secara berpasangan pada suatu element HTML, tidak
boleh saling tumpang tindih dengan pasangan tag-tag lainnya.
Contoh penulisan tag-tag yang benar
<p>
<b>
</b>
</p>
Catatan : Jika penulisan script salah, maka script tidak terbaca sempurna ( Error ) sehingga dapat mengganggu penampilan dan dinamika web itu sendiri

c.    Attribute
Attribute mendefinisikan property dari suatu element HTML, yang terdiri atas
nama dan nilai. Penulisannya adalah sebagai berikut:
<TAG>
nama-attr="nilai-attr"
nama-attr="nilai-attr"
</TAG>
Secara umum nilai attribute harus berada dalam tanda petik satu atau dua. Sebagai contoh, untuk membuat warna teks menjadi kuning dan latarbelakang halaman web menjadi hitam, penulisannya adalah <body bgcolor="black" text="yellow">

d.    Element HTML
Menyatakan pada browser bahwa dokumen Web yang digunakan adalah  HTML.
Sintaks:
<html>
</html>



e.    Element HEAD
Merupakan kepala dari dokumen HTML. Tag <head> dan tag </head> terletak
di antara tag <html> dan tag </html>.
Sintaks:
<head>
</head>

f.     Element TITLE
Merupakan judul dari dokumen HTML yang ditampilkan pada judul jendela
browser. Tag <title> dan tag </title> terletak di antara tag <head> dan tag
</head>.
Sintaks:
<title>
</title>

g.    Element BODY
Element ini untuk menampilkan isi dokumen HTML. Tag <body> dan tag </body> terletak di bawah tag <head> dan tag </head>.
Element BODY mempunyai attribute-attribute yang menspesifikasikan khususnya warna dan latarbelakang dokumen yang akan ditampilkan pada browser.
Sintaks:
<body text="v" bgcolor="w" background="uri" link="x" alink="y" vlink="z">
</body>

text                   :memberikan warna pada teks
bgcolor            :memberikan warna pada latarbelakang dokumen HTML
background     :memberikan latarbelakang dokumen HTML dalam bentuk gambar
link                    :memberikan warna untuk link
alink                  :memberikan warna untuk link yang sedang aktif
vlink                  :memberikan warna untuk link yang telah dikunjungi.

Catatan : Jika attribute bgcolor dan background keduanya dispesifikasikan maka attribute background yang akan digunakan, akan tetapi jika nilai attribute
background (gambar) tidak ditemukan pada dokumen HTML maka attribute bgcolor
yang akan digunakan.



Berikut ini saya akan menyebutkan berbagai macam kode HTML dasar yang perlu Diketahui :
1.     <br>
Turun satu baris kebawah(enter) / Kursor dan kalimat dibelakangnya turun 1 baris kebawah
2.    <big>isi tulisan</big> Membuat tulisan menjadi sedikit lebih besar
3.    <font color=”warna tulisan“> isi tulisan </font>
Mewarnai tulisan. Ganti warna tulisan dengan salah satu
pilihan yang ada : red, blue, yellow, green, brown, gold,
purple
4.    &nbsp;
Menambah 1 spasi karena ada kemungkinan penggunaan 2
spasi tidak akan terbaca pada beberapa engine blog

5.    <font size=”ukuran
tulisan“>isi tulisan</font>
Mengganti ukuran tulisan. Bisa digunakan apabila kode
pada no. 2 tidak sesuai dengan keinginan kita
6.    <strong>isi tulisan</strong>
atau
<b>isi tulisan</b>
Untuk menebalkan tulisan. Fungsi sama dengan ”’isi
tulisan”’ atau tombol ‘cetak tebal’
7.    <p> Kursor dan kalimat dibelakangnya turun satu setengah
baris kebawah
8.    <u>isi tulisan</u> Membuat garis bawah tulisan
9.    <small>isi tulisan</small> Membuat tulisan menjadi sedikit lebih kecil
10.  <s>isi tulisan</s> Membuat garis mencoret pada tulisan
11.  <pre>isi tulisan</pre>
Membuat tulisan tetap pada keadaan yang kita inginkan,
misalnya untuk urutan berjejer kebawah
12.  <center>isi tulisan</center>
Membuat tulisan berada di tengah halaman
13.  <blink>isi tulisan</blink> Membuat tulisan tampak berkedip


Contoh2 penulisan dokumen html:
Latihan 1

Secara sederhana HTML terdiri dari dua bagian yaitu Header dan Body. Struktur HTML diapit oleh tag awal <HTML> dan tag akhir </HTML>. Standar penulisannya adalah:
<HTML>
<HEAD>
Deskrisi dokumen
</HEAD>
<BODY>
Isi dokumen
</BODY>
</HTML>
Contoh:
<HTML>
<HEAD>
<TITLE>Selamat datang di Homepage Saya</TITLE>
</HEAD>
<BODY>
Halo, apakabar?. Homepage ini merupakan hasil karya saya yang pertama.
</BODY>
</HTML>
Keterangan:
  • Simpanlah dengan menambahkan exstensi data dari html (.html)
  • Tag <TITLE> digunakan untuk memberi judul dokumen HTML. Judul ini dapat Anda lihat pada pojok kiri atas (title bar) browser. Ketika orang akan mem-bookmark web Anda, maka judul inilah yang akan disimpan.
  • Kemudian buka folder tempat kamu menyimpan file, lalu cari file yang telah di simpan, biasanya data tersebut sudah dalam bentuk tampilan Mozilla Firefox.
  • Lihat hasilnya dibawah ini.



Latihan 2

1.    Membuat Heading (judul kalimat)
Heading adalah sekumpulan kata yang menjadi judul atau subjudul dalam suatu dokumen HTML. Heading berbeda dengan tag <TITLE> yang tidak bisa muncul dalam halaman web. HTML menyediakan enam tingkatan heading. Heading level 1 biasanya untuk judul utama.
Contoh:
<HTML>
<HEAD>
<TITLE>Headings</TITLE>
</HEAD>
<BODY>
<H1>Heading Level 1</H1>
<H2>Heading Level 2</H2>
<H3>Heading Level 3</H3>
<H4>Heading Level 4</H4>
<H5>Heading Level 5</H5>
<H6>Heading Level 6</H6>
</BODY>
</HTML>

2.    Paragraf
Untuk membuat paragraf digunakan tag <P>. Setelah tag <P> Anda bisa menulis isi paragraf dan paragraf tersebut harus diakhiri dengan penutup </P>. Anda bisa mengatur posisi paragraf dengan attribut ALIGN. Atribut ALIGN diikuti dengan posisi yang diinginkan. LEFT untuk rata kiri, CENTER untuk rata tengah dan RIGHT untuk rata kanan.
Contoh:
<HTML>
<HEAD>
<TITLE>Paragraf</TITLE>
</HEAD>
<BODY>
<P ALIGN="right">
Beberapa tahun yang lalu, seorang hartawan meninggal dunia sedangkan ia tidak memiliki ahli waris. Kepada pengacaranya, ia meninggalkan dua buah surat yang disegel.Yang sebuah berisi permintaan agar jenazahnya dikuburkan pada jam empat dini hari. Surat yang kedua belum diketahui isinya karena disampulnya tertulis pesan agar dibuka seusai pemakaman jenazah
<P ALIGN="center">
Sesuai dengan wasiat, jenazah itu dikebumikan pada pukul empat dini hari. Karena tidak lazimnya waktu pemakaman pada jam tersebut, yang ikut mengantar jenazahnya hanya empat orang kawannya yang paling setia
<P ALIGN="left">
Seusai pemakaman, surat wasiat yang kedua dibuka. Betapa terkejutnya pengacara ketika membaca isinya, ialah wasiat bahwa seluruh harta warisan (yang bernilai lebih dari 800.000 pound) dibagi rata kepada orang-orang yang mengantarkan jenazahnya ke pemakaman. Dengan demikian, yang berhak memperoleh harta yang banyak itu hanya empat orang, sebagai imbalan bagi kesetiaan mereka. Sumber humor, kisah dan pepatah
</P>
</BODY>
</HTML>


Latihan 3

3.    Blockquote

Perintah tag <BLOCKQUOTE> digunakan untuk menulis kutipan teks. Dengan perintah ini browser akan menampilkan teks menjorok ke dalam (meng-identasi teks) atau menampilkan teks dalam bentuk huruf miring.
Contoh:
<HTML>
<HEAD>
<TITLE>BLOCKQUOTE</TITLE>
</HEAD>
<BODY>
<H3>Sesuatu yang tidak perlu dicoba</H3>
<BLOCKQUOTE>
Sesuatu yang kelihatan mengasyikkan tapi sebenarnya lebih banyak menambah masalah pada remaja adalah narkoba, seks, alkohol dan merokok. Jangan sekali-kali mencoba jika tidak ingin membuat masalah baru
</BLOCKQUOTE>
</BODY>
</HTML>

4.    Preformatted Text

Preformatted Text (PRE) digunakan untuk menampilkan teks sama seperti yang Anda ketikkan dalam dokumen HTML. Browser akan menampikan teks tersebut dalam font monospaced, yaitu seperti terlihat dalam teks yang tampilkan oleh aplikasi berbasis teks (misalnya telnet).
Contoh:
<HTML>
<HEAD>
<TITLE>Preformatted Text</TITLE>
</HEAD>
<BODY>
<PRE>
Edisi yang lalu dibahas tentang membuat billing system untuk warnet yang dapat langsung mencetak tagihan.
Kali ini diulas bagaimana menyimpan setiap transaksi dalam database agar bisa diperoleh beberapa laporan secara periodik.
</PRE>
</BODY>
</HTML>

5.    Begin Row (BR)

Tag ini digunakan untuk menulis teks pada baris berikutnya. Tag <BR> membuat baris baru tanpa memberi baris kosong di bawahnya.
Contoh:
<HTML>
<HEAD>
<TITLE>Begin Row</TITLE>
</HEAD>
<BODY>
<P>Banyak cara yang dapat digunakan untuk melakukan instalasi FreeBSD. Namun ada tiga cara yang paling sering dilakukan ,yaitu:
<BR>Instalasi melalui FTP
<BR>Instalasi melalui CDROM
<BR>Instalasi melalui partisi DOS
</BODY>
</HTML>

6.    Ukuran Font

Untuk mengatur huruf dokumen HTML digunakan tag <FONT SIZE>. Tag <FONT SIZE> memiliki beberapa atribut untuk mengatur ukuran huruf yang akan digunakan.
Contoh:
<HTML>
<HEAD>
<TITLE>Ukuran font</TITLE>
</HEAD>
<BODY>
<FONT SIZE=1>Ukuran font 1</FONT>
<FONT SIZE=2>Ukuran font 2</FONT>
<FONT SIZE=3>Ukuran font 3</FONT>
<FONT SIZE=4>Ukuran font 4</FONT>
<FONT SIZE=5>Ukuran font 5</FONT>
<FONT SIZE=6>Ukuran font 6</FONT>
<FONT SIZE=7>Ukuran font 7</FONT>
</BODY>
</HTML>

7.    Jenis Font

Atribut FACE digunakan untuk mengatur jenis huruf yang diinginkan. Atribut FACE harus diisi dengan string jenis font seperti Arial, Times New Roman,Verdana, dan sebagainya.
Contoh:

<HTML>
<HEAD>
<TITLE>Jenis Font</TITLE>
</HEAD>
<BODY>
<FONT SIZE=5>
<FONT FACE = "Arial">Arial, contoh AC Milan <P>
<FONT FACE = "Verdana">Verdana , contoh Persebaya <P>
<FONT FACE = "Times New Roman">Times New Roman, contoh Indonesia <P>
</BODY>
</HTML>

8.    Warna Font

Atribut COLOR digunakan untuk mengatur warna font yang akan digunakan. Untuk memberi nilai pada atribut color, ada dua cara. Cara pertama dengan menuliskan nama warna seperti Red, Blue, Yellow, White, dll. Sedangkan cara kedua adalah dengan menggunakan nilai RGB (Red Green Blue) dari suatu warna, misalnya FF0000 untuk Red, 00FF00 untuk green, dan 0000FF untuk Blue.
Contoh:
<HTML>
<HEAD>
<TITLE>Warna Font</TITLE>
</HEAD>
<BODY>
<FONT SIZE=5>
<FONT COLOR = "red">PSM Makassar<P>
<FONT COLOR = "#FF0000">tetap PSM Makassar kan?<P>
<FONT COLOR = "#00FF00">Ini baru Persebaya<P>
</BODY>
</HTML>


Latihan 4

9.    Link

Perintah anchor <A> digunakan untuk membuat suatu link. Untuk membuat link ke dokumen HTML lain digunakan perintah <A HREF = “nama_dokumen”>Teks pada browser</A>.
Anda juga bisa membuat link dalam sebuah dokumen HTML. Untuk itu perlu dipersiapkan nama anchor lokasi tujuan dari link tersebut. Nama anchor dibuat dengan menambahkan atribut NAME pada tag <A>. Misalnya <A NAME = “Bugs”</A>. Cara melakukan link ke bagian tersebut adalah <A HREF = “#nama_anchor”>teks pada browser</A>.
Contoh:
<HTML>
<HEAD>
<TITLE>Link</TITLE>
</HEAD>
<BODY>
<A NAME="lengkap">Pemain-pemain AC Milan menurut abjad</A>
<BLOCKQUOTE>
<P>Abbiati ,<A HREF="#abbiati">info lengkap</A>
<P>Ayala
<P>Ambrosini
<P>Albertini
<P>Boban
<P>
<A HREF="linktujuan.html">kalo mau tahu lagi klik disini</A>
</BLOCKQUOTE>
<P><A NAME="abbiati">Abbiati</A>
<BLOCKQUOTE>
<P>Kiper ketiga timnas Italia runner up Euro 2000
<BR>Kiper utama U-21 juara Piala Eropa U-21
<BR>Kiper utama AC Milan juara Seri-A 1998-1999
</BLOCKQUOTE>
<P><A HREF="#lengkap">kembali ke atas</A>
</BODY>
</HTML>
<HTML>
<HEAD>
<TITLE>Link tujuan</TITLE>
</HEAD>
<BODY>
<P ALIGN="center"> Maaf, hanya sedikit
<BR>Chamot
<BR>Dida
<BR>Shevchenko
<BR><A HREF="contohlink.html">kembali</A>
</BODY>
</HTML>


10.  Ordered List
Ordered list digunakan untuk membuat daftar dimana tiap bagiannya memiliki nomor secara berurut. Ordered list dimulai dengan menggunakan tag <OL> dan diakhiri </OL>. Untuk menyatakan tiap bagiannya digunakan tag <LI> dimana tag ini tidak menggunakan penutup.
Contoh:
<HTML>
<HEAD><TITLE>Ordered List</TITLE></HEAD>
<BODY>
Empat besar pemain termahal di dunia
<OL>
<LI>Luis Figo
<LI>Hernan Crespo
<LI>Christian Vieri
<LI>Nicolas Anelka
</OL>
</BODY>
<HTML>
Ketika menggunakan perintah ordered list maka default penomoran adalah 1, 2, 3, …, Anda bisa mengubah nomor tersebut menggunakan atribut TYPE pada tag <OL>.
·         TYPE = 1 ; daftar berurut dengan nomor 1, 2, 3 (default)
·         TYPE = I ; daftar berurut dengan menggunakan bilangan Romawi besar (I, II, III, IV, …)
·         TYPE = I ; daftar berurut dengan menggunakan bilangan Romawi huruf kecil (i, ii, iii, iv, …)
·         TYPE = A ; daftar berurut dengan menggunakan abjad besar (A, B, C, D, …)
·         TYPE = a ; daftar berurut dengan menggunakan abjad kecil (a, b, c, d, …)
Selain mengubah jenis penomoran, HTML juga menyediakan perintah untuk menentukan nilai awal penomoran. Atribut yang digunakan adalah START = n, dimana n adalah nilai awal penomoran.

Contoh:
<HTML>
<HEAD>
<TITLE>OL dengan atribut</TITLE>
</HEAD>
<BODY>
<OL TYPE=A>
<LI>Daftar empat pemain termahal didunia
<OL TYPE=I>
<LI>Luis Figo
<LI>Hernan Crespo
<LI>Christian Vieri
<LI>Nicolas Anelka
</OL>
<LI>Urutan lima sampai delapan
<OL TYPE=1 START=5>
<LI>Denilson
<LI>Gabriel Batigol
<LI>Ronaldo
<LI>Amoroso
</OL>
</OL>
</BODY>
<HTML>

11.   Unordered List
Berbeda dengan ordered list, dalam unordered list tidak dijumpai urutan dalam suatu daftar. Setiap bagian dari unordered list ditandai dengan tanda bullet. Tanda bullet menjadi defaultdalam unordered list. Untuk membuat daftar dengan tanda ini digunakan tag awal <UL> dan tag akhir </UL>. Sama seperti ordered list, untuk tiap-tiap bagian digunakan <LI> tanpa tag penutup.
Contoh:
<HTML>
<HEAD>
<TITLE>Unordered List</TITLE>
</HEAD>
<BODY>
Empat besar Seri-A Liga Indonesia
<UL>
<LI>PSM Makassar
<LI>Pupuk Kaltim
<LI>Persikota
<LI>Persija Pusat
</UL>
</BODY>
<HTML>

Selain default tanda bullet, Anda bisa menggunakan tanda cakram/disk, lingkaran, atau kotak. Caranya dengan menggunakan atribut TYPE pada tag <UL>
Contoh:
<HTML>
<HEAD>
<TITLE>UL dengan atribut</TITLE>
</HEAD>
<BODY>
Klub sepakbola di Jawa Timur
<UL TYPE=square>
<LI>Mitra Surabaya
<LI>Persebaya
<LI>Persija Jember
</UL>
</BODY>
<HTML>


12.  Grafik dalam Halaman Web

Biasanya orang menggunakan gambar untuk memperindah situsnya. HTML menyediakan tag <IMG> untuk menampilkan gambar dalam halaman web. Dari berbagai macam format gambar yang ada, hanya beberapa saja yang bisa dipergunakan dalam membuat halaman web. Format gambar yang paling sering digunakan adalah GIF dan JPEG. Format penulisannya adalah:
<IMG SRC = “file_gambar” ALT = “nama_alternatif”>
Atribut SRC digunakan untuk menentukan sumber gambar. Atribut ALT berfungsi sebagai teks pengganti gambar untuk browser yang tidak bisa mendukung grafik, atau pada pihak client sengaja mematikan fasilitas pemanggilan gambar.
Contoh:
<HTML>
 <HEAD>
 <TITLE>Grafik dalam halaman web</TITLE>
 </HEAD>
 <BODY>
 <P ALIGN="left">www.bugsinternetcafe.com</P>
 <P ALIGN="left"><IMG SRC="bugs_logo_white.gif"  ALT="Bugs Internet Cafe Yogyakarta"></P>
 </BODY>
 </HTML>
Beberapa atribut pada tag <IMG> yang biasa digunakan dalam halaman-halaman web.
·         BORDER : memberikan suatu border atau batas pada gambar, default-nya = 0
·         HEIGHT, WIDTH : menentukan tinggi dan lebar suatu gambar dalam ukuran pixel
·         HSPACE, VSPACE : menentukan jarak spasi horizontal dan spasi vertikal antara gambar-gambar dengan objek di sekitarnya
·         ALIGN : mengatur perataan gambar terhadap objek di sekelilingnya. Nilainya bisa berupa LEFT, CENTER, RIGHT, BOTTOM, TOP dan MIDDLE






Contoh:
<HTML>
 <HEAD>
 <TITLE>Atribut IMG </TITLE>
 </HEAD>
 <BODY>
 <P>Bugs Internet Cafe, VSPACE = 20
 <BR>
 <IMG SRC=".gif" WIDTH="270" HEIGTH="70" ALT="radiokampus ITB" BORDER="2"
 HSPACE="20" VSPACE="20">
 <BR>
 www.bugsinternetcafe.com, HSPACE = 20</P>
 <P>Jl.Kaliurang Km.5 No.34<IMG SRC=" bugs_logo_white.gif" WIDTH="203" HEIGHT="60"
 ALT=" Bugs Internet Cafe" HSPACE="20">Yogyakarta, HSPACE = 20
 <BR>
 </P>
 </BODY>
 </HTML>
 

13.  Table

Tabel banyak digunakan karena dapat menampilkan informasi dengan bentuk yang ringkas dan mudah dibaca. Untuk membuat tabel digunakan tag awal <TABLE> dan tag penutup </TABLE>. Tag <TABLE> mewakili beberapa bagian penting, yaitu:
·         CAPTION> … </CAPTION> digunakan untuk membentuk judul tabel. Judul tabel ini akan terletak diluar tabel, bisa di bagian atas atau bagian bawah tabel
·         <TH> … </TH> berfungsi untuk meletakkan judul tabel di bagian peling atas atau paling kiri dari suatu tabel
·         <TD> … </TD> digunakan sebagai tempat menulis data atau informasi dalam tabel

Contoh:
<HTML>
 <HEAD>
 <TITLE>Tabel</TITLE>
 </HEAD>
 <BODY>
 <TABLE>
 <CAPTION>Seputar Calciomeecato</CAPTION>
 <TR>
 <TH>Nama Klub</TH>
 <TH>Berita</TH>
 </TR>
 <TR>
 <TD>Fiorentina</TD>
 <TD>Fiorentina mendatangkan Nuno Gomes untuk menggantikan sang legenda Batigol</TD>
 </TR>
 <TR>
 <TD>Lazio</TD>
 <TD>Lazio menjadi klub dengan rekor pembelian pemain sebesar 240 miliar lira!</TD>
 </TR>
 <TR>
 <TD>Perugia</TD>
 <TD>Ahn Jung-Whan resmi menjadi pemain pinjaman Perugia</TD>
 </TR>
 <TR>
 <TD>Udinese</TD>
 <TD>Pemain Spanyol berusia 23 tahun, Luis Helguera menjadi pemain Udinese <BR>
 dengan transfer senilai 349 juta lira</TD>
 </TR>
 </TABLE>
 </BODY>
 </HTML>
 

Ø  Table ALIGN dan WIDTH

Perataan horizontal tabel menggunakan atribut ALIGN. ALIGN dapat bernilai LEFT untuk perataan kiri, CENTER untuk perataan di tengah dan RIGHT untuk perataan di kanan. Sedangkan untuk perataan vertikal menggunakan atribut VALIGN. VALIGN dapat bernilai TOP untuk perataan atas, MIDDLE untuk perataan di tengah dan BOTTOM untuk perataan di bawah.
Lebar tabel biasanya diatur menggunakan atribut WIDTH. Nilai WIDTH dapat dinyatakan dengan persen (%) yang menyatakan lebar tabel dalam persentase atau dinyatakan dengan pixel yang berarti ukuran sesungguhnya dari tabel.

Contoh:
<HTML>
<HEAD>
<TITLE>Tabel dengan WIDTH dan ALIGN</TITLE>
</HEAD>
<BODY>
<TABLE WIDTH="88%" HEIGHT="210">
<TR>
<TD WIDTH="30%" HEIGHT="110" VALIGN="top">Lihatlah VALIGN="top"<br>
Janganlah merasa malu mempelajari sesuatu yang tidak diketahuinya</TD>
<TD WIDTH="34%" HEIGHT="110" VALIGN="middle">Bandingkan dengan VALIGN ="middle"<br>
</TD>
<TD WIDTH="36%" HEIGHT="110" VALIGN="bottom">bagaimana dengan ini VALIGN="bottom"</TD>
</TR>
<TR>
<TD WIDTH="30%" HEIGHT="100" ALIGN="left">kalo ini ALIGN="left"</TD>
<TD WIDTH="34%" HEIGHT="100" ALIGN="center">ALIGN="center"</TD>
<TD WIDTH="36%" HEIGHT="100" ALIGN="right">Dunia diciptakan untuk
semua makhluk, bukan untuk kepentingan dunia itu sendiri, dan ini dengan ALIGN = "right"</TD>
</TR>
</TABLE>
</BODY>
</HTML>

Ø  Table CELLSPACING dan CELLPADDING

Atribut CELLSPACING digunakan untuk menentukan jumlah spasi yang terdapat di antara dua buah sel. CELLPADDING berfungsi untuk mengatur jumlah spasi yang terdapat di antara batas/border dengan isi atau teks di dalam sel tersebut.

Contoh:
<HTML>
<HEAD>
 <TITLE>Tabel dengan CELLSPACING dan CELLPADDING</TITLE>
 </HEAD>
 <BODY>
 <TABLE BORDER="3" CELLPADDING="5" CELLSPACING="5" WIDTH="85%">
 <TR>
 <TD WIDTH="43%">baris 1, kolom 1</TD>
 <TD WIDTH="57%">baris 1, kolom 2</TD>
 </TR>
 <TR>
 <TD WIDTH="43%">baris 2, kolom 1</TD>
 <TD WIDTH="57%">baris 2, kolom 2</TD>
 </TR>
 </TABLE>
</BODY>
</HTML>

Ø  Table COLSPAN dan ROWSPAN

Atribut COLSPAN digunakan untuk menghubungkan beberapa kolom menjadi satu kolom. Sedangkan ROWSPAN digunakan untuk menggabungkan beberapa baris menjadi satu.

Contoh:
<HTML>
 <HEAD>
 <TITLE>Tabel dengan ROWSPAN dan 
COLSPAN</TITLE>
 </HEAD>
 <BODY>
 <TABLE BORDER="3" CELLPADDING="5" CELLSPACING="5" WIDTH="85%">
 <TR>
 <TD WIDTH="43%" ROWSPAN="2">baris 1, kolom 1<P>baris 2, kolom 1</TD>
 <TD WIDTH="57%">baris 1, kolom 2</TD>
 </TR>
 <TR>
 <TD WIDTH="57%">baris 2, kolom 2</TD>
 </TR>
 <TR>
 <TD WIDTH="100%" COLSPAN="2">baris 3, kolom 1<P>baris 3, kolom 2</TD>
 </TR>
 </TABLE>
 </BODY>
 </HTML>

 

Ø  Table COLOR

Anda bisa memberi warna pada tabel. Selain warna latar belakang, border tabel bisa juga ditentukan warnanya. Untuk latar belakang digunakan atribut BGCOLOR, sedangkan untuk memberi warna pada border gunakan atribut BORDERCOLOR.
Contoh:
<HTML>
 <HEAD>
 <TITLE>Tabel dengan ROWSPAN dan COLSPAN</TITLE>
 </HEAD>
 <BODY>
 <TABLE BORDER="3" CELLPADDING="3" CELLSPACING="5" WIDTH="100%" BORDERCOLOR="#FF0000">
 <TR>
 <TD WIDTH="50%" BGCOLOR="#808080"> </TD>
 <TD WIDTH="50%"> </TD>
 </TR>
 <TR>
 <TD WIDTH="50%"> </TD>
 <TD WIDTH="50%" BGCOLOR="#008080"> </TD>
 </TR>
 </TABLE>
 <TABLE BORDER="3" CELLPADDING="3" CELLSPACING="5" WIDTH="100%" BORDERCOLORLIGHT="#008080"
 BORDERCOLORDARK="#800080">
 <TR>
 <TD WIDTH="100%"> </TD>
 </TR>
 </TABLE>
 </BODY>
 </HTML>




Tabel Element Html :

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)


RANCANGAN STRUKTURAL
 1
Kepala
<H?></H?>
(Heading - spesifikasi untuk menetapkan 6 tingkatan kepala)
  2
Penataan (Align) Kepala
<H? ALIGN=LEFT|CENTER|RIGHT></H?>
 
  3
Bagian (Division)
<DIV></DIV>
 
  4
Penataan Bagian
<DIV ALIGN=LEFT|RIGHT|CENTER></DIV>
 
  5
Kutipan Blok (Block Quote)
<BLOCKQUOTE></BLOCKQUOTE>
(tampilan dengan jeda terhadap batas pinggir)
  6
Penekanan (Emphasis)
<EM></EM>
(umumnya huruf miring)
  7
Penguatan (Strong Emphasis)
<STRONG></STRONG>
(umumnya huruf tebal)
  8
Kutipan singkat (Citation)
<CITE></CITE>
(umumnya huruf miring)
 9
Kode
<CODE></CODE>
(Code - untuk source code listings)
  10
Contoh Keluaran
<SAMP></SAMP>
(Sample Output)
  11
Masukan Papan Ketik
<KBD></KBD>
(Keyboard Input)
  12
Variabel
<VAR></VAR>
(Variable)
  13
Definisi
<DFN></DFN>
(Definition - jarang dipakai)
  14
Alamat Pengarang (Author's Address)
<ADDRESS></ADDRESS>
 
  15
Huruf ukuran Besar
<BIG></BIG>
 
  16
Huruf Ukuran Kecil
<SMALL></SMALL>
 


FORMAT TAMPILAN
1
Huruf Tebal
<B> </B>
(Bold)
2
Huruf Miring
<I></I>
(Italic)
3
Garis Bawah
<U></U>
(Underline - jarang digunakan)
4
Huruf Coret
<STRIKE></STRIKE>
(Strikeout - jarang digunakan)
5
Huruf Coret
<S></S>
(Strikeout - jarang digunakan)
6
Huruf Geser Bawah
<SUB></SUB>
(Subscript)
7
Huruf Geser Atas
<SUP></SUP>
(Superscript)
8
Huruf Mesin Ketik
<TT></TT>
(Typewriter - huruf berjarak tetap)
9
Pra-format (Preformatted)
<PRE></PRE>
(menampilkan dengan jarak pra-format)
10
Jarak Huruf
<PRE WIDTH=?></PRE>
(mengatur jarak huruf)
11
Rata Tengah
<CENTER></CENTER>
(Center - berlaku untuk teks maupun gambar)
12
Huruf Kedip
<BLINK></BLINK>
(Blinking - tag terlucu sampai kini)
13
Ukuran Huruf
<FONT SIZE=?></FONT>
(Font Size - boleh diisi dari 1 sampai 7)
14
Rubah Ukuran Huruf
<FONT SIZE="+|-?"></FONT>
 
15
Basis Ukuran Huruf
<BASEFONT SIZE=?>
(boleh diisi 1 sampai 7; ukuran standard/default=3)
16
Warna Huruf
<FONT COLOR="#$$$$$$"></FONT>
 
17
Pilih Jenis Huruf
<FONT FACE="***"></FONT>
 
18
Teks Multi Kolom
<MULTICOL COLS=?></MULTICOL>
 
19
Jarak Batas Kolom
<MULTICOL GUTTER=?></MULTICOL>
(default = 10 pixels)
20
Lebar Kolom
<MULTICOL WIDTH=?></MULTICOL>
 
21
Celah (Spacer)
<SPACER>
 
22
Jenis Celah
<SPACER TYPE=horizontal| vertical|block>
 
23
Ukuran Celah
<SPACER SIZE=?>
 
24
Dimensi Celah
<SPACER WIDTH=? HEIGHT=?>
 
25
Penataan Celah
<SPACER ALIGN=left|right|center>
 



ACUAN DAN GRAFIK
1
Acuan pada dokumen tertentu
<A HREF="URL"></A>
 
2
Acuan pada sasaran dalam dokumen
<A HREF="URL#***"></A>
(bila terdapat pada dokumen lain)
<A HREF="#***"></A>
(bila terdapat pada dokumen yang sama)
3
Jendela Sasaran (Target Window)
<A HREF="URL" TARGET="***| |_blank|_self|_parent|_top"></A>
 
4
Penamaan sasaran pada dokumen
<A NAME="***"></A>
 
5
Kaitan(Relationship)
<A REL="***"></A>
(jarang digunakan)
6
Kaitan terbalik (Reverse Relationship)
<A REV="***"></A>
(jarang digunakan)
7
Peragaan Gambar
<IMG SRC="URL">
 
8
Penataan Letak Gambar
<IMG SRC="URL" ALIGN=TOP|BOTTOM|MIDDLE|LEFT|RIGHT>
 
9
Penataan Letak Gambar
<IMG SRC="URL" ALIGN=TEXTTOP| ABSMIDDLE|BASELINE|ABSBOTTOM>
 
10
Alternatif Teks
<IMG SRC="URL" ALT="***">
(saat gambar belum/tidak ditampilkan)
11
Daerah Gambar (Imagemap)
<IMG SRC="URL" ISMAP>
(membutuhkan program script)
12
Daerah Gambar pihak klien
<IMG SRC="URL" USEMAP="URL">
 
13
Uraian Daerah Gambar
<MAP NAME="***"></MAP>
 
14
Pembagian Daerah Gambar
<AREA SHAPE="RECT" COORDS=",,," HREF="URL"|NOHREF>
 
15
Dimensi Gambar
<IMG SRC="URL" WIDTH=? HEIGHT=?>
(in pixels)
16
Garis Batas
<IMG SRC="URL" BORDER=?>
(dalam satuan pixel)
17
Ruang Pembatas
<IMG SRC="URL" HSPACE=? VSPACE=?>
(dalam satuan pixel)
18
Gambar Low-Res Proxy
<IMG SRC="URL" LOWSRC="URL">
 
19
Pemindahan Tarik
<META HTTP-EQUIV="Refresh" CONTENT="?; URL=URL">
(Client Pull)
20
Objek Cantum
<EMBED SRC="URL">
(Embed Object - mencantumkan objek pada dokumen)
21
Ukuran Objek
<EMBED SRC="URL" WIDTH=? HEIGHT=?>
 



PEMISAH
1
Paragraf
<P></P>
(tag penutup seringkali tak diperlukan)
2
Align Text
<P ALIGN=LEFT|CENTER|RIGHT></P>
 
3
Pndah Baris
<BR>
(pindah ke baris berikut)
4
Putus Penataan Baris
<BR CLEAR=LEFT|RIGHT|ALL>
(Clear Textwrap)
5
Garis Datar
<HR>
(Horizontal Rule)
6
Penataan Letak Garis
<HR ALIGN=LEFT|RIGHT|CENTER>
 
7
Tebal Garis
<HR SIZE=?>
(dalam satuan pixel)
8
Lebar Garis
<HR WIDTH=?>
(dalam satuan pixel)
9
Lebar Garis Persentasi
<HR WIDTH="%">
(dalam persentasi terhadap lebar halaman)
10
Garis Pejal
<HR NOSHADE>
(Solid Line - tanpa pola 3D)
11
Tanpa Ganti Baris
<NOBR></NOBR>
(No Break - mencegah ganti baris)
12
Sambung Suku Kata
<WBR>
(Word Break - letak ganti baris bila diperlukan)





DAFTAR
 
1
Daftar Tanpa Nomor
<UL><LI></UL>
(Unordered List - Cantumkan <LI> sebelum tiap butir)
 
2
Kompak
<UL COMPACT></UL>
(Compact)

3
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)
 
4
Daftar Bernomor
<OL><LI></OL>
(Ordered List - Cantumkan <LI> sebelum tiap butir)
 
5
Kompak
<OL COMPACT></OL>
 

6
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)
 
7
Nomor Mulai
<OL START=?>
(berlaku umum untuk semua butir dalam daftar)
 
<LI VALUE=?>
(berlaku khusus pada butir ini dan selanjutnya)
 
8
Daftar Definisi
<DL><DT><DD></DL>
(Definition List - <DT>=istilah, <DD>=uraian)
 
9
Kompak
<DL COMPACT></DL>
 

10
Daftar Menu
<MENU><LI></MENU>
(Cantumkan <LI> sebelum butir menu)
 
11
Kompak
<MENU COMPACT></MENU>
 

12
Daftar Direktori
<DIR><LI></DIR>
(Cantumkan <LI> sebelum tiap butir direktori)
 
13
Kompak
<DIR COMPACT></DIR>
 



LATAR BELAKANG DAN WARNA
1
Latar Belakang Gambar
<BODY BACKGROUND="URL">
(Tiled Background)
2
Warna Latar Belakang
<BODY BGCOLOR="#$$$$$$">
(Background Color - urutan: merah/hijau/biru)
3
Warna Huruf Teks
<BODY TEXT="#$$$$$$">
 
4
Warna Acuan
<BODY LINK="#$$$$$$">
 
5
Acuan Lepas Kunjung
<BODY VLINK="#$$$$$$">
(Visited Link)
6
Acuan Aktif
<BODY ALINK="#$$$$$$">
(Active Link)

HURUF SPESIAL(these must all be in lower case)
1
Special Character
&#?;
(where ? is the ISO 8859-1 code)
2
<
&lt;
 
3
>
&gt;
 
4
&
&amp;
 
5
"
&quot;
 
6
Registered TM
&reg;
 
7
Copyright
&copy;
 
8
Spasi tak putus
&nbsp;
Non-breaking Space






FORMULIR
1
Rancangan Formulir
<FORM ACTION="URL" METHOD=GET|POST></FORM>
Define Forms
2
Mengirimkan File
<FORM ENCTYPE="multipart/form-data"></FORM>
File Upload
3
Input Field
<INPUT TYPE="TEXT|PASSWORD|CHECKBOX|RADIO| IMAGE|HIDDEN|SUBMIT|RESET">
 
4
Nama Field
<INPUT NAME="***">
 
5
Nilai Field
<INPUT VALUE="***">
 
6
Kotak Periksa
<INPUT CHECKED>
(checkboxes dan radio boxes)
7
Ukuran Field
<INPUT SIZE=?>
(dalam satuan jumlah karakter)
8
Panjang Maksimum
<INPUT MAXLENGTH=?>
(dalam satuan karakter)
9
Daftar Pilihan
<SELECT></SELECT>
Selection List
10
Nama Daftar Pilihan
<SELECT NAME="***"></SELECT>
 
11
Jumlah Pilihan
<SELECT SIZE=?></SELECT>
 
12
Banyak Pilihan
<SELECT MULTIPLE>
(dapat memilih lebih dari satu)
13
Pilihan
<OPTION>
(butir yang dapat dipilih)
14
Pilihan Default
<OPTION SELECTED>
 
15
Ukuran Input Box
<TEXTAREA ROWS=? COLS=?></TEXTAREA>
 
16
Nama Input Box
<TEXTAREA NAME="***"></TEXTAREA>
 
17
Rangkuman Teks
<TEXTAREA WRAP=OFF|VIRTUAL|PHYSICAL></TEXTAREA>
Wrap Text







TABEL
1
Rancangan Tabel
<TABLE></TABLE>
 
2
Garis Batas Tabel
<TABLE BORDER=?></TABLE>
 
3
Celah Sel
<TABLE CELLSPACING=?>
Cell Spacing
4
Penyangga Sel
<TABLE CELLPADDING=?>
Cell Padding
5
Lebar Tabel
<TABLE WIDTH=?>
(dalam satuan pixel)
6
Lebar Tabel Persentasi
<TABLE WIDTH="%">
(dalam satuan persen terhadap lebar halaman)
7
Baris dalam Tabel
<TR></TR>
 
8
Penataan Letak Baris
<TR ALIGN=LEFT|RIGHT| CENTER|MIDDLE|BOTTOM
VALIGN=TOP|BOTTOM|MIDDLE>
 
9
Sel dalam Tabel
<TD></TD>
(harus ada dalam setiap baris tabel)
10
Penataan Letak Sel
<TD ALIGN=LEFT|RIGHT| CENTER|MIDDLE|BOTTOM
VALIGN=TOP|BOTTOM|MIDDLE>
 
11
Tanpa Ganti Baris
<TD NOWRAP>
 
12
Rentang Kolom
<TD COLSPAN=?>
Columns to span
13
Rentang Baris
<TD ROWSPAN=?>
Rows to span
14
Lebar Sel
<TD WIDTH=?>
(dalam satuan pixel)
15
Lebar Sel Persentasi
<TD WIDTH="%">
(dalam satuan persen terhadap lebar tabel)
16
Warna Sel
<TD BGCOLOR="#$$$$$$">
 
17
Kepala Tabel
<TH></TH>
(Table Header - seperti data dengan Bold dan Center)
18
Penataan Letak Kepala Tabel
<TH ALIGN=LEFT|RIGHT| CENTER|MIDDLE|BOTTOM
VALIGN=TOP|BOTTOM|MIDDLE>
 
19
Tanpa Baris Baru
<TH NOWRAP>
 
20
Rentang Kolom
<TH COLSPAN=?>
Columns to Span
21
Rentang Baris
<TH ROWSPAN=?>
Rows to Span
22
Lebar Kepala Tabel
<TH WIDTH=?>
(dalam satuan pixel)
23
Lebar Persentasi
<TH WIDTH="%">
(dalam persentasi terhadap lebar tabel)
24
Warna Kepala Tabel
<TH BGCOLOR="#$$$$$$">
 
25
Keterangan Tabel
<CAPTION></CAPTION>
Caption
26
Penataan Keterangan
<CAPTION ALIGN=TOP|BOTTOM>
(di atas / di bawah tabel)


FRAMES
1
Dokumen dalam Frame
<FRAMESET></FRAMESET>
(sebagai pengganti <BODY>)
2
Tinggi Baris Frame
<FRAMESET ROWS=,,,></FRAMESET>
(dalam satuan pixel atau %)
3
Tinggi Baris Frame
<FRAMESET ROWS=*></FRAMESET>
(* = ukuran relatif)
4
Lebar Kolom Frame
<FRAMESET COLS=,,,></FRAMESET>
(dalam satuan pixel atau %)
5
Lebar Kolom Frame
<FRAMESET COLS=*></FRAMESET>
(* = ukuran relatif)
6
Lebar Garis Batas
<FRAMESET BORDER=?>
 
7
Garis Batas
<FRAMESET FRAMEBORDER="yes|no">
 
8
Warna Garis Batas
<FRAMESET BORDERCOLOR="#$$$$$$">
 
9
Rancangan Frame
<FRAME>
(isi dari frame individu)
10
Tampilan Dokumen Frame
<FRAME SRC="URL">
 
11
Nama Frame
<FRAME NAME="***"|_blank|_self| _parent|_top>
 
12
Lebar Batas
<FRAME MARGINWIDTH=?>
(batas kiri dan kanan)
13
Tinggi Batas
<FRAME MARGINHEIGHT=?>
(batas atas dan bawah)
14
Scrollbar?
<FRAME SCROLLING="YES|NO|AUTO">
Memungkinkan scrolling pada frame
15
Ukuran Frame tak bisa diubah
<FRAME NORESIZE>
 
16
Batas Frame
<FRAME FRAMEBORDER="yes|no">
 
17
Warna Garis Batas
<FRAME BORDERCOLOR="#$$$$$$">
 
18
Isi tanpa Frame
<NOFRAMES></NOFRAMES>
(bagi browser yang tak mampu frame)

JAVA
1
Applet
<APPLET></APPLET>
 
2
Nama File Applet
<APPLET CODE="***">
 
3
Parameter Applet
<APPLET PARAM NAME="***">
 
4
Sumber Applet
<APPLET CODEBASE="URL">
 
5
Identifier Applet
<APPLET NAME="***">
(sebagai rujukan di tempat lain pada halaman sama)
6
Teks Alternatif
<APPLET ALT="***">
(untuk browser tanpa kemampuan Java browsers)
7
Penataan Applet
<APPLET ALIGN="LEFT|RIGHT|CENTER">
 
8
Ukuran Applet
<APPLET WIDTH=? HEIGHT=?>
(in pixels)
9
Celah batas Applet
<APPLET HSPACE=? VSPACE=?>
(in pixels)

LAIN-LAIN


1
Komentar
<!-- *** -->
(tidak ditampilkan oleh browser)
2
Prolog HTML 3.2
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
 
3
Mampu Cari
<ISINDEX>
(indikasi indeks yang dapat dicari-temukan)
4
Prompt
<ISINDEX PROMPT="***">
(teks sebagai prompt)
5
Perintah Cari
<A HREF="URL?***"></a>
(gunakan tanda tanya yang sebenarnya)
6
URL dari file ini
<BASE HREF="URL">
(harus terletak di header)
7
Nama Dasar Window
<BASE TARGET="***">
(harus terletak di header)
8
Kaitan
<LINK REV="***" REL="***" HREF="URL">
(Relation dan Reverse Relation, harus terletak di header)
9
Informasi Meta
<META>
(harus terletak di header)
10
Lembar Gaya Penulisan
<STYLE></STYLE>
(Style Sheet - belum didukung sepenuhnya)
11
Scripts
<SCRIPT></SCRIPT>
(belum didukung sepenuhnya)
LKS SISWA :

Soal Latiahan 1
Essay :
Jawablah dengan benar pertanyaan dibawah ini :
1.    Apa kepanjangan HTML dan apa kegunaannya.
2.    Siapa yang membuat script HTML.
3.    Tuliskan struktur dasar dari HTML.
4.    Apa fungsi dari tag <Title>.
5.    Apa fungsi dari tag <body>.
6.    Apa yang dimaksud dengan Tag
7.    Ada berapa jenis tag dalam html sebutkan dan jelaskan.
8.    Bagaimana menuliskan perintah mengganti huruf yang akan ditampilkan dengan huruf “arial Black”
9.    Bagaimana menambahkan warna huruf pada tulisan yang ditampilkan.
10.  Bagaimana manambahkan efek berkedip pada text.


Soal Latihan 2
1.    <body text="v" bgcolor="w" background="uri" link="x" alink="y" vlink="z">

</body>

Coba jelaskan bagian-bagian yang terdapat dalam perintah diatas
ü  text              :
ü  bgcolor        :
ü  background           :
ü  link              :
ü  alink            :
ü  vlink            :

2.    Apa yang dimaksud dengan Atribute pada script html.
3.    Coba tuliskan elemen dari
ü  Html
ü  Body
ü  Title
ü  Head
4.    Apa perbedaan perintah <br> dan <p>
5.    Apa fungsi dari perintah <strong>
6.    Apa perintah yang digunakan untuk membuat efek huru tebal miring dan di garisbawahi.
7.    <small> perintah ini digunakan untuk...
8.    <s> isi Tulisan</s> perintah ini digunakan untuk membuat huruf…
9.    <pre>isi tulisan</pre> digunakan untuk ….
10.  <center>isi tulisan</center> digunakan untuk….



0 komentar:

Posting Komentar