Pratama SEO : Cara menampilkan gambar pada browser dengan HTML
untuk menampilkan gambar pada sebuah browser dengan menggunakan html caranya cukup mudah, oke kita akan mulai pertemuannya'
splahkan buka dulu aplikasi code editor di handphone teman-teman, oke jadi gambar yang akan kita tampilkan tidak harus memiliki format png atau jpeg semua web browser rata-rata support terhadap berbagai jenis gambar namun yang akan saya contohkan disisni adalah dengan format .png.
masukan file gambar yang akan ditampilkan diweb browser kedalam folder PERTEMUAN03 Lalu buat file image.htm/image.html kedua exstensi file tersebut sama sama jenisnya yaitu filr html, siapkan kerangka html5 terlebih dahulu lalu ganti titlenya sesuai dengan yang divideo atau terserah teman-teman,
Didalam tag body buat sebuah tag yang namanya image, untuk bebrapa text editor tinggal tambahkan saja img lalu tab maka hasil defaultnya seperti dibawah ini
<img src="" alt="" />
untuk menampilkan gambar maka yang perlu adalah nama gambarnya yaitu misalkan logo.png maka silahkan masukan pada atribut src, atribut ini digunakan untuk mengambil file gambar atribut ini juga akan kalian temukan pada tag script.
alt="" ?
atribut yanfg kedua adalah alt, ini digunakan untuk menmbahkan judul dari gambar juga jika file gambar tidak ada misal atau salah nama, maka yang akan ditampilkan dibrowser adalah tulisan yang kita isi dari atribut alt="". jadi seharusnya kalian mengisi 2 atribut seperti pada contoh :
<img src="namagambar.png" alt="INI AKAN TAMPIL JIKA GAMBAR TIDAK ADA" />
jika gambar memang ada maka gambar tersebut akan tampil baik dalam keadaan sesuai atau tidak sesuai (kebesaran). Nah, untuk mengatur ukuran gambar caranya dengan mebambahkan atribut width dan height contohnya adalah :
<img src="namagambar.png" alt="INI AKAN TAMPIL JIKA GAMBAR TIDAK ADA" width="50px" height="auto"/>
angka tersebut bisa kailan rubah sesuai dengan ukuran gambar yang ingin kalian gunakan, mudah-mudahan kalian paham, terima kasih dan sampai jumpa dipertemuan selanjutnya.
Happy Ngoding .......