Pertemuan 03

1
PEMROGRAMAN WEB I
Agenda
Link
List
2
LINK HTML
Dokumen HTML menggunakan hyperlink
(anchor) untuk meng-hubungkan dokumen
ke dokumen dalam web.
Hyperlink biasa disebut dengan hypertext
link
3
Contoh
4
Tag Anchor
HTML menggunakan tag <a> untuk
membuat link
Sintak:

Jenis Link:
Link Relatif
Link Absolut
Link ke lokasi tertentu pd dokumen
<a Atribut> Teks Tampilan</a>
5
Atribut LINK
HREF Menentukan source dokumen
NAME Memberi alamat pada lokasi
tertentu pada sebuah halaman
TARGET Menentukan target tampilan
TITLE Menentukan judul link
onClick Menambahkan event klik
onMouseOver Event mouse di atas link
onMouseOut Event mouse saat
meninggalkan link
6
Link Relatif
Link dalam page ke page yang lain dalam
satu komputer
Contoh:
<a href=Jaring2.htm>Berikut</a>
<a href=jaringan/Jaring2.htm?#123>
Berikut</a>
<a href=../jaringan/Jaring2.htm?#123>
Berikut</a>
7
Link Absolut
Membuat link web page ke web site lain di
Internet.
Contoh:
<a href=http://www.microsoft.com> Microsoft</A>
Membuat link ke Misrosoft
<a href=http://www.dipanegara.ac.id> Dipanegara</A>
Membuat link ke web site STMIK Dipanegara
8
Link ke Bagian lain dalam
Dokumen
Link jenis ini dibuat apabila dokumen html
cukup panjang

<A HREF="#yang_baru">Yang Baru Hari Ini</A>
<A HREF=coba.html?#yang_baru">Yang Baru Hari Ini</A>
9
Link yang tidak
Tergarisbawahi
Link dapat ditampilkan teks yang tidak
digaris bawahi.
Contoh:
<a href="indent.html" target ="_blank"
Style="text-decoration:none">
Indentasi Paragraf</a>
10
Mailto
Membuat link pada suatu pesan mail
(tidak bisa bekerja jika mail client tidak
dipasang)
Contoh:
<a href=mailto:kom@gmail.com?
subject=Konsultasi> Kirim ke email ke
wyn@telkom.net</a>
11
LIST HTML
Bentuk umum untuk mengguraikan
suatu daftar
Bentuk-bentuk list
List dengan angka, abjad, Romawi
(ordered list)
List (unordered list)
Definition List

12
Ordered List
List dibuat dengan menggunkana angka
atau abjad atau huruf romawi
Type list ordered jika penomoran bukan
Type Arti
I Romawi Besar
i Romawi Kecil
A Abjad Huruf Besar
a Abjad Huruf Kecil
13
Type bila tidak disebutkan, list
berbentuk angka
Tag yang digunakan adalah <OL> dan
berpasangan dengan tag <LI> utuk List-
nya
Bentuk:
<OL [[Type=Tipe_list]/[START=angka]]>
<LI> Teks
..
<LI> Teks
</OL>
14
Contoh:
<HTML>
<BODY>
SERBA GRATIS DARI INTERNET
<OL TYPE="I"> 
<LI>Penyelenggara E-mail Gratis!
<OL Type="A" >
<LI>DALAM NEGERI : 
<OL>
<LI>Telkom 
<LI>BolehMail 
</OL>
15
<LI>LUAR NEGERI : 
<OL>
<LI>Yahoo 
<LI>Excite 
</OL>
</OL>

<LI>Penyelenggara Web Space Gratis!
</OL>
</BODY>
</HTML>

16
Hasil
17
Unordered List
List dibuat dengan menggunkana simbol
(bullet)
Type list unordered
Type Arti
Disc Bulatan Penuh
Circle Bulatan Kosong
Square Segi empat penuh
18
Tag yang digunakan adalah <UL>
berpasangan dengan tag <LI>
Bentuk:
<UL [Type=Tipe_list]>
<LI> Teks
..
<LI> Teks
</UL>
19
Contoh:
<HTML>
<BODY>
<UL>

