Cara Memberi Keterangan Gambar pada HTML

Tags

Cara Memberi Keterangan Gambar pada HTML

Agar terkesan lebih informatif, kita bisa memberikan keterangan yang relevan dan tidak berlebihan (seperlunya) terhadap gambar yang kita tampilkan pada HTML (sebuah halaman web). Keterangan ini nantinya akan muncul dalam bentuk tooltip (sesaat, hanya beberapa detik saja) pada saat penunjung web mengarahkan kursornya (penjujuk mouse) ke atas gambar yang bersangkutan. Untuk membuat keterangan pada gambar seperti ini, maka kita bisa menggunakan atribut TITLE ataupun ALT pada tag <img>. Seperti:

<img src=”namafile” title=”keterangan”/>

Contoh dari hasil dokumen HTML di Web Browser nantinya akan seperti gambar berikut ini:

Cara Memberi Keterangan Gambar pada HTML
 
Pada gambar di atas bisa dilihat bahwa keterangan gambar akan terlihat pada saat mouse berada tepat di atas gambar tersebut, disana tertulis kata “Komputer Desktop” sebagai keterangan gambar.

Namun sebelum kita memberi keterangan gambar pada HTML, tentu saja kita juga harus mengetahui bagaimana cara menambahkan gambar pada HTML.

Cara Menambahkan Gambar pada HTML

Sebuah halaman web akan terlihat kaku, terkesan formal, kurang menarik dan sedikit menjemukan apabila tidak disertai dengan gambar. Sekarang ini hampir semua halaman web yang ada di internet, memasukkan unsur gambar, animasi, bahkan juga audio dan video untuk menarik dan membuat para pengunjungnya tertarik. Jika kita ingin membuat sebuah halaman web yang berisi misalnya koleksi foto, ataupun barang-barang yang sesuai dengan hobi, tentu kita harus memahami teknik untuk menampilkan foto atau gambar tersebut ke dalam halaman web sehingga nantinya akan tampil rapi dan sangat menarik.

Cara yang dibutuhkan untuk menambahkan atau memasukkan gambar ke dalam suatu halaman web sangat mudah. HTML sudah menyediakan tag khusus untuk kebutuhan ini, yaitu tag <img>. Tag ini adalah tag tunggal atau tidak mempunyai pasangan. Atribut terpenting dari tag <img> ini ialah SRC (source atau sumber), yang berisikan file gambar yang nantinya akan ditampilkan ke dalam halaman web yang bersangkutan. Secara umum bentuk penggunaan tag <img> yaitu:

<img src=”namafile”>

Apabila file yang akan ditampilkan berada didalam direktori lain, ataupun bahkan berada di situs web lain, maka kita perlu untuk menyebutkan juga lokasi dari file tersebut. Contohnya seperti ini:

<img src= “../image/komputer.jpg”>
Atau
<img src=http://www.abcde.com/image/kamera.jpg/>

Contoh dari hasil dokumen HTML dalam Web Browser seperti gambar berikut ini:

Cara Memberi Keterangan Gambar pada HTML

Format gambar yang sering kali dipakai dalam halaman web diantaranya ialah GIF (.gif ) dan JPEG (.jpg atau .jpeg). GIF ialah singkatan dari Graphics Interface Format sementara JPEG ialah singkatan dari Joint Photographic Expert Group. Selain dua format gambar tersebut, saat ini juga sudah mulai banyak dipakai gambar dengan format PNG (.png), PNG adalah singkatan dari Portable Network graphics.

Berkomentarlah sesuai dengan topik artikel
EmoticonEmoticon