Friday, 15 July 2016

Tutorial HTML Lengkap : Membuat Hyperlink pada HTML

Pada artikel kali ini saya akan membahas tutorial HTML tentang membuat HYPERLINK pada HTML.
Hyperlink yang sering di kenal dengan link yaitu menghubungkan antara satu dokument dengan dokumen yang lain pada HTML. Tujuan dari hyperlink ini membuat sebuah teks atau gambar yang ketika diklik akan di alihkan ke halaman tertentu yang sudah di tetapkan dalam penulisan hyerlink tersebut.

Hyperlink sendiri ditulis dengan <a> atau yang kita kenal dengan anchor (jangkar). <a> ini selalu diikiti oleh atribut href, dimana didalam href (hypertext reference) ini lah yang akan diisikan alamat yang dituju ketika text atau gambar diklik.  berikut penulisan hyperlink menggunakan <a href=”#”> :
<a href="rustan-cunguk.blogspot.co.id">klik disini</a>
Ketika diklik pada kata klik disini maka akan di alihkan ke halaman rustan-cunguk.blogspot.co.id


Jenis Hyperlink Pada HTML
Dalam penulisan alamat Membuat Hyperlink Pada HTML memiliki dua jenis yaitu alamat absolte dan alamat alternatif.

1. Alamat absolute yaitu penulisa alamat file yang disertai dengan alamat website. contohnya :
<!DOCTYPE html>
<html>
<head>
<title>belajar memubuat hyperlink</title>
</head>
<body>
ini adalah contoh alamat absolute <a href="https://rustan-cunguk.blogspot.co.id/search/label/Teknologi">klik disini</a>
</body>
</html>
Dari contoh diatas merupakan hyperlink menggunakan alamat absolute. dimana saya akan menakses file html yang berada di  https://rustan-cunguk.blogspot.co.id/search/label/Teknologi

2. Alamat alternatif merupakan penulisan alamat file yang akan di panggil berada dalam aplikasi yang sama, jadi sebelum memanggil file yang diperlukan tidak udah menggunakan nama dari websitenya. contohnya saya akan memanggil file part7.html yang berada dalam projek saya (satu folder dengan halama yang sekarang saya buat)
<!DOCTYPE html>
<html>
<head>
<title>belajar memubuat hyperlink</title>
</head>
<body>
ini adalah contoh alamat alternatif <a href="part7.html">klik disini</a>
</body>
</html>



0 comments

Post a Comment