Menyajikan Format Tampilan Gambar

Suatu  halaman  web  akan  terlihat  kaku,  terkesan  formal,  dan  sedikit  menjemukan bila  tidak  disertai  dengan  gambar.  Kita  bisa  lihat  saat  ini,  halaman  web  yang  ada di  internet,  hampir  semuanya  memasukkan  unsur  gambar,  animasi,  bahkan audio dan video untuk  menarik dan  membuat  tercengang para  pengunjungnya.   Sebagai  contoh  lain,  misalnya  ingin  membuat  halaman  web  yang  berisi  koleksi foto,  maupun  barang-barang  yang  sesuai  dengan  hobi.  Dalam  kasus  ini,  tentu harus memahami  teknik  untuk  menampilkan  foto  tersebut  ke  dalam  halaman  web sehingga akan  tampil  rapi  dan menarik. Bentuk  umum  penggunaan  tag <img>  adalah :
<img src=”namafile”>
Jika  file  yang  akan  ditampilkan  berada  di  direktori  lain,  atau  bahkan  berada  di situs  web  lain,  makan  perlu menyebutkan  juga  lokasi  dari  file  tersebut.
Contoh: Atau Cara  yang  diperlukan  untuk  memasukkan  atau  menambahakan  gambar  ke dalam  suatu  halaman  web  sangatlah  mudah.  HTML  telah  menyediakan  tag khusus  untuk  keperluan  ini,  yaitu  <img>.  Tag  ini  merupakan  tag  tunggal  atau tidak  memiliki  pasangan.  Atribut  terpenting  dari  tag  <img>  adalah  SRC  (source atau  sumber),  yang  berisi  file  gambar  yang  akan  ditampilkan  ke  dalam  halaman web. Jika  file  yang  akan  ditampilkan  berada  di  direktori  lain,  atau  bahkan  berada  di situs  web  lain,  makan  perlu menyebutkan  juga  lokasi  dari  file  tersebut.
<img src=  “../image/komputer.jpg”>
Format  gambar  yang  sering  digunakan  dalam  halaman  web  adalah  GIF  (.gif  ) dan  JPEG  (.jpg  atau  .  jpeg  ).  GIF  adalah  singkatan  dari  Graphics  Interface Format  sedangkan  JPEG,  adalah  singkatan  dari  Joint  Photographic  Expert Group.  Selain  kedua  format  tersebut,  saaat  ini  juga  sudah  mulai  banyak digunakan  gambar  dengan  format  PNG  (.png  ),  yanag  merupakan  singkatan  dari Portable Network  graphics.
Menggabung Gambar  dan  Teks
Jika  kita ingin  menggabungkan  ataumenyisipkan  gambar  di  dalam  suatu  teks atau  paragraf  tertentu,  terdapat  pilihan posisi  gambar  yang harus  diperhatikan:
Secara vertikal:
1.Teks bisa berada sejajar  dengan  bagian  atas  gambar   2.Teks bisa berada sejajar  dengan  bagian  tengah  gambar 3.Teks bisa berada sejajar  dengan  bagian  bawah  gambar
Secara horisontal:
1.Gambar bisa  berada  di  bagian  kiri  teks/paragraf   2.Gambar bisa  berada  di  bagian  kanan  teks/paragraf
Untuk  posisi  gambar  yangdilihat  dari  arah  vertikal  dapat  ditentukan  dengan mengisi  nilai  TOP,  MIDDLE,  atau  BOTTOM  ke  dalam  atribut  ALIGN  yang terdapat  pada  tag <img>.
Adapun  untuk  posisi  gambar  yang  dilihat  dari  arah  horisontal  ditentukribut  an dengan  mengisi  nilai  LEFT  dan  RIGHT  kedalam  ALIGN  pada  tag  <img>.  Dengan mengisi  atribut  tersebut  dengan  nilai  LEFT  maka  gambar  akan  berada  di  sebelah kiri  teks.  Sebaliknya,  jika  diisi  RIGHT  akan  menyeabkan  posisi  gambar  akan berada di  sebelah  kanan  teks.
Memperkecil  dan Memperbesar Ukuran  Gambar  
gambar  yang  ditampilkan  pada  dokumen  HTML  terkadang  tidak  memiliki  ukuran gambar  yang  sama  dengan  ukuran  sebenarnya.  Untuk  menghasilkan  gambar dengan  kualitas  yang  mirip  aslinya,  penentuan  ukuran  juga  menjadi  hal  yang penting  untuk  diperhatikan.  Maka  dari  itu  perbandinganya  harus  sesuai  dengan ukuran  asli  dari  gambar  tersebut.  Untuk  menentukan  ukuran  gambar,  kita  perlu mengisi  atribut  HEIGHT  berfungsi  untuk  menetukan  tinggi  gambar  dan  WIDTH untuk  menetukan  lebar  gambar.
Memberi  keterangan  pada  gambar
Agar  lebih terkesan  informatif,  anda  dapat  memberikan  keterangan  yang  relevan dan seperlunya (tidak  berlebihan)  terhadap  gambar  yang anda  tampilkan  pada halaman  web.  Keterangan ini  akan  muncul  dalam  bentuk  tooltip  (  sesaat,  hanya beberapa detik)  pada  saat  penunjung  mengarahkan  kursor  (penjujuk  mouse)  ke atas  gambar.