berbagai versi dan pengenalan html
TRANSCRIPT
1
“Berbagai Versi dan Pengenalan HTML”
Makalah ini disusun untuk memenuhi tugas mata kuliah Teknologi Informasi dan Komunikasi
Oleh :
Nama : Hendyeka Angga Putra
NIM : 1102412103
Prodi : Kurikulum dan Teknologi Pendidikan
Makul : Teknologi Informasi dan Komunikasi
Rombel : 01
KURIKULUM DAN TEKNOLOGI PENDIDIKAN
FAKULTAS ILMU PENDIDIKAN
2013
2
KATA PENGANTAR
Puji syukur penulis kepada Allah SWT, karena atas taufik dan hidayah-Nya, penulis dapat
menyelesaikan makalah yang berjudul “Berbagai Versi dan Pengenalan HTML” tepat pada
waktunya. Penulisan makalah ini disusun untuk memenuhi tugas mata kuliah Teknologi
Informasi dan Komunikasi.
Namun demikian penulis menyadari bahwa penulisan makalah ini masih jauh dari
kesempurnaan. Ini semua disebabkan karena keterbatasan dan kemampuan penulis dalam hal
mencari data yang akan dijadikan sebagai sumber pengembangannya. Maka dari itu, penulis
sangat mengharapkan kritik dan saran dari semua pihak yang bersifat membangun demi
kesempurnaan penulisan makalah ini agar menjadi hasil yang baik untuk ke depannya.
Selain itu tidak lupa penulis mengucapkan terima kasih kepada semua pihak yang telah
membantu penulis baik materi maupun spiritualnya dalam penulisan makalah ini.
Akhir kata penulis mengucapkan semoga makalah ini dapat bermanfaat bagi pembaca
umumnya dan bagi penulis khususnya. Semoga perkembangan Teknologi Informasi dan
Komunikasi di Indonesia mampu bersaing dengan negara yang sudah maju.
3
DAFTAR ISI
Kata Pengantar................................................................................2
Daftar Isi..........................................................................................3
Bab I Pendahuluan
A. Latar Belakang Masalah.................................................................4
B. Tujuan Penulisan.............................................................................4
C. Metode Pengumpulan Data..............................................................4
D. Sistematika Penulisan…………………………………………….4
Bab II Pembahasan
A. Pengertian HTML............................................................................6
B. Sejarah HTML…………………………………………………….6
C. Perkembangan HTML……………………………………………..7
D. Fungsi HTML …………………..………………………………....8
E. Tag Tambahan ………………………………………………….....8
F. Struktur Dasar HTML ……………………………………………18
Bab III Penutup
A. Kesimpulan.......................................................................................35
Daftar Pustaka
4
BAB I
PENDAHULUAN
A. Latar Belakang Masalah
Dunia informatika akan selalu bersifat dinamis, dalam artian akan selalu berkembang
mengikuti jaman. Hal yang paling nampak adalah perkembangan internet. Saat ini semakin
banyak bermunculan website-website di dunia maya. Sebagai user tentunya kita sangat sering
menggunakan website tersebut. Ada banyak sekali program-program yang dapat digunakan
untuk membuat website tersebut, contohnya : php, dreamwaver, joomla, dll. Namun dasar dari
pemrograman tersebut tetaplah satu yakni HTML.
Sebagai dasar pembuatan web sebaiknya bahasa pemrograman HTML harus dikuasai
oleh web maker atau pembuat web. Namun dikarenakan banyaknya software ataupun web yang
menawarkan pembuatan web secara instan, bahasa pemrograman HTML sering dilupakan,
padahal ini merupakan dasar. Berlatar belakang ini maka penulis pada makalah ini akan
membahas mengenai bahasa pemrograman HTML.
B. Tujuan Penulisan
Setiap melakukan perkerjaan tentunya ada sasaran yang hendak dicapai. Demikian pula
yang terjadi dalam penyusunan makalah ini. Tujuan penyusunan makalah ini adalah sebagai
sarana pemenuhan atas tugas mata kuliah pemrograman terstruktur. Selain itu makalah ini juga
disusun untuk menjawab permasalahan yang telah dijabarkan pada latar belakang masalah.
Penulis berharap makalah ini pada akhirnya akan berguna sebagai sumber referensi bagi siapa
saja yang ingin mempelajari mengenai bahasa pemrograman HTML.
C. Metode Pengumpulan Data
Dalam pembuatan makalah ini penulis menggunakan 2 metode yakni kepustakaan dan
observasi. Metode kepustakaan disini maksudnya penulis menyusun makalah ini dengan
menggunakan sumber referensi yang sudah ada. Sedangkan metode observasi maksudnya
penulis mengambil beberapa sampel listing program dan didapat, mempraktekkannya dan
mencoba menganalisanya.
D. Sistematika Penulisan
Makalah ini terbagi daslah 3 bagian inti, yakni:
BAB I : PENDAHULUAN
5
Pada bab ini akan dijelaskan mengenai latar belakang pemilihan tema, tujuan penulisan, metode
yang digunakan penulis dan sistematika penyusunan makalah ini
BAB II : PEMBAHASAN
Pada bagian ini akan dijelaskan mengenai dasar-dasar HTML, pengertian HTML, dan beberapa
contoh pemrograman menggunakan bahasa pemrograman HTML.
BAB III : PENUTUP
Pada bagian ini akan diberikan kesimpulan dari pembahasan yang sudah ada sebelumnya.
6
BAB II
PEMBAHASAN
A. Pengertian HTML
Hyper Text Markup Language atau yang lebih kita kenal dengan singkatan HTML adalah
sebuah bahasa ataupun media yang digunakan dengan tujuan membuat sebuah halaman web dan
menampilkan berbagai informasi di dalam sebuah browser Internet. Saat ini, HTML dapat kita
katakana sebagai sebuah standar yang digunakan secara luas untuk menampilkan halaman web
walaupun sebenarnya HTML bermula dari sebuah bahasa yang sebelumnya banyak digunakan di
dunia penerbitan dan percetakan yang disebut dengan SGML (Standard Generalized Markup
Language.
HTML ini merupakan sebuah format bahasa dari world wide web (WWW) untuk
menulis & menampilkan dokumen. Sehingga dokumen tersebut dapat dengan mudah tersebar ke
PC melalui media jaringan komputer atau internet. HTML ini berupa kode tag yang
menginstruksikan browser untuk menghasilkan tampilan sesuai dengan yang diinginkan.
Sehingga, ntuk dapat membuka dokumen yang ditulis dengan HTML maka kita perlu sebuah
tool yaitu browser misalnya Opera, Mozila, Google Chrome, Netscape, dan banyak lagi yang
lainnya. HTML juga dapat dikenali oleh aplikasi pembuka email ataupun dari PDA dan program
lain yang memiliki kemampuan browser.
Dalam prakteknya, hanya segelintir perancang web yang benar-benar membuat website
murni dengan full coding (HTML). Selain karena prosesnya yang bisa memakan waktu yang
lama, faktor kemampuan dalam penguasaan HTML yang minim juga menjadi penyebab. Hal lain
tentunya juga karena tidak terbiasa dengan HTML. Para web designer yang tidak terbiasa dengan
coding lebih sering menggunakan web editor (WYSIWYG) dibandingkan dengan melakukan
coding murni HTML. Tapi, telah terbiasa menggunakan coding, maka kita akan memahami
struktur web yang dibuat, memahami bagaimana agar konten HTML bisa di-render oleh browser
dengan baik, dan masih banyak lagi. Namun, apapun itu tetap saja memiliki tujuan yang sama
untuk menghasilkan website yang lebih baik. Tidak ada jaminan sebuah web dengan murni
coding hasilnya baik, dan tidak ada jaminan pula website yang dibuat dengan bantuan web editor
hasilnya baik. Yang paling penting adalah bagaimana perancang web itu meracik sebuah website
yang diterima masyarakat.
B. Sejarah HTML
Konsep HTML diciptakan pertama kali oleh IBM pada tahun 1980 pada saat berniat
membuat bahasa kode untuk menggabungkan teks dengan perintah pemformatan agar mengenali
elemen dokumen dan untuk meletakkan elemen-elemen yang menandai bagian suatu dokumen
seperti judul , alamat dan isi dokumen. Lalu, pada akhirnya elemen-elemen itu menjadi suatu
program untuk melakukan pemformatan dokumen secara otomatis. Bahasa pemprograman untuk
7
melakukan tugas tersebut disebut markup language, atau lebih lengkapnya IBM menamai
program tersebut sebagai Generalized Markup Language (GML).
Pada tahun 1986, ISO (International Standard Organization) mengeluarkan standarisasi
bagi pembuatan dokumen-dokumen behasa markrup berdasarkan GML. Hal ini ditandai dengan
keluarnya ISO 8879. ISO menamai GML ini menjadi SGML (Standard Generalized Markup
Language). Dalam perkembangannya, bahasa SGML kemudian banyak digunakan di dunia
penerbitan.
Pada tahun 1989, Tim Caillau bekerja sama dengan Barners Lee Robert, dan ketika
mereka kerja di CERN, sebuah lembaga peneliti fisika energy tinggi di jenewa mencoba untuk
menlakukan pengembangan terhadap SGML. Dan akhirnya setelah pemikiran dan
perkembangan-perkembangan yang sedemikian rupa rumitnya, lahirlah HTML yang digunakan
untuk membuat halaman website. HTML ini pertama kali dipopulerkan oleh browser Mosaic.
Dalam perkembangannya, pada tahun 1990 bahasa pemformatan ini mengalami
perkembangan yang sangat pesat. Sejak tahun 1996, Worl Wide Web Consortium, (WWWC)
juga ikut serta dalam melakukan pengembangan dan mengeluarkan versi HTML 3.2. sejak itulah
HTML digunakan sebagai bahasa standar internet yang merupakan perangkat dibawah kendali
WWWC.
C. Perkembangan HTML
SGML ke HTML HTML, yang juga menggunakan teknologi markup
language merupakan salah satu bagian dari SGML. Seorang peneliti yang bernama Tim
Berners-Lee dari CERN yang kini menjadi direktur W3C (World Wide Web
Consortium) mengemukakan suatu ide tentang pembuatan suatu skrip bahasa pemprograman
dandokumen yang bisa diakses oleh seluruh komputer tanpa melihat jenis platform-nya apakah
Windows, Unix, Linuxdan sebagainya. Semenjak itu HTML lebih populer daripada SGML.
Sebelum suatu HTML disahkan sebagai suatu dokumen HTML standar, ia harus disetujui
dulu oleh W3C untuk dievaluasi secara ketat.Setiap kerjadi perkembangan suatu versi HTML,
maka browser pun harus memperbaiki diri agar bisa mendukung kode-kode HTML yang baru
tersebut. Sebab jika tidak, browser tak akan bisa menampilkan HTML tersebut.
Berikut ini beberapa versi dari perkembangan HTML:
1. HTML versi 1.0
Kemampuan yang dimiliki versi 1.0 ini antara lain heading, paragraph, hypertext, list, serta
cetak tebal dan miring pada teks. Versi ini juga mendukung peletakan image pada dokumennya
tanpa memperbolehkan meletakkan teks disekelilingnya (wrapping).
2. HTMl versi 2.0
Pada versi ini, penambahan kualitas HTML terletak pada kemampuannya untuk menampilkan
suatu form pada dokumen. Dengan adanya form ini, maka kita dapat memasukkan nama,
8
alamat, serta saran/kritik. HTML versi 2.0 ini merupakan pionir dari adanya homepage
interaktif.
3. HTML versi 3.0
HTML versi 3.0 menambahkan beberapa fasilitas baru seperti table. Versi ini yang disebut juga
sebagai HTML+ tidak bertahan lama dan segera digantikan HTML versi 3.2
4. HTML versi 4.0
HTML versi 4 ini merupakan HTML versi terakhir pada saat sumber ini diambil. HTML ini
memuat banyak sekali perubahan dan revisi dari pendahulunya. Perubahan ini terjadi di hampir
segala perintah-perintah HTML seperti table, image, link, text, meta, imagemaps, form, dan
lain- lain.
D. Fungsi HTML
HTML seperti yang dijelaskan sebelumnya merupakan bahasa pemrograman berbahasa
markup yang digunakan untuk menampilkan halaman website melalui browser. Namun tentu
bukan hal iu saja yang dapat dilakukan HTML, berikut ini fungsi dari HTML.
1. Membuat, mendesain, dan mengontrol tampilan dari web page (Halaman Web)
dan isinya.
2. Mempublikasikan document secara online sehingga bisa di akses, dilihat dan
ditampilkan dari dan ke seluruh dunia.
3. Membuat online form yang bisa di gunakan untuk menangani pendaftaran,
transaksi secara online.
4. Menambahkan object-object seperti image, audio, video dan juga java applet
(aplikasi java seperti java game dll) dalam document HTML.
5. Membuat link menuju halaman web lain dengan kode tertentu (hypertext).
E. Tag Tambahan
A. Tag Tambahan
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 <DIV
9
Bagian 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)
Garis Bawah <U></U> (Underline - jarang
digunakan)
Huruf Coret <STRIKE></STRIKE> (Strikeout - jarang
digunakan)
Huruf Coret <S></S> (Strikeout - jarang
digunakan)
Huruf Geser Bawah <SUB></SUB> (Subscript)
10
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)
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>
Basis Ukuran Huruf <BASEFONT SIZE=?> (boleh diisi 1 sampai 7;
ukuran standard/default=3)
Warna Huruf <FONT
COLOR="#$$$$$$"></FONT>
Pilih Jenis Huruf <FONT
FACE="***"></FONT>
Teks Multi Kolom <MULTICOL
COLS=?></MULTICOL>
Jarak Batas Kolom <MULTICOL
GUTTER=?></MULTICOL>
(default = 10 pixels)
Lebar Kolom <MULTICOL
WIDTH=?></MULTICOL>
Celah (Spacer) <SPACER>
Jenis Celah <SPACER TYPE=horizontal|
vertical|block>
Ukuran Celah <SPACER SIZE=?>
Dimensi Celah <SPACER WIDTH=?
HEIGHT=?>
Penataan Celah <SPACER
ALIGN=left|right|center>
Acuan Grafik
Acuan pada <A HREF="URL"></A>
11
dokumen tertentu
Acuan pada sasaran
dalam dokumen
<A HREF="URL#***"></A> (bila terdapat
pada dokumen
lain)
<A HREF="#***"></A> (bila terdapat
pada dokumen
yang sama)
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
>
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> (membutuhka
n 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)
12
Gambar Low-Res
Proxy
<IMG SRC="URL" LOWSRC="URL">
Pemindahan Tarik <META HTTP-EQUIV="Refresh"
CONTENT="?; URL=URL">
(Client Pull)
Objek Cantum <EMBED SRC="URL"> (Embed
Object -
mencantumka
n objek pada
dokumen)
Ukuran Objek <EMBED SRC="URL" WIDTH=? HEIGHT=?>
Pemisan
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)
Lebar Garis
Persentasi
<HR WIDTH="%"> (dalam persentasi
terhadap lebar
halaman)
Garis Pejal <HR NOSHADE> (Solid Line - tanpa
pola 3D)
Tanpa Ganti Baris <NOBR></NOBR> (No Break - mencegah
ganti baris)
Sambung Suku
Kata
<WBR> (Word Break - letak
ganti baris bila
diperlukan)
Daftar
Daftar Tanpa Nomor <UL><LI></UL> (Unordered List -
13
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 <OL><LI></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 <DL><DT><DD></DL> (Definition List -
<DT>=istilah,
<DD>=uraian)
Kompak <DL COMPACT></DL>
Daftar Menu <MENU><LI></MENU> (Cantumkan <LI>
sebelum butir menu)
Kompak <MENU COMPACT></MENU>
Daftar Direktori <DIR><LI></DIR> (Cantumkan <LI>
sebelum tiap butir
direktori)
Kompak <DIR COMPACT></DIR>
Latar belakang dan Warna
Latar Belakang Gambar <BODY (Tiled Background)
14
BACKGROUND="URL">
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)
Huruf Spesial
Special Character &#?; (where ? is the ISO 8859-1
code)
< <
> >
& &
" "
Registered TM ®
Copyright ©
Spasi tak putus Non-breaking Space
Formulir
Rancangan
Formulir
<FORM ACTION="URL"
METHOD=GET|POST></FORM>
Define
Forms
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)
15
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>
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|
16
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
Lebar Sel <TD WIDTH=?> (dalam satuan pixel)
Lebar Sel Persentasi <TD WIDTH="%"> (dalam satuan persen
terhadap lebar tabel)
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
Lebar Kepala Tabel <TH WIDTH=?> (dalam satuan pixel)
Lebar Persentasi <TH WIDTH="%"> (dalam persentasi
terhadap lebar tabel)
Warna Kepala Tabel <TH BGCOLOR="#$$$$$$">
Keterangan Tabel <CAPTION></CAPTION> Caption
Penataan Keterangan <CAPTION ALIGN=TOP|BOTTOM> (di atas / di bawah
tabel)
Frames
Dokumen dalam Frame <FRAMESET></FRAMESET> (sebagai
pengganti<BODY>)
Tinggi Baris Frame <FRAMESET
ROWS=,,,></FRAMESET>
(dalam satuan pixel atau
%)
Tinggi Baris Frame <FRAMESET
ROWS=*></FRAMESET>
(* = ukuran relatif)
Lebar Kolom Frame <FRAMESET
COLS=,,,></FRAMESET>
(dalam satuan pixel atau
%)
Lebar Kolom Frame <FRAMESET
COLS=*></FRAMESET>
(* = ukuran relatif)
Lebar Garis Batas <FRAMESET BORDER=?>
17
Garis Batas <FRAMESET
FRAMEBORDER="yes|no">
Warna Garis Batas <FRAMESET
BORDERCOLOR="#$$$$$$">
Rancangan Frame <FRAME> (isi dari frame individu)
Tampilan Dokumen Frame <FRAME SRC="URL">
Nama Frame <FRAME NAME="***"|_blank|_self|
_parent|_top>
Lebar Batas <FRAME MARGINWIDTH=?> (batas kiri dan kanan)
Tinggi Batas <FRAME MARGINHEIGHT=?> (batas atas dan bawah)
Scrollbar? <FRAME
SCROLLING="YES|NO|AUTO">
Memungkinkan
scrolling pada frame
Ukuran Frame tak bisa
diubah
<FRAME NORESIZE>
Batas Frame <FRAME
FRAMEBORDER="yes|no">
Warna Garis Batas <FRAME
BORDERCOLOR="#$$$$$$">
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
18
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)
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)
F. Struktur dasar HTML
HTML (Hypert Text Markup Language) merupakan bahasa pemrograman yang
digunakan dalam pembuatan halaman web. Dalam penggunaannya sebagian besar kode HTML
tersebut harus terletak di antara tag kontainer. Yaitu diawali dengan <namatag> dan diakhiri
dengan </namatag> (terdapat tanda “/”).
Berikut ini adalah kerangka dasar dokumen HTML yang merupakan aturan dari W3 Consortium.
<HTML>
<HEAD>***bagian dari head***</HEAD>
<BODY>***bagian dari body***</BODY>
</HTML>
Sebuah halaman web minimal mempunyai empat buat tag, yaitu :
19
<HTML>
Sebagai tanda awal dokumen HTML.
<HEAD>
Sebagai informasi page header. Di dalam tag ini kita bisa meletakkan tag-tag TITLE, BASE,
ISINDEX, LINK, SCRIPT, STYLE & META.
<TITLE>
Sebagai titel atau judul halaman. Kalimat yang terletak di dalam tag ini akan muncul pada
bagian paling atas browser Anda (pada title bar).
Contoh : <TITLE>Tips HTML — http://www.klik-kanan.com</TITLE>;
<BODY>
Di dalam tag ini bisa diletakkan berbagai page attribute seperti warna latar belakang, warna teks,
warna link, warna visited link, warna active link dan lain-lain.
Atribut :
BGCOLOR, BACKGROUND, TEXT, LINK, VLINK, ALINK, LEFTMARGIN &
TOPMARGIN.
Contoh :
<BODY bgcolor=”#000000″ background=”images/pcb.gif” text=”#FFFFFF” link=”#FF0000″
vlink=”FFFF00″ alink=”#0000FF”>
Sebuah contoh sederhana dokumen HTML :
<HTML>
<HEAD>
<TITLE>Halaman pembuka
</TITLE>
</HEAD>
<BODY bgcolor=”#FFFFFF” background=”images/gambar1.gif” text=”#FF0000″>
Letakkan text, images, dan link Anda di sini
</BODY>
20
</HTML>
a. Membuat Homepage Sederhana
Dalam pembuatah sebuah homepage, ada beberapa software yang dapat digunakan antara lain:
Notepad
Program teks sederhana milik Windows yang dapat digunakan untuk mengetikkan perintah
HTML. Jika kita menggunakan Linux atau unix, maka kita bisa menggunakan vi atau pico
sebagai pengganti Notepad.
Adapun langkah kerja membuat homepage dengan menggunakan Notepad adalah:
1. Klik Start pada menu utama Windows
2. All Programs
3. Accessories
4. Notepad
5. Pembuat Grafis
Untuk membuat gambar yang menarik perhatian. Seperti Adobe Photoshop, CorelDraw, dsb.
Browser
Untuk melihat hasil/tampilan homepage dari program -program HTML yang telah kita ketikkan
di Notepad. Yang kita gunakan kali ini adalah Microsoft Internet Explorer.
Ada 2 hal penting yang perlu kita ketahui yaitu fasilitas View Source dan Refresh yang berguna
mempercepat pekerjaan jika kita menggunakan Internet Explorer, yaitu :
View Source, untuk melihat source (isi perintah HTML) dari sebuah dokumen HTML.
Pada browser internet explorer,jika mengklik View lalu pilih Source, maka akan terlihat
source dari dokumen tersebut seperti pada Notepad. Sehingga kita akan lebih mudah
melakukan perubahan/edit dengan cepat.
Refresh, melihat dengan cepat tampilan baru dokumen HTML yang telah di ubah.
Dengan cara mengklik symbol refresh atau tekan F5.
b. Pengaturan Tampilan Homepage
Agar tampilan desain lebih menarik, maka dalam membuat program HTML sebaiknya juga
memperhatikan beberapa properti, yaitu :
1) HTML Format Teks
21
Untuk mendapatkan halaman web yang baik Anda harus melakukan pengaturan terhadap teks
seperti memilih jenis dan ukuran huruf, perataan, dll. Tag-tag di bawah ini yang biasa digunakan
dalam pengaturan teks :
Headers: <Hn>..</Hn>
Digunakan untuk mengatur ukuran huruf pada header. “n” mempunyai nilai antara 1 – 6 atau
antara <H1> sampai <H6>, dengan <H1> merupakan ukuran terbesar dan <H6> merupakan
ukuran terkecil.
Contoh tulis dalam notepad :
<HTML><BODY>
<H1>Header level 1</H1>
<H2>Header level 2</H2>
<H3>Header level 3</H3>
<H4>Header level 4</H4>
<H5>Header level 5</H5>
<H6>Header level 6</H6>
<HTML><BODY>
Paragraph Baru: <P>
Digunakan untuk pindah alinea atau paragraf. Tag ini bisa diberi akhiran </P> tapi juga bisa
tidak diberi.
Perhatikanlah contoh tulisan di bawah ini: <HTML><BODY>
Paragraf pertama <P>Paragraf kedua <P>Paragraf ketiga
</BODY></HTML>
Line Break: <BR>
Line break digunakan untuk pindah ke baris baru. Cobalah membuat tulisan berikut pada
Notepad:
<HTML><body> baris pertama
Baris kedua
22
Baris ketiga
<HTML><BODY>
Kesimpulannya, penekanan tombol Enter tidak menghasilkan baris dalam tampilan browser.
Demikianlah sifat penulisan dokumen HTML. Lantas, bagaimana caranya membuat baris?
Gunakanlah tag <BR>. Tag ini tidak mempunyai tag penutup. Bukalah source kode file HTML
tadi lalu edit seperti berikut:
<HTML><BODY>
Baris pertama
<BR>Baris kedua
<BR>Baris ketiga
</HTML></BODY>
Simpan kemudian lihat hasilnya dengan me-refresh pada browser. Hasilnya akan seperti ini:
Baris pertama
Baris kedua
Baris ketiga
Membuat baris kalimat, Tag <BR> tersebut dapat pula digunakan untuk membuat baris kosong,
artinya baris yang tidak mempunyai kalimat apa-apa. Editlah sekali lagi source code menjadi
seperti ini:
<HTML><BODY>
Baris pertama<BR><BR>Baris kedua kosong, dan ini baris ketiga<BR><BR><BR>Baris
keempat dan kelima kosong, dan ini baris keenam
</BODY></HTML>
Simpan lalu refresh sekali lagi maka hasilnya akan seperti ini:
Baris pertama
Baris kedua kosong, dan ini baris ketiga
Baris keempat dan kelima kosong, dan ini baris keenam
Di sini kita lihat bahwa tag <BR> yang ditulis dua kali akan menghasilkan dua baris, demikian
seterusnya.
23
No Line Break: <NOBR>
Bila digunakan tag ini maka teks yang panjang tidak secara otomatis pindah baris bawahnya bila
baris pertama sudah terlalu panjang.
Font <FONT>
Untuk mendefinisikan berbagai attribut FONT, yaitu : SIZE, FACE, COLOR.
Size adalah Ukuran font yang digunakan, berkisar antara 1 – 7 dengan 1 merupakan ukuran
terkecil dan 7 merupakan ukuran terbesar.
Face adalah jenis atau nama font. Anda bisa memilih maksimal 3 jenis font yang masing-
masing dipisahkan oleh koma. Bila terdapat spasi yang terletak pada nama font maka harus
digunakan tanda garis bawah ( _ ). Dalam memilih jenis font ini harus dipertimbangkan apakah
font yang kita gunakan pada halaman web kita nantinya akan terdapat pada komputer pengguna
yang lain (pengakses web kita). Pendeknya kita tidak usah menggunakan font-font yang
bentuknya aneh-aneh, gunakan saja font standar. Tapi bila Anda ingin menggunakan font yang
sedikit “aneh” Anda bisa menggunakan graphic.
COLOR adalah Warna font, didefinisikan dengan menggunakan nilai RGB/HEX atau
bisa juga langsung menggunakan nama warna (red misalnya).
Contoh :
<FONT SIZE=4 FACE=”Verdana, Arial, Helvetica” COLOR=”#FF0000″>Contoh teks yang
berwarna merah</FONT>
Hasilnya akan terlihat seperti :
Contoh teks yang berwarna merah
<BASEFONT>
Digunakan untuk mendefinisikan “default text”. Attribut sama dengan attribut FONT. Tag
FONT akan mengoverwrite setting pada BASEFONT.
Contoh :
<BASEFONT SIZE=2 FACE=”Arial,Helvetica” COLOR=”#FF0000″>
<CITE>Digunakan untuk quoting text
<CODE>
Monospaced font (digunakan bila Anda ingin meletakkan (memperlihatkan) kode HTML pada
dokumen HTML Anda).
24
<SAMP>
Monospaced font (digunakan bila Anda ingin meletakkan (memperlihatkan) kode HTML pada
dokumen HTML Anda)
<KBD>
Monospaced font (digunakan bila Anda ingin meletakkan (memperlihatkan) kode HTML pada
dokumen HTML Anda) <BIG> Ukuran teks akan lebih besar satu ukuran.
<SMALL> Ukuran teks akan lebih kecil satu ukuran
<SUP> Membuat tekssuperscript
<SUB> membuat tekssub script
<ABBREV>Abbreviations
<ACRONYM> Untuk akronim
<PERSON> Digunakan untuk indexing
<Q> Membuat short inline quotation
<VAR> Membuat variable name, selalu dalam ITALICS.
Selain tag dan atribut di atas, masih terdapat lagi tag-tag yang berhubungan dengan pengaturan
teks, yaitu :
<I> Italic text
<U> Underscore
<TT> Typewriter
<S> Strikeout – draws a line through the text
<PRE> Preformatted Text
<DFN> Definition
<BLINK> Text berkedip (lebih baik jangan digunakan)
<STRONG> Strong
<ADDRESS>
25
Tag-tag ini berfungsi untuk mengubah tipe huruf yaitu menebalkan (bold), membuat tulisan
miring (italic) atau memberi garis bawah (underline). Buka lagi program Notepad kemudian
tuliskan seperti berikut ini:
<HTML>
<HEAD>
<TITLE>Tipe-tipe Teks</TILE>
</HEAD>
<BODY>
Ada tiga macam tipe tulisan yang paling sering digunakan dalam penulisan dokumen apa saja.
Ketiga tipe tersebut ialah tulisan tebal, tulisan miring dan tulisan bergaris bawah. Bisa pula dua
tipe huruf dipadukan misalnya tulisan tebal dan miring, tulisan tebal dan bergaris bawah atau
tulisan miring dan bergaris bawah. Bahkan bisa pula ketiga tipe tulisan tersebut sekaligus
bergabung menjadi satu berupa tulisan tebal, miring dan bergaris bawah.
2) HTML Image ( gambar )
Digunakan untuk menampilkan image atau animasi gif pada halaman web Anda. Atributnya
adalah : alt, align=(center, left, right), hspave, vspace, border, width & height.
Contoh :
<IMG SRC=”logo.gif” alt=”Ini adalah logo halaman pembuka” width=200 height=100>
<IMG SRC=”logo.gif” hspace=10 vspace=5 align=right border=2>
3) HTML Links :
Digunakan untuk membuat link ke halaman lain. Tulisan yang terletak antara <A> dan </A>
akan terdapat garis bawah.
Contoh :
<A HREF=”halaman2.html”>Klik di sini</A> Untuk membuat link ke halaman lain.
<A HREF=”mailto:[email protected]”>Klik di sini</A> Untuk membuat link pada
alamat e-mail.
26
<A HREF=”#aplikasi”>Klik di sini</A> Untuk membuat link ke bagian lain pada halaman yang
sama.
<A HREF=”halamanlain.html#aplikasi”>Klik di sini</A> Untuk membuat link kebagian lain
pada halaman yang berbeda.
<A HREF=”halaman2.html”><IMG SRC=”gambar.gif”></A> Untuk membuat link dengan
menggunakan gambar.
4) HTML List ( dasar urutan )
Terdapat tiga tipe list yang dapat digunakan, yaitu :
Unordered Lists <UL>
Untuk membuat daftar item dengan tanda bullet. List entries didefinisikan dengan tag <LI>.
Contoh :
<UL>
<LI> Item nomer 1
<LI> Item nomer 2
<LI> Item nomer 3
</UL>
Hasil dari kode di atas adalah:
Item nomer 1
Item nomer 2
Item nomer 3
Dengan atribut TYPE Anda dapat mendefinisikan bentuk disc, circle atau square bullet point.
Contoh : <UL COMPACT>
Ordered Lists: <OL>
Juga digunakan untuk membuat daftar item, dengan tiap item dapat menggunakan angka arab
atau romawi. List entries juga didefinisikan dengan <LI> tag.
Contoh :
27
<OL TYPE=I>
<LI> Item nomer 1
<LI> Item nomer 2
<LI> Item nomer 3
</OL>
Hasil dari kode di atas adalah :
Item nomer 1
Item nomerr 2
Item nomerr 3
Untuk TYPE Anda dapat juga menggunakan :
1- Default numbers, 1, 2, 3, etc.
A- Huruf besar. A, B, C, etc.
a- Huruf kecil. a, b, c, etc.
I- Romawi huruf besar. I, II, III, etc.
i- Romawi huruf kecil , i, ii, iii, etc.
Definition Lists: <DL>
Contoh :
<DL>
<DT> Item pertama.
<DD> Penjelasan tentang item pertama.
<DT> Item kedua.
<DD> Penjelasan tentang item kedua
</DL>
Hasil dari kode di atas adalah :
Item pertama.
28
Penjelasan tentang item pertama.
Item kedua.
Penjelasan tentang item kedua
5) HTML Table ( tabel )
Tabel sangat penting artinya dalam desain web. Karena dengan menggunakan tag table
Anda dapat membuat halaman web “terbagi” pada beberapa kolom atau baris. Contohnya seperti
pada halaman web yang sedang Anda baca ini.
Terdapat tiga tag atau elemen utama yang digunakan dalam pembuatan table :
<TABLE>, <TR>, dan <TD>. Yang perlu diingat adalah bahwa tab <TR> dan <TD> harus
terletak di antara tag <TABLE> dan </TABLE>
<TABLE> Terdiri dari atribut :
align - perataan : rata kiri (left), tengah (center) atau kanan (right).
bgcolor - warna latar belakang (background) dari tabel.
border - ukuran lebar border tabel (dalam pixel).
cellpadding - jarak antara isi cell dengan batas cell (dalam pixel).
cellspacing - jarak antar cell (dalam pixel).
width - ukuran tabel dalam pixel atau percent.
Contoh :
<TABLE align=”center” bgcolor=”#0000FF” border=”2″
cellpadding=”5″ cellspacing=”2″ width=”90%”>
<TR>
Tag ini digunakan untuk membuat baris baru (pada tabel). Terdiri dari atribut:
align - perataan : rata kiri (left), tengah (center) atau kanan (right).
bgcolor - warna latar belakang dari baris.
valign - perataan vertikal : top, middle atau bottom.
Contoh : <TR align=”right” bgcolor=”#0000FF” valign=top>
29
<TD>
Tag ini digunakan untuk membuat kolom baru pada tabel.
align - perataan
background - image yang digunakan sebagai latar belakang dari kolom.
bgcolor - warna latar belakang
colspan - lihat gambar contoh
height - ukuran tinggi cell dalam pixels.
nowrap - membuat supaya isi dari kolom tetap berada pada satu baris.
rowspan - lihat gambar contoh
valign - perataan vertikal :top, middle atau bottom.
width - ukuran kolom dalam pixel atau percen.
Contoh :
<TD align=”right” background=”back.gif” bgcolor=”#0000FF” colspan=”3″ height=”200″
nowrap rowspan=”2″ valign=”bottom” width=”300″
<table width=”100″ border=”1″ cellspacing=”2″
cellpadding=”2″>
<tr>
<td bgcolor=”#0000FF”> </td>
<td bgcolor=”#FFFF66″> </td>
<td rowspan=”2″ bgcolor=”#FF3366″> </td> </tr>
<tr> <td colspan=”2″ bgcolor=”#33CC66″> </td> </tr> <tr>
<td colspan=”3″ bgcolor=”#FFCC99″> </td>
</tr>
</table>
<table width=”100″ border=”0″ cellspacing=”0″
30
cellpadding=”0″>
<tr> <td bgcolor=”#0000FF”> </td>
<td bgcolor=”#FFFF66″> </td>
<td rowspan=”2″ bgcolor=”#FF3366″> </td>
</tr
A.
1<FRAMESET cols=”*,140″> <FRAME SRC=”homepage.htm”> <FRAME
SRC=”menu.htm”> </FRAMESET>
2<FRAMESET cols=”100,*”> <FRAME SRC=”homepage.htm”> <FRAME
SRC=”menu.htm”> </FRAMESET>
3<FRAMESET rows=”100,*”> <FRAME SRC=”homepage.htm”> <FRAME
SRC=”menu.htm”> </FRAMESET>
4<FRAMESET rows=”*,60″> <FRAME SRC=”homepage.htm”> <FRAME SRC=”menu.htm”>
</FRAMESET>
5<FRAMESET rows=”*,60″> <FRAME SRC=”homepage.htm”> <FRAMESET
cols=”50%,50%”> <FRAME SRC=”menu.htm” > <FRAME SRC=”menu2.htm” >
</FRAMESET></FRAMESET>
6<FRAMESET cols=”*,50%”> <FRAME SRC=”homepage.htm”> <FRAMESET
rows=”15%,15%,70%”> <FRAME SRC=”menu.htm” > <FRAME SRC=”menu2.htm” >
<FRAME SRC=”menu3.htm” > </FRAMESET></FRAMESET>
7<FRAMESET cols=”50%,50%”> <FRAMESET rows=”50%,50%”> <FRAME
SRC=”homepage.htm” > <FRAME SRC=”homepage2.htm” > </FRAMESET> <FRAMESET
rows=”50%,50%”> <FRAME SRC=”menu.htm” > <FRAME SRC=”menu2.htm” >
</FRAMESET></FRAMESET>
8<FRAMESET rows=”15%,70%,15%”> <FRAME SRC=”homepage.htm” > <FRAMESET
cols=”15%,70%,15%”> <FRAME SRC=”menu.htm”> <FRAME SRC=”menu2.htm”>
<FRAME SRC=”menu3.htm”> </FRAMESET> <FRAME SRC=”homepage.htm”>
</FRAMESET></FRAMESET>
31
6. HTML Frames
B.
c. Kumpulan Tag HTML
<!– –> Memberi komentar atau keterangan. Kalimat yang terletak pada tag kontiner ini tidak
akan terlihat pada browser
<a href> Membuat link ke halaman lain atau ke bagian lain dari halaman tersebut
<a name> Membuat nama bagian yang didefinisikan pada link pada halaman yang sama
<applet> Sebagai awal dari Java applets
<area> Mendefinisikan daerah yang dapat diklik (link) pada image map
<b> Membuat teks tebal
<basefont> Membuat atribut teks default seperti jenis, ukuran dan warna font
<bgsound> Memberi (suara latar) background sound pada halaman web
<big> Memperbesar ukuran teks sebesar satu point dari defaultnya
<blink> Membuat teks berkedip
<body> Tag awal untuk melakukan berbagai pengaturan terhadap text, warna link &
visited link
<br> Pindah baris
<caption> Membuat caption pada tabel
<center> Untuk perataan tengah terhadap teks atau gambar
<comment> Meletakkan komentar pada halaman web tidak tidak akan nampak pada browser
<dd> Indents teks
<div> Represents different sections of text.
<embed> Menambahkan sound or file avi ke halaman web
<fn> Seperti tag <a name>
<font> Mengganti jenis, ukuran, warna huruf yang akan digunakan utk teks
<form> Mendefinisikan input form
32
<frame> Mendefinisikan frame
<frameset> Mendefinisikan attribut halaman yang akan menggunakan frame
<h1> … <h6> Ukuran font
<head> Mendefinisikan head document.
<hr> Membuat garis horizontal
<html> Bararti dokumen html
<i> Membuat teks miring
<img> Image, imagemap atau an animation
<input> Mendefinisikan input field pada form
<li> Membuat bullet point atau baris baru pada list (berpasangan dengan tag <dir>, <menu>,
<ol> and <ul> )
<map> Mendefinisikan client-side map
<marquee> Membuat scrolling teks (teks berjalan) – hanya pada MS IE
<nobr> Mencegah ganti baris pada teks atau images
<noframes> Jika browser user tidak mendukung frame
<ol> Mendefinisikan awal dan akhir list
<p> Ganti paragraf
<pre> Membuat teks dengan ukuran huruf yg sama
d. Kode untuk karakter khusus
Simbol Karakter yg ditampilkan
" “
& &
< <
> >
ΠOE
33
œ oe
Š Š
š š
Ÿ Ÿ
ˆ ˆ
˜ ̃
 
 
 
