You are on page 1of 11

1

PERTEMUAN IV
GAMBAR DAN LINK
I. GAMBAR

Yang harus diketahui sebelum menambahkan gambar dalam dokumen HTML adalah :
File gambar lambat untuk di download.
Beberapa search engine seperti Alta Vista dan Excite tidak bisa menampilkan file gambar
Tidak ada browser grafik/gambar
Gambar tidak selalu dikenal secara international
Warna gambar mungkin tidak ditampilkan seperti aslinya

A. Format gambar
Saat ini sebagian masyarakat WEB menjadikan format GIF dan JPEG sebagai format standar
untuk menampilkan gambar dalam WEB.
B. WARNA
GIF ( Graphic Interchange Format ) : menghasilkan gambar sampai dengan 256 warna. Warna
sejumlah ini baik untuk membuat gambar logo, icon, garis seni dan gambar-gambar lain yang
sederhana tetapi tidak cukup baik untuk menyimpan gambar fotografik.
JPEG ( Joint Photographic Expert Group ) : menghasilkan 16,7 juta warna. Dengan warna
sebanyak ini, JPEG sangat efektif untuk menyimpan gambar-gambar dengan kualitas foto.
C. Pemadatan Ukuran Gambar
GIF memadatkan datanya dengan menggunakan metode lossless compression. Metode
lossless compression bekerja dengan mencari pola-pola berulang dalam suatu gambar.
Lossless compression pada GIF membuang informasi dalam jumlah yang sedikit, yaitu hanya
warna-warni dengan pola yang sama. Jika file GIF ditampilkan, waktu yang digunakan tidak
lama, karena file hasil pemadatan dengan file yang diuraikan merupakan dua buah file yang
hampir sama. Gambar file PNG juga menggunakan lossless compression, sehingga bisa
menjadi alternatif pengganti file GIF.
JPEG menggunakan metode pemadatan lossy compression. Pemadatan gambar metode
lossy compression, membuang sejumlah bit-bit gambar untuk membuat gambar berukuran
kecil. Tingkat pembuangan informasi gambar ini biasanya dapat ditentukan oleh pemakai
sewaktu membuat file JPEG.
D. Menampilkan inline dan external image
Cara menampilkan gambar dalam web, ada dua cara, yaitu internal dan eksternal.
Internal Image : gambar ditampilkan secara langsung saat web page dimuat dalam browser
yang berbasiskan grafik.
External Image : gambar yang tidak ditampilkan secara otomatis ketika suatu page dimuat,
tetapi hanya akan dimuat jika pemakai menginginkan.
Menempatkan gambar pada dokumen HTML sngat mudah, dengan menggunakan tag <IMG> beserta
atribut SRC. Kemudian tempatkan nama file dengan URL untuk menampilkan gambar. Penggunaan
<IMG> secara umum adalah : < IMG SRC=nama file>
Contoh :
<html>
<head>
<title> Penggunaan Tag IMG</title>
</head>
<body bgcolor=lightgrey>
<h3 align=center>Penggunaan tag IMG</h3>
<p>
<img src="STIK-trs.gif">
Teks ditampilkan setelah gambar.
</p>
<p>
Teks ini terpotong dengan
<img src="STIK-trs.gif">
gambar logo.
</p>
<p>
Gambar tampil inline setelah teks ini
<img src="STK-trs.gif">
</p>
</body>
</html>

E. Mengatur Perataan teks dengan Inline Image


Secara default, ketika image inline dengan teks, teks ditampilkan rata bawah dengan gambar.
Pengaturan perataan ini menggunakan atribut ALIGN dalam tag <IMG>.
TOP : Meratakan teks dengan bagian atas gambar
MIDDLE : Meratakan gambar dengan bagian tengah gambar
BOTTOM : Meratakan teks dengan bagian bawah gambar
Contoh :
<html>
<head>
<title> Penggunaan Align PadaTag IMG</title>
</head>
<body bgcolor=lightgrey>
<h3 align=center>Perataan Teks dalam tag IMG</h3>
<p>
<img src="STIK-trs.gif" align=top>
Teks ini rata dengan bagian atas gambar.
</p>
<p>
<img src="STIK-trs.gif" align=middle>
Teks ini rata dengan bagian tengah gambar
</p>
<p>
<img src="STK-trs.gif" align=bottom>
Teks ini rata dengan bagian bawah gambar.
</p>
</body>
</html>

