Menyisipkan Image Pada Dokumen HTML

Ada beberapa alasan mengapa di dalam suatu dokumen html orang ingin menambahkan gambar atau objek lainnya. Mungkin hanya sekedar untuk mempercantik tampilan halaman, memberikan dukungan / penjelasan (support) mengenai isi artikel, atau alasan lainnya. Namun untuk menyisipkan gambar dalam suatu dokumen html tidak asal taruh saja, bisa-bisa hasilnya akan seperti ini:

Blogger dimulai oleh sebuah perusahaan sangat kecil di San Fransisco yang bernama Pyra Labs pada bulan Agustus 1999. Terjadi di tengah-tengah booming dot-com. Tetapi kami bukan jenis perusahaan yang didanai oleh VC, suka berpesta, dan berhura-hura, ataupun minum bir. (Kecuali bir gratis.)

Kami tiga sekawan, didanai dengan melakukan kontrak proyek web yang mengesalkan untu kperusahaan besar, berusaha mencari jalan masuk yang megah ke dunia Internet. Apa yang dulu kami coba lakukan tidak ada hubungannya lagi sekarang. Tapi dulku ketika melakukan itu, kami menciptakan Blogger, hanya iseng saja, dan kami berpikir — Hmmmm... ini sepertinya menarik.

Tidak rapi kan hasilnya, masih ada ruang kosong disebelah kanan gambar. Untuk merapikannya perlu ditambahkan kode "align="left atau right" setelah alamat url gambar. Contoh di atas kodenya seperti ini:

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj07lJ8MQdnyIqfglIz2G-cQsDpu4lpKAfasNJnzO5SsTP-D2Q2_qrtuU5uY50ng5v_ciNeD6C_hZ5EClhyphenhyphenPBW_cMP5IwOqsnEeQh6uSlYgNoUwDlHmxxg9unQyab7DUNZ_bYLeVyLC9dk/s320/blogger_logo.gif">Blogger dimulai oleh sebuah perusahaan sangat... dst.

Maka agar kelihatan rapi tambahkan kode "align="left atau right" setelah alamat url gambar. Kurang lebih seperti ini:

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj07lJ8MQdnyIqfglIz2G-cQsDpu4lpKAfasNJnzO5SsTP-D2Q2_qrtuU5uY50ng5v_ciNeD6C_hZ5EClhyphenhyphenPBW_cMP5IwOqsnEeQh6uSlYgNoUwDlHmxxg9unQyab7DUNZ_bYLeVyLC9dk/s320/blogger_logo.gif" align="right">

Hasilnya akan seperti ini:

Blogger dimulai oleh sebuah perusahaan sangat kecil di San Fransisco yang bernama Pyra Labs pada bulan Agustus 1999. Terjadi di tengah-tengah booming dot-com. Tetapi kami bukan jenis perusahaan yang didanai oleh VC, suka berpesta, dan berhura-hura, ataupun minum bir. (Kecuali bir gratis.)

Kami tiga sekawan, didanai dengan melakukan kontrak proyek web yang mengesalkan untu kperusahaan besar, berusaha mencari jalan masuk yang megah ke dunia Internet. Apa yang dulu kami coba lakukan tidak ada hubungannya lagi sekarang. Tapi dulku ketika melakukan itu, kami menciptakan Blogger, hanya iseng saja, dan kami berpikir — Hmmmm... ini sepertinya menarik.

Namun ada sedikit masalah, kelihatannya jarak gambar dengan isi tulisah terlalu dekat. Untuk mengatasinya tambahkan kode ini "hspace='10'". 10 dalam arti ukuran jarak 10 pixel, terserah mau anda tentukan berapa jaraknya. Kurang lebih code yang harus disisipkan akan seperti ini:

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj07lJ8MQdnyIqfglIz2G-cQsDpu4lpKAfasNJnzO5SsTP-D2Q2_qrtuU5uY50ng5v_ciNeD6C_hZ5EClhyphenhyphenPBW_cMP5IwOqsnEeQh6uSlYgNoUwDlHmxxg9unQyab7DUNZ_bYLeVyLC9dk/s320/blogger_logo.gif" align="right" hspace='10'>

Hasilnya akan seperti ini:

Blogger dimulai oleh sebuah perusahaan sangat kecil di San Fransisco yang bernama Pyra Labs pada bulan Agustus 1999. Terjadi di tengah-tengah booming dot-com. Tetapi kami bukan jenis perusahaan yang didanai oleh VC, suka berpesta, dan berhura-hura, ataupun minum bir. (Kecuali bir gratis.)

Kami tiga sekawan, didanai dengan melakukan kontrak proyek web yang mengesalkan untu kperusahaan besar, berusaha mencari jalan masuk yang megah ke dunia Internet. Apa yang dulu kami coba lakukan tidak ada hubungannya lagi sekarang. Tapi dulku ketika melakukan itu, kami menciptakan Blogger, hanya iseng saja, dan kami berpikir — Hmmmm... ini sepertinya menarik.

Jika gambar ingin diletakkan di sebelah kiri, maka ganti "align='right' dengan align='left'". Cukup mudah bukan.