‌
‍
‎
‏
– –
— —
‘ ‘
’ ’
‚ ‚
“ “
” ”
„ „
† †
‡ ‡
‰ ‰
‹ ‹
34
› ›
€ €
<html>
<head>
<title> Contoh script HTML </title>
</head>
<body>
<h2>Belajar Desain WEB dengan HTML</h2>
HTML adalah dasar pembuatan website,<br> dimana perintah – perintah HTML dapat diketik
<br> pada notepad (bila menggunakan S.O Windows) atau Vi(bila menggunakan Linux).
</body>
</html>
Simpan dengan nama Source1.htm dengan memilih type All files. Kemudian buka dengan
Browser dan lihat hasilnya.
35
BAB III
PENUTUP
A.Kesimpulan
Pada akhir makalah ini, penulis akan memberikan sedikit kesimpulan tentang isi
makalah. Keberadaan Internet atau lebih dikenal dengan istilah dunia maya pada saat sekarang
ini merupakan bukan hal yang asing lagi bagi setiap orang melainkan telah dikenal oleh seluruh
orang hmpir diseluruh penjuru dunia . Maka dari itu dalam pembuatan Website dituntut untuk
lebih maju lagi dan berkembang tentunya mengikuti perkembangan zaman. Para programmer
saling berusaha membuat sesuatu yang lebih baru lagi yang tentunya lebih uptudate dengan
merancangkan program – program yang lebih canggih, salah satunya dengan menggunakan
pemrograman HTML. Tentunya sebelum kita melangkah lebih maju lagi dalam pembuatan
website dalam menggunakan pemrograman tersebut kita harus mengerti terlebih dahulu apa itu
HTML, bagian – bagian utama dari HTML dan seluruh layout web dalam pemrograman HTML.
Berbagai macam bentuk layout pada pemrograman HTML dalam mendesain website
merupakan bagian – bagian yang harus diketahui, karena itu menentukan dari hasil rancangan
dalam pembuatan suatu pogram/ website. Apalagi dengan perkembangan Iptek sekarang ini lebih
menuntut untuk menghasilkan sesuatu program ataupun website yang lebih menarik lagi.
Sehingga para pengguna dunia maya lebih merasa tertarik dan tentunya tidak membuat bosan
dengan hasil/ bentuk website atupun program tersebut.
36
DAFTAR PUSTAKA
http://hans.polinpdg.ac.id/html/html_4/index.html
http://rizkyramadhansttg.wordpress.com/
http://agungpm.ashatec.com/2009/06/09/dasar-html/
http://www.bakawan.com/log/tag/html/