F. Mengatur Posisi Gambar Pada halaman WEB


Gambar bisa diatur untuk berada di kiri atau di kanan halaman WEB. Penggunaan atribut
ALIGN beserta nilainya dalam tag <IMG> untuk mengatur tampilan teks disekitar gambar.
LEFT : Meletakan gambar di sebelah kiri teks. Teks wrap di sekitar gambar
RIGHT : Meletakan gambar di sebelah kanan teks. Teks wrap di sekitar gambar.
Contoh :
<html>
<head>
<title> Tag IMG dan atribut ALIGN</title>
</head>
<body bgcolor=lightgrey>
<h2 align=center>Penggunaan Perataan Teks </h2>
<p>
<img src="STIK-trs.gif" align=left>
<font size=5>Gambar rata kiri</font size>
Dalam buku ini akan dipelajari cara membuat halaman WEB. World Wide Web (WEB)
adalah suatu kumpulan informasi pada beberapa server komputer yangterhubung
satu sama lain dalam jaringan Internet.
Buku ini berisi cara pengatur paragraf dokumen, membuat tabel, membuat frame
juga tidak ketinggalan cara membuat form.
Demikian diharapkan para pembaca nantinya mampu membuat web site sendiri.....
</p>
<p>
<img src="STK-trs.gif" align=right>
<font size=5>Gambar rata kanan</font size>
Dalam buku ini akan dipelajari cara membuat halaman WEB. World Wide Web (WEB)
adalah suatu kumpulan informasi pada beberapa server komputer yang terhubung
satu sama lain dalam jaringan Internet.
Buku ini berisi cara pengatur paragraf dokumen, membuat tabel, membuat frame
juga tidak ketinggalan cara membuat form.
Demikian diharapkan para pembaca nantinya mampu membuat web site sendiri.....
</p>
</body>
</html>

G. Mengatur Ukuran Gambar Pada Browser


Ada dua keuntungan dengan mengatur ukuran gambar pada browser, yaitu :
Pengaturan ukuran membantu pengguna yang tidak bisa menampilkan gambar secara inline.
Pengaturan ukuran membuat halaman web lebih cepat ditampilkan.
Pengaturan ukuran tinggi dan lebar pada tag <IMG> dilakukan oleh atribut HEIGHT dan WIDTH.
Kedua atribut ini mengatur ukuran gambar dengan ukuran pixel.
Contoh :
<html>
<head>
<title> Menggunakan HEIGHT dan WIDTH</title>
</head>
<body bgcolor=lightgrey>
<h3>Mengatur Ukuran Tinggi dan Lebar Gambar </h3>
<font size=4>Gambar Ukuran Asli</font size><br>
<IMG SRC="d:\S T A F F\STIK-trs.gif"><br>
<font size=4>Gambar Ukuran lebar=180px Tinggi 140px</font size><br>
<IMG SRC="d:\S T A F F\STIK-trs.gif" WIDTH=180 HEIGHT=140>
</body>
</html>

H. Menambahkan Teks Keterangan


Anda dapat menambahkan keterangan tambahan pada gambar yang ditampilkan secara
inline. jika petunjuk mouse diletakan di atas gambar, maka teks keterangan akan ditampilkan.
Gunakan atribut ALT dalam tag <IMG>. Pemakaian secara umum :
<IMG SRC=nama file gambar ALT=keterangan>
Contoh :
<html>
<head>
<title> Menggunakan atribut ALT </title>
</head>
<body bgcolor=lightgrey>
<h3>Penggunaan atribut ALT </h3>
<IMG SRC="d:\S T A F F\STIK-trs.gif" WIDTH=280 HEIGHT=240 ALT="Cover
Buku Panduan HTML 4.01">
</body>
</html>

I. Memberi Border Pada Gambar


