Anda di halaman 1dari 6

www.agniluthfi.

com
Teori Dasar HTML

Untuk membangun sebuah web page dibutuhkan sebuah bahasa pemrograman


yang lebih dikenal dengan sebutan web scripting. Dikatakan script karena
perintah kode program tersebut akan di interpreter dan tidak ada kompilasi
untuk menjadikannya executable. Berdasarkan letak proses interpreter, web
scripting dibagi menjadi dua kategori yaitu yang bersifat client side dan server
side. Client side dilakukan oleh web browser seperti opera, mozilla firefox, dll.
Untuk contoh bahasa client side adalah HTML, CSS, Javascript, dan XML.
Sedangkan server side dilakukan oleh web server seperti PWS, IIS, Apache, dll.
Untuk contoh bahasa server side adalah ASP, PHP, JSP, dab CGI/PL.

Web scripting yang bersifat client side hanya akan menciptakan sebuah web page
yang bersifat statis. Web scripting yang bersifat statis ini biasanya hanya
menekankan pada design dan tampilan. Artinya tidak mungkin mengupdate
informasi seketika pada web page yang bersifat statis. Sehingga tidak mungkin
menciptakan suatu situs yang dinamis jika hanya menggunakan web scripting
yang bersifat statis tapi harus dipadukan juga dengan web scripting yang bersifat
dinamis.

HTML atau HyperText Markup Language adalah sebuah bahasa pemrograman


web yang bersifat client side yang dapat menampilkan informasi berupa teks,
gambar, serta multimedia dan juga untuk menghubungkan antar tampilan web
page atau hyperlink.

Tidak diperlukan suatu editor khusus untuk menggunakan perintah-perintah


dalam HTML. Anda dapat menggunakan Notepad atau program editor lainnya
yang berbasis GUI seperti Adobe Dreamweaver atau FrontPage. Tetapi bagi
seorang pengembang aplikasi web maka kemampuan penguasaan terhadap kode-
kode HTML sangat diperlukan.

1
www.agniluthfi.com
Sebuah dokumen HTML harus memiliki struktur minimal Head dan Body.
Bahasa pemrograman HTML tidak lepas dari yang namanya TAG. Tag memiliki
pembuka <TAG>, tetapi tidak semua TAG punya penutup </TAG>. tag memberi
instruksi interpreter kepada browser. Sebuah dokumen HTML memiliki tag
pembuka HTML dan tag penutup /HTML untuk memberitahukan kepada
browser bahwa dokumen tersebut adalah dokumen HTML. Penulisan HTML ini
tidak bersifat case sensitive, artinya tidak dibedakan antara huruf kapital dan
huruf kecil. Semuanya sama saja.

Di dalam sebuah tag HTML terdapat atribut tag. Atribut yang ada didalam suatu
tag HTML belum tentu sama dengan atribut tag HTML yang lain. Atribut yang
digunakan didalam tag tidak memiliki urutan tertentu. Atribut tag digunakan
untuk memodifikasi sifat-sifat dari tag tersebut.

Setelah tanda “<” harus langsung diikuti oleh TAG dan ditutup oleh tanda “>”.
Nama tag sendiri harus mengikuti standar W3C yaitu sebuah lembaga atau
organisasi internasional yang mengatur standardisasi web.

Dalam dokumen HTML diperlukan tag <HEAD> </HEAD>, dalam tag ini
diletakkan judul web page dengan menggunakan tag <TITLE> Judul Web Page
</TITLE>, sedangkan didalam tag <BODY> </BODY> berisikan isi dari web
page Anda. Untuk ekstensi dari file HTML perlu ditambahkan .html atau .htm di
belakang nama filenya misalnya index.htm.

Penulisan tag-tag HTML tidak akan terpengaruh oleh perintah langsung


keyboard seperti penekanan tombol enter atau spasi sehingga diperbolehkan
menyusun tag-tag HTML secara continue horizontal.

2
www.agniluthfi.com
Body

Di dalam tag terdapat beberapa atribut. Atribut tag berada di dalam tanda tag
tersebut. Atribut tersebut ada yang memiliki nilai tetapi ada juga yang tidak. Tag
<BODY> memiliki atribut

<BODY bgcolor=”#...” background=”…”>

