Belajar Html: Belajar Menampilkan Gambar

   Gambar Adalah Salah Satu Konten Yang Menarik Dalam Sebuah Website, Gambar Biasanya Di Gunakan Untuk Menampilkan Logo Perusahaan, Ilustrasi, Diagram, Dll. Pada Html Untuk Menampilkan Sebuah Gambar Adalah Dengan Menggunakan Tag Elemen <img>. Elemen Ini Tidak Di Tuliskan Dalam Tag Pembuka Dan Penutup. Contohnya Seperti Ini :

<img alt="Nama_Gambar" src="https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png" />

 Pada Kode Diatas, Elemen img Memiliki Attribute src, Dimana Attribute Ini Adalah Sebagai Alamat Dimana Gambar Yang Akan Kita Tampilkan. Selanjutnya Ada Attribute alt, Yang Merupakan Sebuah Elemen Yang Memberikan Nilai Tulisan Ketika Gambar Tidak Berhasil Di Tampilkan. Lalu, Attribute Terakhir Yang Dapat Kita Gunakan Adalah Attribute title, Attribute Ini Berfungsi Sebagai Informasi Tambahan Untuk Sebuah Gambar.

Jenis Format Gambar

 Berikut Adalah Jenis-Jenis Format Gambar Yang Umum Di Gunakan Pada Pembuatan Website:

Nama	Ekstensi Format File	Keterangan
Joint Photographic Expert Group image	jpg, .jpeg, .jfif, .pjpeg, .pjp	Kualitas text pada gambar dapat menjadi buruk. Ukuran file lumayan kecil. Pada website biasanya digunakan untuk gambar yang tidak banyak text.
Portable Network Graphics	.png	Text lebih bisa terbaca dibandingkan jenis Jpeg. Ukuran file dapat menjadi besar sehingga mengurangi kecepatan memuat situs.
WebP	.webp	Dibandingkan dengan gambar berkualitas sama pada jpeg atau png, ukuran file pada webp dapat menjadi lebih kecil. Namun tidak semua web browser dapat membaca webp.
Graphics Interchange Format	.gif	Dapat digunakan untuk gambar animasi. Ukuran file biasanya kecil. Kualitas gambar terbatas.
Scalable Vector Graphics	.svg	Kualitas gambar terjaga dan ukuran file kecil. Namun tidak cocok untuk gambar yang terlalu kompleks seperti foto. Pada website biasanya digunakan untuk logo atau icon.

Mengatur Ukuran Gambar

Untuk Mengatur Gambar Yang Di Tampilkan Juga Tentunya Menggunakan Sebuah Attribute. Untuk Mengatur Lebar Sebuah Gambar Kita Dapat Menggunakan Attribute Width, Dan Untuk Mengatur Tinggi Sebuah Gambar Dapar Menggunakan Attribute Height.

<img alt="Nama_Gambar" height="200px" src="https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png" width="500px" />

 Gambar Adalah Salah Satu Unsur Komponen Penting Dari Suatu Website, Karena Dengan Gambar Halaman Website Yang Kita Buat Akan Semakin Menarik Dan Html Mendukung Penambahan Gambar Pada Halaman Website.

Ini Adalah Materi Dasar Dalam Bahasa Markup Html Yaitu Belajar Menampilkan Gambar Pada Halaman Website. Tentu, Sangat Mudah Di Pelajari Untuk Pemula. Masih Banyak Yang Akan Kita Pelajari Mengenai Bahasa Markup Html ini.