Gambar yang ditampilkan oleh browser tanpa border. Atribut BORDER memberikan suatu
border atau batas pada suatu inline gambar. Inline gambar tidak mempunyai border kecuali berfungsi
sebagai link. Nilai untuk BORDER menggunakan satuan pixel.
Contoh :
<html>
<head>
<title> Penggunaan Atribut BORDER</title>
</head>
<body bgcolor=lightgrey>
<h3>Penggunaan BORDER untuk gambar </h3>
<A HREF=""><IMG SRC="d:\S T A F F\STIK-trs.gif"
BORDER=0></A><br><br>
<A HREF=""><IMG SRC="d:\S T A F F\STIK-trs.gif"
BORDER=5></A><br><br>
<A HREF=""><IMG SRC="d:\S T A F F\STIK-trs.gif"
BORDER=10></A><br>
</body>
</html>

WIDTH=100

HEIGHT=100

WIDTH=100

HEIGHT=100

WIDTH=100

HEIGHT=100

J. Memberi Ruang Pada Gambar


Atribut HSPACE dan VSPACE digunakan untuk menentukan jarak spasi antara gambar
dengan objek di sekitarnya. Atribut HSPACE menentukan spasi horisontal ( bagian kanan dan kiri )
suatu gambar, sedangkan atribut VSPACE menentukan spasi vertikal ( bagian atas dan bawah )
gambar. Spasi ini dinyatakan dalam bentuk pixel dan akan memberi spasi kosong di sekitar gambar.
Contoh :
<html>
<head>
<title>Atribut VSPACE dan HSPACE</title>
</head>
<body bgcolor=lightgrey>
<h3>Menggunakan atribut VSPACE dan HSPACE</h3>
<IMG SRC="d:\S T A F F\STIK-trs.gif" WIDTH=100 HEIGHT=100 VSPACE=20
ALIGN=LEFT><FONT SIZE=4>Teks Wrap disekitar Gambar </FONT SIZE><br>

HSPACE=20

Dalam buku ini akan dipelajari cara membuat halaman web. World Wide Web (WEB) adalah
suatu kumpulan informasi pada beberapa server komputer yang terhubung satu sama lain
dalam jaringan Internet.
Buku ini berisi cara pengatur paragraf dokumen, membuat tabel, membuat frame juga
tidak ketinggalan cara membuat form.
Demikian diharapkan para pembaca nantinya mampu membuat web site sendiri....
</body> </html>

K. Link Dengan Gambar


Suatu gambar dapat berfungsi secara bersama-sama dengan tag <A>. jika gambar di klik
maka link akan menuju ke informasi yang diberikan pada tag <A>. Gambar yang dijadikan Link
muncul dengan dikelilingi kotak. Hal ini untuk membedakan dengan gambar biasa. Anda juga bisa
menggabungkan gambar sebagai link dan teks sebagai link. Dengan demikian, ada dua pilihan link ke
suatu dokumen.
Contoh :
<html>
<head>
<title>Gambar sebagai link</title>
</head>
<body bgcolor=lightgrey>
<h3>Gambar sebagai link</h3>
<UL>
<LI><IMG SRC="d:\S T A F F\STIK-trs.gif" WIDTH=100 HEIGHT=100 VSPACE=20
HSPACE=20 ALIGN=middle>Ini gambar biasa<br>
<LI><A HREF="d:\S T A F F\doc.html"> <IMG SRC="d:\S T A F F\STIK-trs.gif"
WIDTH=100 HEIGHT=100 ALIGN=middle></A> Gambar berfungsi sebagai link<BR><BR>
<LI><A HREF="d:\S T A F F\doc.html"> <IMG SRC="d:\S T A F F\STIK-trs.gif"
WIDTH=100 HEIGHT=100 ALIGN=middle> Link ke beruang</A><BR>
</UL>
</body>
</html>

