HTML memiliki kemampuan untuk menampilkan media berupa gambar dan dengan bantuan javascript mampu menampilkan video flash ataupun file mp3. Rasanya tidak menarik kalau sebuah website tidak memiliki gambar di dalamnya dan hanya terdiri atas text saja. Gambar dalam HTML didefiniskan dengan menggunakan tag “<img>”.

berikut ini format pendefinisian gambar di dalam HTML :

<img src=”{source}” width=”{lebar}” height=”{tinggi}” alt=”{alt}” title=”{title}” align=”{align}” />

source merupakan alamat gambar yang ingin ditampilkan. Lebar dan tinggi diatur dalam ukuran pixel, jika hanya lebar saja yang difinisikan maka tinggi akan menyesuaikan dengan lebarnya demikian juga sebaliknya. Apabila keduanya didefinisikan maka gambar akan menyesuaikan lebar dan tinggi tidak secara proporsional (dipaksa lebar dan tingginya). Alt digunakan untuk menampilkan text jika gambar tidak/belum tampil pada halaman web sedangkan title digunakan untuk member definisi gambar tersebut (SEO). Align digunakan untuk mengatur arah gambar sebagaimana mengatur paragraf. Align memiliki tiga pilihan umum yaitu left, right, dan center.

berikut ini beberapa contoh penggunaan tag “<img>” :

<img src=”http://agungpm.ashatec.com/gambar.jpg” width=”400″ height=”300″ alt=”Berlatih Gambar HTML” title=”Berlatih Gambar HTML” align=”left”>

atau

<img src=”http://agungpm.ashatec.com/gambar.jpg” width=”400″  alt=”Berlatih Gambar HTML” title=”Berlatih Gambar HTML” align=”left”>

atau

<img src=”http://agungpm.ashatec.com/gambar.jpg”  height=”300″ alt=”Berlatih Gambar HTML” title=”Berlatih Gambar HTML” align=”left”>

Ada juga tag yang digunakan dalam HTML (bukan XHTML) yaitu “hspace” dan “vspace”. Tag ini digunakan untuk mengatur jarak text dari gambar secara horizontal dan vertical.  Contoh penggunaannya sebagai berikut :

<img src=”http://agungpm.ashatec.com/gambar.jpg” width=”400″ height=”300″ alt=”Berlatih Gambar HTML” title=”Berlatih Gambar HTML” hspace=”5″ vspace=”5″  align=”left”>