HTML
Membuat Gambar Link / Link Banner di HTML
Mungkin dengan menyisipkan gambar saja itu hal biasa, nah bagaimana di gambar tersebut kita pasang link yang nyambung ke halaman lainnya. Dilihat dari sisi penerapannya tutorial kali ini bisa diterapkan bagi anda yang kebutuhan nya membuat profile website. Biasanya kan pada profile suka ada gambar foto yang pada halaman awal nya hanya foto saja atau hanya keterangan yang mencakup secara umum saja, nah untuk ingin melihat lebih detail nya klik poto tersebut.
Tools
- Web Editor (Notepad++)
- Web Browser(Mozilla)
Langkah - langkah
- Cari gambar yang akan dijadikan latihan kali ini, untuk contoh sekarang dengan nama gambarnya "walter-obrien" tanpa tanda petik
- Simpan didalam 1 folder bersama file dibawah ini yang akan segera di buat
<html>
<head>
<title>halaman 1</title>
</head>
<body>
<a href="hal2.html"> <img src = "walter-obrien.jpg"></a>
</body>
</html>
Simpan dengan nama hal1.html
Ketikan atau copas sintak dibawah
<html>
<head>
<title>halaman 2</title>
</head>
<body>
<p>
Walter O'Brien (lahir 24 Februari 1975) adalah seorang pengusaha Irlandia dimana ia adalah pendiri
dan CEO dari Computer Services Scorpion. Ia juga menjadi inspirasi bagi produser eksekutif
dari 2014 CBS serial televisi Scorpion. (sumber : wiki)
<a href="hal1.html">kembali</a>
</body>
</html>
Simpan dengan nama hal2.html
Mungkin seperti itu contoh latihan kali ini mengenai gambar link di HTML, semoga bermanfaat dan bisa anda kembangkan lagi dengan memasang gambar lebih dari satu.
Untuk mengembangkan lagi kita bisa menambahkan atribut alt serta title pada tag <img> sekaligus request dari salah satu agan di blogger indonesia. Thanks gan sudah request. (y)
Kembali mengenai fungsi dari masing - masing attribut tersebut :
alt : untuk memberikan alternatif keterangan yang keluar apabila gambar gagal keluar
title : untuk memberikan keterangan judul pada gambar ketika gambar disorot
Contoh nya seperti dibawah ini
<img src = "walter-obrien.jpg" title="walter" alt="gambar walter">
0 comments