II. LINK
Link dapat menuju ke Web Page, grafik, suara, film, program, isi dari server Gopher, log-in ke
suatu remote computer, server e-mail atau ke suatu ftp.
A. Hypertext dan Hypermedia
Dokumen Hypertext adalah dokumen yang berisi link ke dokumen lain. Dokumen Hypermedia
adalah dokumen yang berdasarkan hypertext ditambah dengan multimedia seperti gambar, video dan
audio.
B. Uniform Resource Locator
WWW menggunakan URL untuk menuju ke lokasi dari suatu informasi pada server lain.
Pemakaian umum URL adalah Protokol://domain_host{:port}/path/nama_file.
Dimana protokol adalah salah satu dari :
http = untuk suatu file pada server WWW
file = untuk suatu file pada sistem komputer lokal
gopher = untuk file pada server gopher
WAIS = untuk suatu file pada server WAIS
telnet = untuk suatu link ke server berbasis telnet
news = untuk suatu newsgroup usenet
ftp = untuk suatu file pada server ftp
Host adalah suatu alamat server. Contoh : www.yahoo.com , www.microsoft.com
Port memberitahu browser untuk membuka koneksi pada suatu port jaringan yang berbeda dari port
default untuk setiap protokol.
Path adalah suatu lokasi dari informasi yang dicari di dalam server, sedang nama file adalah nama
dari file yang diinginkan. Contoh : www.rekreasi.com/lokasi .html
C. Absolute Path dan Relative Path
Dalam HTML terdapat dua jenis path, yaitu path absolute dan path relative. Path relative jika
lokasi file tersebut relatif terhadap dokumen yang sedang aktif, yaitu terletak di atas atau di bawah
direktori dokumen tersebut. Jika suatu file berada di bawah direktori yang sedang aktif, maka direktori
file tersebut perlu disebutkan. Misalnya file hal12.html berada di bawah direktori Bab1 maka untuk
membuat link ke file hal12.html adalah :
<A HREF=Bab1/hal12.html> Link ke halaman 12</A>
Jika ingin membuat suatu link ke direktori di atas direktori aktif saat ini, gunakan :
<A HREF=/link.html> Link ke file di atas direktori saat ini </A>
Tanda .. dalam path menunjukan direktori di atas direktori aktif saat ini.
D. Link Ke Bagian Lain dalam Satu Dokumen
Secara default link digunakan untuk mendapatkan informasi dokumen Web. Pada contoh
program dibawah ini, dokumen HTML mempunyai dua link, satu merupakn anchor tujuan yaitu
Bab2.html dan yang satunya anchor gambar GIF, yaitu Sunset.gif.
<html>
<head>
<title>LINK dan ANCHOR</title>
</head>
<body bgcolor=lightgrey>
<h3>Penggunaan Link dan anchor</h3>
Berikut adalah penggunaan Link dan Anchor untuk memanggil dokumen web
lain
<P>Lihat tanda Link<A HREF="Bab2.html">Bab 2</A>
Untuk melihat yang detail <A HREF="../images/hutan.gif"> Gambar Hutan</A>
</body>
</html>

E. Atribut Name dan ID


Atribut href untuk menyatakan suatu file tujuan. Server mencari kedalam direktori di mana
dokumen saat ini berada untuk mencari file tersebut. File dokumen tujuan HTML yang menggunakan
elemen A bisa diikuti atribut name atau id. Untuk membuat link yang membaca pembaca ke suatu
bagian tertentu dalam dokumen, cukup sertakan tanda # setelah nama bagian.
Contoh program dibawah ini untuk membuat tabel yang berisi link pada elemen header H2, H3 dan
lainnya dalam satu dokumen, dengan menggunakan elemen A dan atribut name dan ID :
<html>
<head>
<title>Element A ( atribut name dan id )</title>
</head>
<body bgcolor=lightgrey>
<h1>Daftar Isi</h1>
<P><h2><A HREF="#section1">Pengenalan</A><br>
<A HREF="#section2"> Latar Belakang</A> <br>
<A HREF="#section2.1"> Catatan</A> </h2><br>
Jika anda klik salah satu link dokumen di atas, maka isi dokumen yang berada di
bawah (tidak tertampung oleh jendela browser) akan ditampilkan. Hal ini akan sangat
membantu pembuatan dokumen yang sangat panjang. Misalnya FAQ (Frequently Ask
Question), anda bisa klik pertanyaan yang ada, kemudian dokumen akan link ke
dokumen pertanyaan, yang sebenarnya berada pada satu dokumen. <br>
Dan untuk kembali ke daftar pertanyaan, klik toolbar Back yang berada pada menu
Standard, atau jika sudah dibuat link ke daftar pertanyaan tinggal klik kembali
saja.
<h2><A name="section1">Pengenalan</A></h2>
...section 1...
<h2><A name="sectio2">Latar Belakang</A></h2>
...section 2...
<h2><A name="section2.1">Catatan</A></h2>
...section 2.1...
</body>
</html>

