multimedia pada halaman web
TRANSCRIPT
![Page 1: Multimedia pada Halaman Web](https://reader036.vdocuments.site/reader036/viewer/2022081800/587280ef1a28abc7068b634d/html5/thumbnails/1.jpg)
MULTIMEDIA PADA HALAMAN WEB
Surya R. LabetubunSMK Kartika XX-1 Makassar
![Page 2: Multimedia pada Halaman Web](https://reader036.vdocuments.site/reader036/viewer/2022081800/587280ef1a28abc7068b634d/html5/thumbnails/2.jpg)
APA YANG AKAN DIPELAJARI
• Format Tampilan Gambar• Format Tampilan File Audio• Format Tampilan Video dan
Animasi• Format Tampilan Gambar dengan
MAP
![Page 3: Multimedia pada Halaman Web](https://reader036.vdocuments.site/reader036/viewer/2022081800/587280ef1a28abc7068b634d/html5/thumbnails/3.jpg)
Format Tampilan Gambar
Tag <img> digunakan untuk menampilkan gambar pada dokumen HTML.
![Page 4: Multimedia pada Halaman Web](https://reader036.vdocuments.site/reader036/viewer/2022081800/587280ef1a28abc7068b634d/html5/thumbnails/4.jpg)
Tag <img> termasuk salah satu dari empty element, maksudnya memiliki attribut tetapi tidak memiliki tag penutup.
Browser menampilkan gambar sesuai letak tag <img> pada dokumen HTML yang dibuat.
![Page 5: Multimedia pada Halaman Web](https://reader036.vdocuments.site/reader036/viewer/2022081800/587280ef1a28abc7068b634d/html5/thumbnails/5.jpg)
Syntax dari HTML image<img src='url'/>
Penjelasan :<img> adalah tag pembuka.src adalah attribut yang digunakan sebagai
informasi darimana url letak gambar yang akan ditampilkan tersimpan.
![Page 6: Multimedia pada Halaman Web](https://reader036.vdocuments.site/reader036/viewer/2022081800/587280ef1a28abc7068b634d/html5/thumbnails/6.jpg)
Cobalah copykan gambar ke dalam satu folder file html yang anda buat untuk menampilkan gambar. Letakkan kode berikut di tengah tag <body>.
![Page 7: Multimedia pada Halaman Web](https://reader036.vdocuments.site/reader036/viewer/2022081800/587280ef1a28abc7068b634d/html5/thumbnails/7.jpg)
<img src="hery.jpg" />
hery merupakan nama filenya..jpg merupakan ekstensi file.
Jika diluar folder maka beri tanda ../nama_folder/filename.jpg.
![Page 8: Multimedia pada Halaman Web](https://reader036.vdocuments.site/reader036/viewer/2022081800/587280ef1a28abc7068b634d/html5/thumbnails/8.jpg)
Background Sound
Tag <bgsound> memungkinkan suara dimainkan di latar belakang. Dapat diterapkan baik pada audio maupun video.
![Page 9: Multimedia pada Halaman Web](https://reader036.vdocuments.site/reader036/viewer/2022081800/587280ef1a28abc7068b634d/html5/thumbnails/9.jpg)
Atribut yang digunakan pada tag bgsound berupa src dan loop.
Src digunakan untuk menentukan nama file suara atau video.
Sedangkan loop digunakan untuk mengulang sebanyak nilai yang ditentukan apabila suara telah habis diputar.
![Page 10: Multimedia pada Halaman Web](https://reader036.vdocuments.site/reader036/viewer/2022081800/587280ef1a28abc7068b634d/html5/thumbnails/10.jpg)
<html><head><title>musik</title></head><body>Ingin mendengarkan background music<br><bgsound src = “E:\lagu\midi music\Zodiac.mid” loop = “2”></body></html>
![Page 11: Multimedia pada Halaman Web](https://reader036.vdocuments.site/reader036/viewer/2022081800/587280ef1a28abc7068b634d/html5/thumbnails/11.jpg)
Format Tampilan File Audio, Video, dan Animasi
Untuk bisa menampilkan audio dan video digunakan elemen HTML "embed".
<embed> merupakan tag dari HTML embed.
![Page 12: Multimedia pada Halaman Web](https://reader036.vdocuments.site/reader036/viewer/2022081800/587280ef1a28abc7068b634d/html5/thumbnails/12.jpg)
Berikut adalah contoh sederhana penggunaan elemen ini untuk memainkan file audio berformat midi.
<embed src="nama_file.mid" width="100%" height="60" > </embed>
![Page 13: Multimedia pada Halaman Web](https://reader036.vdocuments.site/reader036/viewer/2022081800/587280ef1a28abc7068b634d/html5/thumbnails/13.jpg)
Tipe-tipe media VideoTag <embed> mendukung tipe-tipe berikut :
.swf adalah file yang dibuat dengan macromedia flash.
.wmv adalah file format dari Windows Media Video.
.mov adalah file format dari Quick Time milik Apple.
.mpeg adalah file format yang dibuat oleh Moving Pictures Expert Group.
![Page 14: Multimedia pada Halaman Web](https://reader036.vdocuments.site/reader036/viewer/2022081800/587280ef1a28abc7068b634d/html5/thumbnails/14.jpg)
Format Tampilan Gambar dengan Map
Tag map dalam pengkodean html memang disediakan untuk mengkayakan konten dalam sebuah website. Seperti website dangan konten berisi peta yang bisa disorot dan diklik pada bagian-bagian tertentu. Disinilah tag map ini digunakan.
![Page 15: Multimedia pada Halaman Web](https://reader036.vdocuments.site/reader036/viewer/2022081800/587280ef1a28abc7068b634d/html5/thumbnails/15.jpg)
<img src="petaku.jpg" width="400" height="300" alt="Peta" usemap="#petaku"><map name="petaku"><area shape="rect" coords="33,37,147,128" href="bingkai_foto.htm" alt="Bingkai_Foto" title="Bingkai_Foto">
![Page 16: Multimedia pada Halaman Web](https://reader036.vdocuments.site/reader036/viewer/2022081800/587280ef1a28abc7068b634d/html5/thumbnails/16.jpg)
<area shape="circle" coords="293,83,57" href="bola.htm" alt="Bola" title="Bola">
<area shape="poly" coords="164,156,219,161,243,207,243,235,267,259,193,288,118,257,118,241,142,233,140,208" href="rumah.htm" alt="Rumah" title="Rumah">
</map>
![Page 17: Multimedia pada Halaman Web](https://reader036.vdocuments.site/reader036/viewer/2022081800/587280ef1a28abc7068b634d/html5/thumbnails/17.jpg)
Hasil