Link merupakan komponen yang sangat penting di dalam sebuah blog
atau website. Sebab dengan adanya link atau hyperlink, pengunjung sebuah
blog dapat dengan mudah mengakses dan menjelajahi seluruh website
dengan cepat.
Selain link yang menggunakan teks, link pun bisa menggunakan foto atau
gambar yang membuat tampilannya menjadi lebih menarik dan efektif.
Berikut di bawah ini adalah cara penulisan atau pembuatan
link dengan gambar yang menggunakan metode HTML:
Tag Link
<a href='url tujuan'>Teks atau Gambar</a>
- <a> adalah tag HTML yang berfungsi untuk mendefinisikan sebuah link.
- href adalah atribut (informasi tambahan) dari tag a untuk url/alamat yang akan dituju dari link.
- Value dari href harus diberi tanda kutip.
contoh:
<a href='http://www.otodidakers-tutor.blogspot.com/'>Otodidakers Tutorial</a>
Hasil:
Tag Gambar/Images
<img src='url gambar' alt='nama alternatif gambar' width='tinggi' height='lebar'>
- Tag <img> adalah tag HTML untuk mendefinisikan sebuah gambar.
- Atribut src adalah sumber/url dari gambar.
- Atribut alt adalah untuk memberikan nama alternatif gambar. Apabila
gambar tidak bisa ditampilkan, maka yang muncul adalah nama
alternatifnya.
- Atribut height dan width adalah untuk mengatur ukuran gambar.
contoh:
<img src='http://www.comicbookdaily.com/wp-content/uploads/2010/09/click.jpg' alt='Click Me!' width=100' height='100'>
Hasil:
Digabungkan menjadi link gambar
<a href='
http://otodidakers-tutor.blogspot.com/'>
<img src='
http://www.comicbookdaily.com/wp-content/uploads/2010/09/click.jpg' alt='
Click Me!' width='
100' height='
100'>
</a>
Tag <img> harus diapit oleh tag <a> dimana tag penutup harus dikasih garis miring, seperti: </a>
Hasil:
Klik pada gambar di atas untuk berpindah ke halaman web yang dituju.
Mungkin cukup sekian bagaimana
cara membuat link menggunakan gambar atau foto, semoga dapat membantu dan mudah dimengerti.