Jika anda klik salah satu daftar isi di atas misalnya Pengenalan atau Latar belakang atau
Catatan, maka dokumen akan link pada isi dari daftar tersebt yang sebenarnya berada di
bagian bawah dokumen. Hal ini dikarenakan jendela browser tidak mampu menampung
seluruh isi dokumen.
F. Judul LINK
Atribut title bisa digunakan dalam elemen A dan LINK untuk menambah informasi tentang link.
Informasi ini akan ditampilkan berupa tooltip oleh browser.
Contoh :
<html>
<head>
<title>Atribut title</title>
</head>
<body bgcolor=lightgrey>
<h3>Menampilkan title sebagai tool tip</h3>
<body>
............<br>
............<br>

8
<P>Anda akan melihat lebih jauh ke dalam<A HREF="Bab2.html" title="Bab 2">Bab 2</A>
<A HREF="./Bab2.html1" title="Isi Bab 2.">Bab 2</A>
Lihat juga gambar <A HREF="d:\S T A F F\STIK-trs.gif" title="GIF Image logo STIK"
WIDTH=180 HEIGTH=180>Gambar Logo STMIK JAKARTA STI&K</A>
</body>
</html>

G. Elemen <A>
Untuk membuat suatu link dalam HTML elemen dipergunakan elemen anchor yang dinyatakan
dengan tag berpasangan <A></A>. Atribut yang boleh menyertai elemen A adalah :
Name
: Menyatakan titik anchor dalam suatu dokumen HTML.
Href
: Menunjukan lokasi dokumen Web.
Hreflang : Menunjukan bahasa yang dipergunaka, hanya digunakan bersama dengan href.
Type
: Atribut ini memberi catatan tipe isi dari dokumen tujuan.
Rel
: Menggambarkan hubungan dari dokumen asal dengan dokumen tujuan yang ditunjuk
dengan atribut href.
Rev
: menggambarkan hubungan antara dokumen tujuan yang ditunjuk oleh atribut href dengan
dokumen asal.
Charset : Untuk menspesifikasikan karakter encoding dokumen web.
H. Sintaks nama Anchor
Anchor mempunyai nila atribut name dan id. Nama anchor harus mengikuti beberapa aturan
sebagai berikut :
Unik, nama anchor harus unik dalam dokumen. Dalam satu dokumen tidak boleh ada nama
anchor yang sama.
String # , penggunaan string # untuk menuju ke bagian lain dalam dokumen.
I. Dokumen Yang Tidak Ditemukan Browser
Jika suatu dokumen yang link tidak ditemukan oleh browser, ada beberapa keterangan :
Jika browser tidak menemukan lokasi yang di link, browser akan memberi keterangan.
Jika browser tidak bisa mendefinisikan tipe dokumen yang di link, browser akan terus
mencobanya dan akan memberi peringatan.
J. Elemen <LINK>
Elemen ini untuk mendefinisikan suatu hubungan (link). LINK boleh ditampilkan dalam elemen
<HEAD> dan ditampilkan berulang kali. LINK mempunyai tugas untuk menyampaikan informasi
hubungan antar dokumen /bagian, misalnya toolbar dengan menu drop-down.
Berikut adalah contoh potongan program yang menggambarkan beberapa LINK yang berada
pada elemen <HEAD>. Dokumen yang aktif adalah Bab2.html. Atribut rel menunjukan hubungan
antara dokumen yang aktif dengan dokumen yang ituju. Nilai Index, Next, Prev menjelaskan
tujuan dokumen berikutnya.
<!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01//EN
http://www.w3.org/TR/html4/strict.dtd>
<HTML>
<HEAD>
<TITLE>Bab 2</TITLE>
<LINK rel=Index href=../index.html>
<LINK rel=Next href=Bab3.html>
<LINK rel=Prev href=Bab1.html>
</HEAD>
isi dokumen selanjutnya