Dalam HTML nilai warna yang dapat diberikan pada atribut bgcolor adalah
dengan menggunakan aturan komposisi RGB dengan angka hexadecimal
maksimal adalah FF (setara dengan 255 decimal) tiap komposisinya. Sebagai
contoh jika kita ingin memberikan warna merah, maka nilainya adalah
“#FF0000”. Atau dapat juga menggunakan pre-define color seperti red, green,
blue, dll. Sedangkan untuk nilai atribut background adalah nama file gambar
lengkap dengan lokasi folder dan ekstensi filenya. Format file gambar yang
didukung oleh HTML antara lain adalah JPEG, PNG,dan GIF.

Heading

Heading digunakan untuk menampilkan format huruf yang besar dan dicetak
tebal, biasanya digunakan untuk judul atau topic utama dari sebuah paragraph,
ukurannya ada dari yang terbesar <H1> sampai yang terkecil <H6>, sedangkan
untuk mengatur posisi heading digunakan atribut “align” yang bisa diisi nilai left,
center, right, ataupun justify.

Paragraf

Untuk memformat paragraph agar dapat rata kiri, kanan, tengah, dan justify
digunakan tag pembuka <P align=”…”> dan penutup </P>. Isi atribut align
dengan left, right, center, atau justify. Antar paragraph dalam HTML akan
dibatasi secara otomatis oleh sebuah baris.

3
www.agniluthfi.com
Breaking Now

Tag <BR> in digunakan untuk berpiindah ke baris baru dalam isi dokumen. Ini
adalah salah satu contoh tag HTML yang tidak memiliki tag penutup.

Horizontal Ruler

Tag yang digunakan untuk membuat garis horizontal adalah <HR>, adapun
atribut yang dimiliki adalah “align” untuk perataan, “size” untuk mengatur
ketebalan garisnya, dan “width” untuk mengatur lebar garisnya (dalam pixel atau
persen). Penggunaan satuan persen memiliki arti bahwa ukuran garis horizontal
akan diambil presentase terhadap width dari tampilan jendelanya. Tag HR ini
juga tidak punya tag penutup.

Preformat

Dengan fasilitas ini tampilan yang akan dofirmat sama persis dengan isi yang ada
di dalam tag <PRE>isi</PRE>. DIdalam tag <PRE> tombol enter untuk ganti
baris atau spasi untuk jeda dapat digunakan.

Bold, Italic, Under Line, Subscript, Superscript, Stripe

Berikut ini adalah cara memberikan efek cetak huruf dalam dokumen HTML

Untuk memberikan efek huruf tebal (bold):


<b>cetak tebal</b>

Untuk memberikan efek huruf miring(italic):


<i>cetak miring</i>

Untuk memberikan efek huruf yang diberi garis bawah(underline):


<u>garis bawah</u>

4
www.agniluthfi.com
Untuk memberikan efek huruf sebagai subscript:
<sub>cetak subscript</sub>

Untuk memberikan efek huruf sebagai superscript:


<sup>cetak superscript</sup>

Untuk memberikan efek huruf yang dicoret stripe:


<s>cetak stripe</s>
List

Dalam dokumen HTML kita dapat menampilkan daftar list seperti Bullet &
Numbering. Ada dua macam list yaitu Unorder list (Bullets) dan OrderedList
(Numbering). Pada unordered list digunakan tag <UL> sebagai pembuka dan tag
</UL> sebagai tag penutup, untuk item-item list yang ada didalamnya
digunakan tag <LI> untuk mengawalinya. Unordered list mempunyai atribut
“type” yaitu bentuk dari bulletnya, ada beberapa type yaitu disc, circle,dan
square. Ordered list dapat menggunakan tag <OL> </OL>. Ordered list juga
memiliki atribut tipe untuk menentukan tipe penomorannya. Tipe-tipenya
adalah 1 untuk penomoran 1,2,3,…, A untuk penomoran A,B,C,…, I untuk
penomoran I,II,III,…, a untuk a,b,c,…, i untuk penomoran I,ii,iii,….
Bila Anda tidak mendefinisikan tipenya, maka secara default akan diberikan
penomoran angka.

Komentar

Seperti dalam bahasa pemrograman yang lainnya, HTML juga memiliki


komentar yang diatur oleh tanda <!--sebagai pembuka dan tanda --> sebagai
penutup. Komentar tidak akan diinterpreter oleh web browser, hanya sebagai
keterangan saja.

5
www.agniluthfi.com
Karakter Khusus dalam HTML

Dikarenakan penulisan tag HTML telah menggunakan tanda < dan > maka tanda
tersebut tidak dapat dipakai dalam isi dokumen HTML. Sebagai gantinya maka
penggunaan tanda < digunakan perintah &lt; dan > digunakan perintah &gt;.
Untuk spasi dalam HTML dapat digunakan perintah &nbsp;(non breaking
space).