PERTEMUAN
1
I.
PENGENALANHTML
HTML atau HyperText Markup Language merupakan
bahasa pemrograman standar yang digunakan di lingkungan berbasis web. Adapun
yang bisa dilakukan oleh HTML adalah sebagai berikut:
● Mengontrol tampilan dari webpage dan contentnya.
● Mempublikasikan dokumen secara online sehingga
bias diakses seluruh dunia.
● Membuat online form
yang bisa digunakan untuk menangani pendaftaran, transaksi secara online.
● Menambahkan object-object
applet dalam dokumen HTML.
File HTML biasanya disimpan dengan ekstensi atau
akhiran HTML atau HTM saja. File ini sama untuk semua sistem operasi seperti
Windows, Linux, UNIX dan sebagainya.
Dalam membuat dokumen HTML murni, untuk sistem operasi
Windows kita bisa menuliskannya di program editor seperti Notepad, EditPlus, Adobe Dreamweaver CS6, dll. Namun sebagai dasar pembuatan script, kita gunakan
EditPlus.
II.
STRUKTUR HTML
Dalam penulisan dokumen HTML, dokumen
ini memuat elemen-elemen yang harus diawalitag pembuka dengan format <nama
tag>dan diakhiri tag penutup dengan format, </nama tag>. Ada 3 bagian utama dalam
pembuatan dokumen HTML, yaitu :
● HTML
Merupakan
elemen/tag dasar yang mendefinisikan bahwa dokumen ini dokumen HTML. Setiap dokumen HTML harus diawali dan ditutup
dengan tag HTML seperti berikut : <HTML>
</HTML>
Tag
HTML memberi tahu browser bahwa yang di dalam kedua tag tersebut adalah dokumen HTML.
● HEAD
Elemen
ini merupakan judul dari dokumen yang kita buat. Untuk memberikan judul pada
dokumen HTML yang kita buat, pada elemen <HEAD> harus diikuti elemen
<TITLE> karena jika elemen <HEAD> berdiri sendiri tidak akan
memberikan judul pada dokumen HTML yang kita buat.
● BODY
Elemen
atau Tag <BODY> digunakan untuk mengisi semua data yang akan ditampilkan
di halaman dokumen HTML yang kita buat. Jadi, apapun data yang ingin kita
tampilkan di halaman dokumen HTML yang kita buat, harus dituliskan di dalam tag
ini.
Sebagai
latihan, kita akan membuat dokumen HTML berikut ini menggunakan EditPlus, lalu
simpan dengan nama Coba.html atau Coba.htm.
Setelah
disimpan, kemudian buka dokumen HTML yang tadi dibuat pada web browser seperti
Internet Explorer, Mozilla Firefox, dll. Berikut hasil output yang akan
ditampilkan :
|
Judul pada dokumen HTML
|
|
Isi dari dokumen HTML
|
III. TAG-TAG
DASAR HTML
Tag
dasar berarti elemen dasar. Dokumen HTML secara mendasar akan
terdiri
atas teks informasi. Bentuk dari penulisan tag HTML adalah sebagai berikut :
<ELEMENT ATTRIBUTE=”VALUE”>
Ã
Element : Nama tag
Ã
ATTRIBUTE : Attribute dari Tag
Ã
Value : Nilai dari Attribute
<BODY BGCOLOR=”BLUE”>
BODY
merupakan element, BGCOLOR
merupakan attribute yang memiliki
nilai BLUE.
Adapun
tag dasar dari HTML adalah sebagai berikut :
Ã
HEADING
( JUDUL PARAGRAF )
Dalam
membuat sebuah paragraf yang mempunyai judul, heading disini sangat diperlukan
untuk pengaturan formatting judul paragraf. Adapun tag-tag yang diperlukan
untuk mengatur format judul yaitu dimulai dengan <H1>, <H2>,
<H3>, <H4>, <H5> dan <H6>. Adapun perbedaan yang
dimiliki tiap tag heading adalah ukurannya.
Sebagai
latihan, buatlah script di bawah ini lalu simpan dengan nama heading.html,
kemudian jalankan dengan web browser.
Berikut
hasil output yang akan ditampilkan :
Ã
BREAK
( PEMENGGALAN KALIMAT )
Dalam
menulis sebuah dokumen yang panjang diperlukan suatu pemenggalan kalimat atau
pindah baris sehingga dokumen yang dibuat menjadi lebih efisien. Begitu pula
dalam membuat dokumen HTML, diperlukan pemenggalan kalimat. Namun dalam dokumen
HTML digunakan tag <BR>. Tag ini ditulis di depan baris kata yang akan
dipindahkan. Pindah baris bukan berarti pindah paragraf. Dalam penggunaan tag
<BR>, tidak ada tag penutup yang mengikutinya.
Sebagai
latihan, buatlah dokumen HTML dengan nama Break.html.
Berikut
hasil output yang ditampilkan :
Ã
PARAGRAF
Dalam
membuat dokumen HTMl yang isinya berupa teks panjang tanpa ada pemisah antar
paragraf, mungkin akan merepotkan untuk membacanya. Jadi untuk memisahkan antar
paragraf diperlukan komponen paragraf.
Komponen
penulisan paragraf dalam HTML disingkat dengan <P>. Setiap paragraf yang
diberi tag <P> akan ditampilkan dengan loncat satu baris. Penulisan tag
<P> tidak harus diberi pasangan atau tag penutup </P>.
Dalam
membuat sebuah paragraf juga dibutuhkan perataan teks, terdapat 4 jenis
perataan yang biasa digunakan yaitu rata kiri <ALIGN=”LEFT>, rata kanan
<ALIGN=”RIGHT>, rata tengah <ALIGN=”CENTER”> dan rata kiri-kanan
<ALIGN=”JUSTIFY>. Untuk mengatur format perataan
teks
dalam HTML, digunakan tag <P> yang diikuti dengan ALIGN dan diakhiri
dengan </P>
Sebagai
latihan, buatlah dokumen HTML lalu simpan dengan nama Paragraf.html.
Berikut
hasil output yang ditampilkan :
Ã
GARIS
DATAR
Sebuah
garis dapat disisipkan dalam dokumen web, umumnya digunakan sebagai pemisah
antar bagian atau paragraf dan juga digunakan untuk memisahkan header dengan
isi dokumen. Tag ini mendefinisikan Horizontal Rule atau <HR>. Tag ini
tidak memerlukan tag penutup dan ditulis dimana akan diletakkan garis mendatar.
Sebagai
latihan, buatlah dokumen HTML lalu simpan dengan nama Gari.html
Berikut
hasil output yang ditampilkan :
0 Komentar