Langsung ke konten utama

Menggunakan Link di dalam HTML - HTML Tutorial

Link merupakan suatu gambar atau teks yang terkait dengan suatu alamat tertentu.Jika link diklik maka dokumen HTML akan menuju ke alamat tersebut.Ditandai dengan Anchor, yaitu tag <a>.

Tag <a> mempunyai dua atribut,yaitu href dan name.Atribut href digunakan jika sebuah anchor akan digunakan sebagai link,sedangkan atribut name digunakan jika anchor akan digunakan sebagai tujuan.

1.Link ke dokumen lain

Untuk membuat link/penghubung dengan target ke dokumen/halaman yang berbeda,anda harus membuat dokumen yang dituju/target dan disimpan dalam direktori tertentu,baik pada direktori yang sama atau berbeda dengan dokumen yang aktif sekarang.Untuk mencoba kita akan membuat 3 file yang saling berhubungan.Sebelumnya supaya file-file yang dibuat terlihat rapi kita buat folder "tabel" terlebih dahulu jika nanti file link yang kita buat tersimpan di dalam folder "tabel".

1.link-utama.html

 <html>
<head>
<title> Halaman Utama </title>
</head>
<body>
<h2> Ini adalah halaman utama.</h2>
<ul>
<li><a href="link-utama.html">klik, ke halaman
utama.</a></li>
<Li><a href="link-satu.html">klik, ke halaman
satu.</a></li>
<li><a href="link-dua.html">klik, ke halaman dua.</a></li>
<ul>
</body>
</html>

2.nama link-satu.html

 <html>
<head>
<title> Halaman Satu </title>
</head>
<body>
<h2> Ini adalah halaman utama.</h2>
<ul>
<li><a href="link-utama.html">klik, ke halaman
utama.</a></li>
<li><a href="link-satu.html">klik, ke halaman
satu.</a></li>
<li><a href="link-dua.html">klik, ke halaman dua.</a></li>
<ul>
</body>
</html>

3.nama link-dua.html

 <html>
<head>
<title> Halaman Dua </title>
</head>
<body>
<h2> Ini adalah halaman utama.</h2>
<ul>
<li><a href="link-utama.html">klik, ke halaman
utama.</a></li>
<li><a href="link-satu.html">klik, ke halaman
satu.</a></li>
<li><a href="link-dua.html">klik, ke halaman dua.</a></li>
<ul>
</body>
</html>


2.Link ke bagian tertentu dalam dokumen yang sama

Untuk membuat link ke bagian tertentu dalam dokumen yang sama,harus diberikan nama anchor.Perbedaan dengan link yang berbeda dokumen adalah tujuan/target link,jika dalam dokumen yang sama yang dituju adalah nama anchor tetapi kalau dokumen yang beda yang dituju adalah nama file/dokumen yang bersangkutan.

Untuk memberi nama anchor,atribut yang dipakai adalah NAME pada tag anchor <A> dan untuk membuat link cukup memberikan tanda # setelah nama file dalam URL . Misal :

<a href="php"> Bab 1 </a>
 
Atau dapat ditulis lengkap :

<a href="belajar_php.html#php"> Bab 1 </a>

Dan untuk nama anchornya :

<a name="php">Ada apa dengan PHP?</a>

3.Link ke alamat URL atau Website

Untuk membuat link ke alamat URL adalah dengan menambahkan :

http://nama_URL.

Contoh :

<a href="http://www.yadull.blogspot.com">www.yad
ull.blogspot.com</a>

4.Link ke Alamat Email

Link email adalah membuat link pada teks,jika teks tersebut diklik maka akan menampilkan program pengiriman email yang terdapat pada komputer yang dipakai untuk mengakses data atau teks tersebut secara otomatis.

Untuk membuat link ke alamat email hanya menambahkan atribut mailto:alamat_email ke dalam tag <a href>

Misalnya :

<a href="mailto:yayadulyaden217@gmail.com">
Kirim email</a>

5.Link file yang akan didownload

Link file dalam hal ini adalah apabila diklik pada teks tersebut maka proses selanjutnya adalah mendownload file yang tercantum pada dokumen tersebut. Format penulisannya adalah 
<a href=nama_file>

Misalnya :

< a href="antivirus.zip">Download anti virus</a>
<a href="latihan.doc">Download latihan Html</a>
<a href="mysql.exe">Download MYSQL</a>



Komentar

Postingan populer dari blog ini

Memformat Karakter HTML - HTML Tutorial

Format terhadap karakter yang ditampilkan akan sangat berguna untuk membuat sebuah dokumen HTML yang menarik. 1.Logical Format Logical format akan menerapkan layout dokumen secara logis dan terstruktur.Tag-tag yang termasuk logical format adalah sebagai berikut : <cite> digunakan untuk menandai suatu kutipan (Citation). <code> digunakan untuk menampilkan kode-kode pemrograman,misalnya bahasa C. <em> digunakan untuk menandai suatu teks yang ditekankan oleh penulis. <kbd> digunakan untuk menandai suatu teks yang harus dimasukkan oleh user melalui keyboard. <samp> digunakan untuk menandai suatu teks yang dimaksudkan sebagai contoh. <strong> digunakan untuk menandai bagian yang terpenting dari suatu teks. <var> digunakan untuk menampilkan nama variabel. <dfn> digunakan untuk menandai sebuah subdenfinisi dari daftar. Semua tag tersebut memerlukan tag penutupnya masing-masing. Contoh (save dengan nama logical format.html) :  <html> ...

TEKNOLOGI WEB

TEKNOLOGI WEB sumber gambar slideplayer.info Web berdasarkan teknologinya terbagi menjadi dua,yaitu Web Statis dan Web Dinamis.Sebelum menuju ke perbedaan web statis dan web dinamis,mari kita bahas persamaannya terlebih dahulu.Persamaan web statis dan dinamis yaitu sama-sama keduanya merupakan suatu web yang menampilkan halaman yang ditampilkan di internet yang memuat informasi tertentu (khusus). Pengertian Web Statis dan Web Dinamis Web statis adalah website yang mana pengguna tidak bisa mengubah konten dari web tersebut secara langsung menggunakan browser.Interaksi yang terjadi antara pengguna dan server hanyalah seputar pemrosesan link saja.Halaman-halaman web tersebut tidak memiliki database,data dan informasi yang ada pada web statis tidak berubah-ubah kecuali diubah sintaksnya.Dokumen web yang dikirim kepada client akan sama isinya dengan apa yang ada di web server. Contoh dari web statis adalah web yang berisi profil perusahaan.Disana hanya ada beberapa...