Mengenali Imej dan Merangkai Imej serta Teks.
Dalam Pelajaran 3 anda akan belajar mengenai:

• Apa Itu Imej?
• Imej Untuk HP;
dan
• Meletak Imej Pada Dokumen HTML.

Imej yang dimaksudkan di sini adalah gambar yang sememangnya mempunyai banyak format. Disenaraikan di bawah ini antara beberapa format imej atau gambar yang biasa ditemui:

• Windows Bitmap files -- (.BMP/.DIB/.RLE)
• CorelDRAW, CorelGALLERY -- (.CDR/.PAT/.BMF)
• Encapsulated Postscript files -- (.EPS)
• Windows Icon files -- (.ICO)
• ZSoft Picture files -- (.PCX/.PCC)
• Kodak PhotoCD files -- (.PCD)
• Adobe Photoshop files -- (.PSD)
• Sun Raster format -- (.RAS/.SUN)
• Raw grayscale images -- (.RAW)
• Targa TruevisionTM files -- (.TGA/.WIN)
• Tagged Image Format files -- (.TIF)
• WordPerfect graphics files -- (.WPG)

• Bitmap (.bmp);
• JPEG (.jpg); dan
• CompuServe Graphics Interchange Format (.gif).

Antara punca utama mengapa tiga format ini lebih kerap digunakan ialah:

• Difahami serta disokong oleh semua pelayar web;
• Saiz fail yang lebih kecil; dan
• Kualiti gambar yang baik.

Jikalau anda mempunyai gambar bercetak (printed) milik peribadi yang hendak digunakan untuk HP, anda bolehlah scan gambar berkenaan dan melakukan manipulasi gambar menggunakan perisian khas untuk gambar seperti Adobe Photoshop, Corel Photopaint dan sebagainya. Bagi memastikan saiz fail adalah kecil, gunakan format JPEG atau GIF. Perlu diingat bahawa tidak semua orang mempunyai banyak waktu untuk menjelajah HP, jadi pastikan saiz dokumen HTML anda tidak terlalu besar dan imej-imej atau gambar yang digunakan juga tidak terlalu besar.

Di samping itu, anda juga boleh melukis imej atau gambar sendiri menggunakan perisian-perisian tertentu, contohnya Paint (Windows 3.x serta Windows 95), Adobe Illustrator, Paintshop, Freehand, Corel Draw dan sebagainya. Tunjukkanlah bakat dengan melukis sendiri imej, gambar ataupun icon untuk HP anda.

Untuk maklumat anda, saiz skrin umumnya ada empat (4) iaitu (tinggi X lebar);

• 480 X 640;
• 600 X 800;
• 768 X 1024; dan
• 1024 X 1280.

Umumnya semua orang suka kepada gambar-gambar yang bersaiz besar, tetapi perlu diambil perhatian bahawa semakin besar saiz gambar semakin lambat pula proses down-loading dan tidak ada sesiapa pun yang suka membuang masa untuk menunggu. Oleh kerana itu anda haruslah bijak menentukan saiz gambar yang hendak digunakan. Seelok-eloknya pastikan lebar keseluruhan HP anda tidak melebihi 800 pixel dan ini bermakna lebar gambar-gambar yang anda gunakan juga janganlah melebihi 800 pixel. (Namun begitu, bagi pengguna skrin bersaiz 480 X 640, mereka tetap melihat HP anda lebih lebar dari saiz skrin mereka.)

Pada umumnya gambar yang mempunyai resolusi 72dpi (dots per inch atau pixel setiap inci) iaitu resolusi (resolution) standard, adalah tinggi kualitinya. Jikalau anda menggunakan gambar dengan resolusi yang lebih besar, saiz imej anda juga menjadi bertambah besar. Undang-undangnya mudah sahaja, iaitu lebih tinggi resolusi, lebih besar saiz.

Jikalau anda terpaksa menggunakan imej berukuran besar, format JPEG adalah lebih wajar digunakan. Contohnya, imej bagi kod warna adalah besar, iaitu berukuran 780 x 1069. Saya gunakan resolusi 72dpi. Tetapi format JPEG memungkinkan saya mendapat saiz berbeza tanpa banyak mengorbankan kualiti imej. Sila lihat di sini;

GIF beranimasi (animated gif) adalah sekumpulan gambar yang dirangkai bagi mencipta aksi. Misalnya, butang "berundur setapak" dan "maju selangkah" (lihat bahagian bawah dokumen ini) adalah serangkai empat belas (14) imej yang di susun bagi mencipta aksi pintu terbuka dan tutup. Jikalau anda berminat untuk mencipta imej GIF beranimasi, anda boleh gunakan Microsift Gif Animator atau Photo Impact Gif Animator.

Walaupun anda boleh mencipta imej asal dalam format jpeg ataupun gif, perlu diambil perhatian bahawa semuanya bergantung kepada kegunaan imej gif beranimasi berkenaan. Jikalau imej Gif beranimasi itu bebas dari warna latar-belakang dokumen HTML, lebih elok gunakan imej asal format JPEG supaya anda boleh mendapatkan saiz yang lebih kecil. Jikalau imej Gif beranimasi itu nanti ada pertalian dengan warna latar-belakang dokumen HTML, ciptalah imej asal format Gif tanpa warna latar-belakang.

Arahan kepada pelayar web supaya ia dapat memaparkan gambar yang anda pilih hendaklah mengandungi tiga (3) unsur berikut:

• nama fail;
• lokasi fail (URL); dan
• saiz fail.

<IMG SRC="ikan.gif" WIDTH=254 HEIGHT=102>

• IMG SRC = sumber imej (fail); dan
• WIDTH HEIGHT = lebar tinggi yang merujuk kepada saiz imej

<IMG SRC="ikan.gif" WIDTH=254 HEIGHT=102>

Arahan yang anda mesti tulis dalam dokumen HTML adalah seperti berikut:

<IMG SRC="imej/ikan.gif" WIDTH=254 HEIGHT=102>

Sila ambil perhatian bahawa saiz imej hendaklah dituliskan mengikut saiz sebenar ataupun dikecil atau dibesarkan mengikut kadar tetap (propotionate). Jikalau ukuran sebenar tidak digunakan, contohnya apabila anda menulis ukuran yang lebih kecil dari saiz sebenar, pelayar web akan menghimpit (compressed) gambar anda menjadi kecil mengikut ukuran yang anda tuliskan. Jikalau anda menulis ukuran yang lebih besar dari saiz sebenarnya, pelayar web akan mengekang (stretched) gambar anda mengikut saiz yang anda tulis.

Adakalanya imej atau gambar yang dirujuk berada di lain lokasi web. Contohnya anda berada di sini:

http://www.sini.com/pelajaran/pelajaran.html

http://www.sana.com/akuarium/imej/ikan.gif

<IMG SRC="http://www.sini.com/akuarium/mej/ikan.gif" WIDTH=254 HEIGHT=102>

Contohnya;