Nama : Rizky Chandra
NPM : 56410168
Kelas : 2IA08
Tugas Softskill Pengantar Web Science Pertemuan I
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Untuk mempelajari HTML saat ini
tidaklah sulit karena sudah banyak program yang mampu menghasilkan dokumen
dalam format HTML, misalnya semua produk Microsoft office, MotMetal, HotDog,
HTMLLed dsb. Bahkan dengan hadirnya Microsoft Frontpage 2000 dan Frontpage XP
(experience) untuk membuat dokumen atau web page sudah sangat mudah sekali,
karena berbagai kebutuhan yang berhubungan dengan pembuatan web page sudah tersedia
seperti component, hyperlink dsb.
Penamaan Dokumen
File yang disimpan dalam format
HTML akan berekstensi HTM atau HTMl.
File yang berakhiran HTM atau HTML ini sama untuk berbagai jenis sistem operasi
seperti Linux, Unix, Windows dsb.
Elemen HTML
Dokumen HTML disusun oleh
elemen-elemen. “Elemen “ adalah merupakan istilah bagi komponen-komponen dasar
pembentuk dokumen HTML. Bebrapa contoh elemen adalah head, body , table,
paragraf , list. Elemen dapat berupa teks murni atau buakan teks atau keduanya.
Definisi
TAG
Untuk menandai berbagai elemen dalam
suatu dokumen HTML, kita menggunakan TAG.
Petunjuk
menggunakan TAG adalah :
' Tag HTML
diapit dengan dua karakter kurung bersusdut (angle bracket) < dan >
' Tag HTML
secara normal selalu berpasangan seperti <b>
dan </b>
' Tag
pertama dalam suatu pasangan adalah tag awal dan tag yang kedua merupakan tag
akhir
' Tag HTML
tidak case sensitive . <b> berarti sama dengan <B>
' Jika dalam
suatu tag ada tag lagi maka penulisan tag akhir tidak boleh bersilang
harus
berurut. Misalnya <b><I>Huruf
Tebal dan Miring</I><b>
Gunakan tag
dengan huruf kecil (lowercase)
Nama elemen
ditunjukkan dengan nama tagnya. Suatu elemen didalam dokumen HTML harus
ditandai dengan penulisan tagnya yang berpasangan. Ada beberapa elemen yang
tidak mengharuskan tagnya dituliskan secara berpasangan, elemen tersebut adalah
:
' paragraf
dengan tag <p>
' ganti
baris- line break dengan tag<br>
' garis
datar- horizontal rule dengan tag <hr>
' list item
dengan tag <li>
Secara umum
suatu elemen dalam dokumen HTML yang dinyatakan dengan tagnya, dituliskan :
<namatag> ……..
</namatag>
Elemen HTML
yang dibutuhkan
Elemen yang dibutuhkan untuk membuat
suatu dokumenHTML dinyatakan dengan tag <html>, <head>, dan
<body> berikut tag-tag pasangannya.
Setiap
dokumen terdiri atas tag head dan body. Elemen head berisi informasi tentang
dokumen tersebut, dan elemen body berisi teks yang sebenarnya tersusun dari
link, grafik, paragraf dan elemen lainnya.
Secara umum
dokumen web dibagi menjadi dua bagian yaitu
head dan body. Sehingga setiap dokumen html harus mempunyai pola dasar
sebagai berikut :
<html>
<head>
……informasi tentang
dokumen HTML
</head>
<body>
……informasi yang
ditampilakn dalam browser web
</body>
</html>
setiap dokumen
html harus diawali dengan menuliskan tag <html> dan
tag</html> diakhir dokumen. Tag ini menandai bahwa dokumen ini adalah
dokumen HTML. Dalam satu dokumen hanya ada satu elemen html.
Elemen head
ditandai dengan tag <head> dan diakhiri dengan tag </head>. Bagian
ini berisi informasi tentang dokumen HTMLnya. Minimal informasi yang dituliskan
dalam elemen ini adalah judul dari dokumen, judul ini akan ditampailkan pada
caption bar dari window browser, ditandai dengan menggunakan tag <title>
dan diakhiri dengan </title>.
Elemen body
ditandai dengan tag <body> dan diakhiri </body>. Bagian ini
merupakan elemen terbesar di dalam dokumen html. Elemen ini berisi isi dokumen
yang akan ditampilkan pada browser, meliputi paragraf, grafik, link, tabel dsb.
Persyaratan
system
¨ Sebuah komputer yang siap
web. Komputer dengan windows 95/98/NT, Mac atau
Unix
¨ Editor teks, notepad atau
lainnya
¨ koneksi ke server web(kalau
mungkin koneksi ke internet)
¨ Browser web,
direkomendasikan Internet Explorer atau Netscape navigator.
Tag-Tag
Dasar HTML
Tag dasar berarti elemen dasar.
Dokumen HTML secara mendasar akan terdiri atas teks informasi.
HTML
Merupakan tag dasar yang
mendefinisikan bahwa dokumen ini adalah dokumen HTML. Tag ini merupakan satu
keharusan bagi pemrogram web untuk menuliskannya sebagai tag pertama dalam
dokumen HTML.
<html>
di awal dokumen dan </html> di akhir dokumen.
Head
Merupakan tag berikutnya setelah
<html> untuk menuliskan keterangan tentang dokumen web yang akan
ditampilkan
<head>
di awal setelah <html>, dan </head> di akhir section head
Title
Merupakan
tag di dalam head yang harus dituliskan untuk memberikan judul/ informasi pada
caption browser web tentang topik atau judul dari dokumen web yang ditampilkan
dalam browser.
<title>
judul dokumen</title>
Body
Merupakan
section utama dalam dokumen web. Pada section ini semua isi dokumen yang akan ditampilkan di dalam browser harus
dituliskan.
<body>
di awal, segera setelah tag </head>
</body>
di akhir, diletakkan sebelum tag </html>
Paragraf
Informasi
yang disajikan dalam dokumen harus mengikuti kaidah kaidah dalam penulisan.
Misalnya satu pikiran utama disimpan dalam satu paragraf.
Setiap
paragraf harus dimulai dengan memberi tag <p>. diakhir paragraf tidak
diharuskan menuliskan </p> sebagai akhir paragraf. Setiap pergantian
paragraf harus dimulai dengan <p> kembali.
Contoh Pembuatan HTML
Ikuti seperti gambar berikut, maka hasil akan seperti pada gambar ke-2 saat dijalankan di browser :
Line Break
Kita
dapat memaksakan ganti baris pada dokumen web. Ganti baris disini dimaksudkan
hanya menyajikan informasi pada baris sendiri tetapi tidak berganti paragraf.
Untuk menampilkan suatu teks ditampilkan pada baris yang baru dalam suatu
paragraf, maka harus digunakan tag <br> sebelum teks yang dimaksud
dituliskan.
Contoh Line Break
Ikuti seperti gambar berikut, maka hasil akan seperti pada gambar ke-2 saat dijalankan di browser :
Heading
Teks
dalam dokumen umumnya mempunyai judul topik, pada dokumen HTML judul ini
disebut heading. Heading tulisan akan ditampilkan dengan huruf yang lebih besar
atau ditebalkan. Heading juga dimanfaatkan untuk menunjukkan tingkat
keberartian dari teks yang dituliskan. Ada 6 tingkat heading dalam HTML,
dinomori dari satu sampai dengan nomor 6. Nomor 1 merupakan heading terbesar.
Setiap heading dalam dokumen harus diberi tag, tergantung pada kebutuhan teks
tersebut, jika dianggap sebagai heading1-digunakan tag <h1>
Contoh Heading
Sintaks
elemen heading
<hy>
Teks yang menjadi heading </hy>, dimana y adalah nomor heading
Mengatur letak Heading
Tag heading mempunyai atribut yang
digunakan untuk mengatur letak heading dalam baris –align. Aligment heading
M kiri-left
M tengah
–center
M
kanan-right
Contoh mengatur letak heading
Maka hasil yang dapat dilihat di browser seperti gambar dibawah ini :
Jika atribut align tidak
diisi maka heading secara default akan ditampilkan rata sebelah kiri.
Penggaris Mendatar
Sebuah garis dapat dsisipkan dalam
dokumen web, umumnya digunakan sebagai pemisah antar bagian atau paragraf.
Tag<hr>disisipkan pada tempat
garis akan disisipkan dokumen.
Contoh penggaris mendatar
Maka hasil yang keluar pada browser anda seperti gambar berikut :
Garis yang
disisipkan dapat dalam bentuk penggaris karena lebar garis dapat diatur, ukuran
garis dapat dalam bentuk point atau dalam bentuk relatif dalam window browser.
Komentar
Dalam suatu dokumen informasi ada
sebagian teks dalam dokumen yang berfungsi sebagai catatan atau komentar
terhadap program itu sendiri. Catatan/komentar dalam dokumen tidak ditampilkan
dalam browser.
Komentar disisipkan pada section
body, diletakkan pada bagian-bagian teks dokumen yang memang perlu dikomentari.
Tag
komentar dapat digunakan untuk menyembunyikan sebagian dokumen web. Teks yang
berfungsi sebagai komentar disimpan dalam dokumen ditandai dengan tag
<!—sebagai awal, kemudian teks yang dikomentari, dan tag à sebagai
akhir tag.
Khusus
untuk tag komentar ini, tag penutup tidak menggunakan tanda garis miring
sebelumnya.