<LI>Penyelenggara E-mail Gratis!
<UL>
<LI>DALAM NEGERI : 
<UL>
<LI>Telkom 
<LI>BolehMail 
</UL>
20
<LI>LUAR NEGERI : 
<UL>
<LI>Yahoo 
<LI>Excite 
</UL>
</UL>

<LI>Penyelenggara Web Space Gratis!
</ul>
<hr><center>
&copy '2006
</BODY>
</HTML>
21
Hasil
22
Tag <DIR>
Sama dengan tag <UL>
Contoh:
<HTML>
<HEAD>
<TITLE>DIR</TITLE>
</HEAD>
<BODY>
<DIR>

<LI>Penyelenggara E-mail Gratis!
<DIR>

23
<LI>DALAM NEGERI : 
<DIR>
<LI>Telkom 
<LI>BolehMail 
</DIR>
<LI>LUAR NEGERI : 
<DIR>
<LI>Yahoo 
<LI>Excite 
</DIR>
</DIR>

<LI>Penyelenggara Web Space Gratis!
</DIR>
<hr><center>
&copy '2006
</BODY>
</HTML>
24
25
Tag <LISTING>
Untuk membuat daftar urut tanpa
penomoran.
karakter spasi dihitung
Font yang standar kalau tidak disebutkan
26
Contoh
<HTML>
<HEAD><TITLE>LISTING</TITLE></HEAD>
<BODY>
<LISTING>
Browser Makers
<A HREF="http://www.microsoft.com">Microsoft</A>
W33
Netscape
Opera 
Service Providers
AOL
CompuServe
</LISTING>
</BODY>
27
28
Definition List
Untuk mendefinisikan indentasi biasa dan
gantung
Tag yang digunakan
Tag Kegunaan
<DL> Definition List
<DT> Definition Term
<DD> Definition Description
29
Contoh 1:
<HTML>
<BODY>
<DD>Bank yang tidak masuk dalam daftar likuidasi
tetap berjalan seperti biasa. Jika terdapat selebaran
palsu mengenai daftar Bank yang dikatakan bakal
dilikuidasi, masyarakat jangan percaya. Itu selebaran
palsu yang berisi omong kosong. Hanya 16 Bank yang
telah dilikuidasi.
<DD>Demikian penegasan gubernur Bank Indonesia
J. Soedradjad Djiwandono di gedung utama sekretariat
kabinet, di Jakarta, Senin (3/11), usai pengumuman
paket kebijaksanaan ekonomi 3 Nopember 1997.
</BODY>
30
Hasil:
31
Contoh 2:
<BODY>
<DL>
<DT>BAB I
<DD>Pendahuluan. Menjelaskan mengenai
Evolusi Cyberspace, Word Wide Web, Perancangan
HomePage serta Editor-editor Web yang dapat digunakan
untuk membuat HomePage.
<DT>BAB II
<DD>Dasar-Dasar Bahasa
HTML.menjelaskan mengenai mengapa kita
menggunAakan tag-tagbeserta atribut-atributnya serta
menjelaskan segala sesuatu tentang dasar-dasar HTML
yang harus diketahui sebelum membuat HomePage.
</DL></BODY>
32
Hasil:
33
Tugas1
Buat Web
Page dengan
bentuk
tampilan
sebagai
berikut:
34

Pertemuan 03

Diunggah oleh

Informasi Dokumen

Hak Cipta

Format Tersedia

Bagikan dokumen Ini

Bagikan atau Tanam Dokumen

Opsi Berbagi

Apakah menurut Anda dokumen ini bermanfaat?

Apakah konten ini tidak pantas?

Hak Cipta:

Format Tersedia

Pertemuan 03

Diunggah oleh

Hak Cipta:

Format Tersedia

1

Anda mungkin juga menyukai