K. Link Tujuan Dan Kembali


Atribut rel dan rev digunakan untuk saling melengkapi. Atribut rel digunakan untuk link ke
dokumen tujuan sedangkan atribut rev digunakan untuk link kembali ke dokumen sebelumnya.
Contoh :
Dokumen A : <LINK href=docB rel=foo>
Mempunyai arti yang sama dengan
Dokumen B:

<LINK href=docA rev=foo>

Kedua atribut boleh digunakan secara bersamaan. Atribut rev menunjukan link kembali dari atribut rel.
ini menunjukan bahwa halaman sebelumnya adalah halaman superior. Atribut rel dan rev mempunyai
beberapa nilai yang mengindikasikan dokumen sebagai :
Parent : Dokumen utama (parent)
Index
: Dokumen indeks
Next
: Halaman selanjutnya
Contents : Isi dokumen
Alternate : Versi alternatif
Begin
: Awal halaman
Nilai alternate menunjukan dokumen referensi dari alternatif versi halaman yang aktif. Alternatif versi
ini bisa untuk versi cetak atau alternatif bahasa (tambahan atribut lang).
<LINK REL=alternate HREF=FrenchDoc.html LANG=fr TITLE=Paris>

L. Link Dan External Style Sheet


Jika elemen LINK dihubungkan dengan external style sheet sebuah dokumen, atribut type
menunjukan style sheet bahasa dan atribut media menunjukan tampilan media. Sebagai contoh nilai
MEDIA=screen menentukan style sheet akan dihubungkan dengan layar video, MEDIA=print
menunjukan versi cetak.
M. Link Dan Search Engine
Elemen LINK digunakan untuk menyediakan keanekaragaman informasi dari serch engine,
termasuk :
Link untuk alternatif versi bahasa dokumen, ditulis dengan bahasa selain bahasa inggris.
Link untuk alternatif versi dokumen, mendesain media yang berbeda seperti versi yang cocok
untuk pencetakan
Link untuk awal halaman dari sekelompok dokumen
Contoh program dibawah ini untuk menggambarkan informasi bahasa, tipe media, tipe link yang
dikombinasikan untuk memperbaiki penanganan dokumen oleh search engine. Penggunaan atribut
hreflang untuk menemukan versi bahasa yang digunakan dalam dokumen, misalnya bahasa belanda,
Portugis dan Arab. Atribut charset digunakan sebagai encoding dalam bahasa Arab. Atribut lang untuk
menunjukan nilai atribut title untuk elemen LINk yang didesain dalam bahasa Perancis.
<head>
<title>Manual dalam Bahasa English</title>
</head>
<LINk title="Link : Manual dalam Bahasa Belanda Dutch"
type="text/html"
rel="alternate"
hreflang="nl"
href="http://someplace.com/manual/dutch.html">
<LINk title="Link : Manual dalam Bahasa Portugis"
type="text/html"
rel="alternate"
hreflang="pt"
href="http://someplace.com/manual/portuguese.html">
<LINk title="Link : Manual dalam Bahasa Arab"
type="text/html"
rel="alternate"
charset="ISO-8859-6"
hreflang="ar"
href="http://someplace.com/manual/arabic.html"
<LINk lang="fr" title="La documentation en Fran&ccedil;ais"
type="text/html"
rel="alternate"
hreflang="fr"
href="http://someplace.com/manual/french.html"
</HEAD>

10

Contoh berikutnya,menyuruh search engine untuk menemukan versi cetak secara manual.
<head>
<title>Referensi Manual</title>
<LINk media="print" title="Cetak manual dengan postcript"
type="application/postcript"
rel="alternate"
href="http://someplace.com/manual/postcript.ps">
</HEAD>

Contoh program berikutnya, menuruh search engine untuk menemukan halaman depan dari
sekelompok dokumen :
<head>
<title>Referensi Manual-halaman 5</title>
<LINk rel="Start" title="Halaman pertama dari buku manual"
type="text/html"
href="http://someplace.com/manual/start.html">
</HEAD>

N. Informasi Path Dengan Elemen Base


