CARA MENAMBAHKAN FOTO DI HTML

HTML, atau Hypertext Markup Language, merupakan bahasa pemrograman dasar yang digunakan dalam pembuatan halaman web. Salah satu aspek penting dalam desain web adalah penambahan elemen visual, seperti foto. Dalam artikel ini, kamu akan dipandu dengan sederhana bagaimana menambahkan foto di HTML.

Menyiapkan Foto

Pertama-tama, kamu harus memastikan bahwa foto yang ingin kamu tampilkan di halaman web sudah tersedia dan berada dalam folder yang sama dengan file HTML kamu. Hal ini penting agar link ke foto dapat ditemukan oleh browser. Pastikan juga foto tersebut memiliki format yang umum seperti .jpg, .jpeg, .png, atau .gif.

Menggunakan Tag ‘img’

Tag <img> adalah tag HTML yang digunakan untuk menampilkan gambar di halaman web. Berikut ini adalah struktur dasar dari tag ini:

<img src="url_gambar" alt="deskripsi_gambar">

Untuk menampilkan foto dalam HTML, kamu bisa mengganti bagian url_gambar dengan nama dan ekstensi file foto yang ingin ditampilkan. Misalnya, jika kamu memiliki file foto dengan nama ‘pemandangan.jpg’, maka kamu bisa menulisnya seperti ini:

<img src="pemandangan.jpg" alt="Pemandangan indah di siang hari">

Perhatikan bahwa ada atribut alt dalam tag img. Atribut ini digunakan untuk memberikan teks alternatif yang akan ditampilkan jika browser tidak dapat memuat gambar.

Menyesuaikan Ukuran Foto

Terakhir, jika kamu ingin menyesuaikan ukuran foto, kamu bisa menambahkan atribut width dan height pada tag img. Nilai dari atribut ini diukur dalam piksel. Sebagai contoh, cara menampilkan foto dengan lebar 500 piksel dan tinggi 300 piksel adalah sebagai berikut:

<img src="pemandangan.jpg" width="500" height="300" alt="Pemandangan indah di siang hari">

Dengan mempelajari dasar-dasar ini, diharapkan kamu sudah bisa menambahkan foto ke dalam halaman web HTML-mu. Setelah menguasai penambahan foto, kamu bisa belajar hal lainnya seperti menambahkan animasi atau video, dan lainnya. Selamat mencoba!