Menambahkan Gambar ke Halaman Web Anda

Mendapatkan Gambar untuk Ditampilkan dengan Benar

Setiap gambar yang ingin Anda tautkan di situs web HTML Anda harus diunggah terlebih dahulu ke tempat yang sama dengan Anda mengirim HTML untuk laman web, apakah situs tersebut dihosting di server web yang Anda jangkau dengan FTP atau Anda menggunakan layanan hosting web. Jika Anda menggunakan layanan hosting web, Anda mungkin menggunakan formulir unggahan yang disediakan oleh layanan. Formulir ini biasanya di bagian administrasi akun hosting Anda.

Mengunggah gambar Anda ke layanan hosting hanyalah langkah pertama. Maka Anda perlu menambahkan tag dalam HTML untuk mengidentifikasinya.

Mengunggah Gambar ke Direktori yang Sama sebagai HTML

Foto Anda mungkin berada di direktori yang sama dengan HTML. Jika itu masalahnya:

  1. Unggah gambar ke akar situs web Anda.
  2. Tambahkan tag gambar di HTML Anda untuk menunjuk ke gambar.
  3. Unggah file HTML ke akar situs web Anda.
  4. Uji file dengan membuka halaman di browser web Anda.

Tag gambar mengambil format berikut:

Dengan asumsi Anda mengunggah foto bulan dengan nama "lunar.jpg," tag gambar mengambil bentuk berikut:

Tinggi dan lebar adalah opsional tetapi disarankan. Perhatikan bahwa tag gambar tidak memerlukan tag penutup.

Jika Anda menautkan ke gambar di dokumen lain, gunakan tag anchor dan sisipkan tag gambar di dalamnya.

Mengunggah Gambar dalam Subdirektori

Lebih umum menyimpan gambar dalam sub-direktori, biasanya disebut Gambar . Untuk menunjuk ke gambar di direktori itu, Anda perlu tahu di mana itu terkait dengan akar situs web Anda.

Akar situs web Anda adalah tempat URL, tanpa direktori apa pun di bagian akhir, ditampilkan. Misalnya, untuk situs web bernama "MyWebpage.com," root mengikuti formulir ini: http://MyWebpage.com/. Perhatikan garis miring di bagian akhir. Beginilah cara root direktori biasanya ditunjukkan. Subdirektori menyertakan slash itu untuk menunjukkan di mana mereka duduk dalam struktur direktori. Situs contoh MyWebpage mungkin memiliki struktur:

http://MyWebpage.com/ - direktori root http://MyWebpage.com/products/ - direktori produk http://MyWebpage.com/products/documentation/ - direktori dokumentasi di bawah direktori produk http: // MyWebpage.com/images/ - direktori gambar

Dalam hal ini, ketika Anda menunjuk ke gambar Anda di direktori gambar, Anda menulis:

Ini disebut jalur absolut ke gambar Anda.

Masalah Umum Dengan Gambar Yang Tidak Ditampilkan

Membuat gambar muncul di halaman web Anda dapat menjadi tantangan pada awalnya. Dua alasan paling umum adalah bahwa gambar tidak diunggah di mana HTML menunjuk, atau HTML ditulis dengan tidak benar.

Hal pertama yang harus dilakukan adalah melihat apakah Anda dapat menemukan gambar Anda secara online. Kebanyakan penyedia hosting memiliki beberapa jenis alat manajemen yang dapat Anda gunakan untuk melihat di mana Anda mengunggah gambar Anda. Setelah Anda berpikir bahwa Anda memiliki URL yang benar untuk gambar Anda, ketikkan ke browser Anda. Jika gambar muncul, maka Anda memiliki lokasi yang benar.

Kemudian periksa apakah HTML Anda mengarah ke gambar itu. Cara termudah untuk melakukannya adalah dengan menempel URL gambar yang baru saja Anda uji ke dalam atribut SRC. Unggah ulang halaman dan uji.

Atribut SRC dari tag gambar Anda tidak boleh dimulai dengan C: \ atau file: Ini akan tampak berfungsi ketika Anda menguji halaman web Anda di komputer Anda sendiri, tetapi setiap orang yang mengunjungi situs Anda akan melihat gambar yang rusak. Ini karena C: \ menunjuk ke suatu lokasi di hard drive Anda. Karena gambar ada di hard drive Anda, ini akan ditampilkan saat Anda melihatnya.