Dalam HTML, link dan referensi untuk external gambar, applet, proses from, style sheet dan
lainnya selalu dispesifikasikan dengan URL. Elemen BASE mengijinkan programmer untuk
menspesifikasikan dokumen dasar URL secara nyata. Elemen BASE boleh digunakan tanpa tag
penutup. Jadi boleh hanya tag <BASE>. Atribut yang boleh menyertai adalah href, untuk menunjukan
absolute URL dapat diubah menjadi relative URL. Elemen BASE muncul dibagian HEAD. Informasi
path ditunjukan oleh elemen BASE hanya untuk URL di elemen tersebut muncul.
Contoh potongan program :
<!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01//EN
http://www.w3.org/TR/html4/strict.dtd>
<html>
<head>
<title>Produk Kami</title>
<base href=http://www.maju_jaya.com/products/intro.html>
</head>
<body>
<p>Sudahkah anda melihat<A href=../sangkar/burung.gif>Sangkar Burung</A>?
</body>
</html>
Relative URL : ..sangkar/burung.gif akan menghasilkan :
http://www.maju_jaya.com/sangkar/burung.gif

O. Membuat Link Ke E-mail


Link ke email menggunakan mailto: untuk menspesifikasikan alamat.
Contoh potongan program :
<A HREF=mailto:endang2001@hotmail.com>Kirimi saya

e-mail</A>

URL mailto : menyebabkan browser menampilkan suatu kotak pesan dimana pembaca dapat
mengetikan pesan-pesannya.

11

P. Membuat link Ke UseNet News


Usenet News adalah server yang merupakan forum diskusi dalam jaringan internet. Ini
memberi kesempatan kepada semua orang dalam internet untuk mengemukaan pendapat. Ada dua
jenis URL untuk news, yaitu URL yang menunjukan ke suatu subyek dan yang menunjuk ke suatu
pesan tertentu. Untuk membuat link dengan Usenet, gunakan news : diikuti nama newsgroupnya.
Contoh :
<A HREF=news:news.newusers.questions>news.newusers.questions</A>
Q. Link Ke FTP
Dengan Web, anda dapat melihat dan mengambil file dari suatu server FTP, tetapi anda tidak
dapat menaruh file ke server tersebut. Untuk membuat link ke situs FTP, gunakan
ftp://namasitus/path. Lihat potongan program berikut ini :
<A href=ftp://ftp.novell.com> Server FTP di Novell Inc </A>
<A href=ftp://ftp.intel.com/pub> Direktori pub di FTP intel </A>
<A href=ftp://ftp.novell.com/pub/patches.zip> File patches.zip </A>

R. Link Ke Gopher
Untuk mengidentifikasikan gopher, gunakan gopher: diikuti nama situs. Contoh potongan
program :
<A href=gopher://gopher.eff.org> Gopher organisasi eff </A>
<A href=gopher://riceinfo.rice.edu> Gopher informasi beras </A>

S. Akses Database Dengan Link WAIS


WAIS adalah Wide Area Information System yang bearti banyak database yang bsia
dilewatkan. WAIS didesain khusus oleh WAIS corporation sebagai jalan untuk mengakses informasi
dalam jumlah besar. Anda bisa link homepage anda dengan database WAIS semudah link dengan
yang lain. Gunakan wais: dan diikuti dengan alamat database WAIS. Contoh potongan program :
Untuk mencari angka dalam area anda klik :
<A href=wais://wais.situsku.com> Disini </A>

Tetapi banyak browser tidak support dengan database WAIS. Jika anda menempatkan link database,
yakinkan bahwa anda juga sudah memasukan referensi agar browser mendapatkan client WAIS.
Link ke
Web Page
E-mail
Newsgroup
FTP
Gopher
WAIS
Telnet

Rumus
http://namasitus/
mailto:alamat
News:newsgroupname
ftp://namasitus/
Gopher://namasitus/
wais://namasitus/
telnet://namasitus/

Contoh
http://www.situsku.com/
mailto:alamatku@yahoo.com
News:news.newusers.questions
ftp://ftp.situsku.com/
Gopher://gopher.situsku.com/
wais://wais.situsku.com/
telnet://bbs.situsku.com/

You might also like