Tuesday 1 November 2016

MODUL 3 - MULTIMEDIA PADA HALAMAN WEB

MULTIMEDIA PADA HALAMAN WEB
1.      HTML IMAGE
A.    MATERI
ELEMENT IMG
Element IMG befungsi untuk menampilkan gambar. Element ini tidak mempunyai tag penutup dan mempunyai attribute yaitu align, alt (teks alternatif jika gambar tidak tampil), border, height, width, hspace (jarak kosong posisi horizontal, vspace (jarak kosong posisi vertikal), src (lokasi dari gambar itu disimpan beserta nama file-nya).


Sintaks:
<img
   align="left"|"right"|"top"|"middle"|"bottom"
   alt="text"
   border="pixel"
   width="pixel"|"%"
   height="pixel"|"%"
   hspace="pixel"
   vspace="pixel"
   src="uri">
  
B.     PRAKTIKUM
1.      Tampilkan gambar image2.jpg dengan ukuran width dan height 160pixel dan border 8pixel :
Output
Nama file: latihan5_1.html

Tugas tambahan:
Letakkan gambar tersebut ke kanan, setelah itu ke kiri.

2.      Menampilkan gambar dan deskripsinya
Output

Nama file : latihan5_2.html

<html>
<head>
<title>Latihan5-2</title>
</head>
<body><img width="80" height="80" src="images/image2.jpg" align="left" border="8">
Kehadiran Web Teknisi Jardiknas dapat memudahkan penyebaran informasi antara Biro Perencanaan dan Kerja Sama Luar Negeri - dan anggota Teknisi Jardiknas. Keuntungan bila sistem jaringan informasi ini terbentuk, komunikasi antar Biro Perencanaan dan Kerja Sama Luar Negeri dan Provider dan anggota Teknisi Jardiknas akan lebih cepat terjalin, informasi dapat dengan cepat sampai dan tepat sasaran pula. Salam Pendidikan...! Dr. Ir. Gatot Hari Priowirjanto
</body>
</html>



3.      Menampilkan audio pada halaman web
Output

Nama file: latihan5_3.html


Catatan:
Sound = nama folder
Weslife – My Love.mp3 = nama file
4.      Menampilkan audio pada halaman web dilengkapi dengan button
Output

Nama file: latihan5_4.html

<html>
<head>
<title>Latihan5-4</title>
</head>
<body>

<audio id="player" src="sound/Westlife - My Love.mp3">
</audio>
<div>
  <button »
  onclick="document.getElementById('player').play()"> »
  Play
  </button>
  <button »
  onclick="document.getElementById('player').pause()"> »
  Pause
  </button>
  <button »
  onclick="document.getElementById('player').volume »
  += 0.1">
  Volume Up
  </button>
  <button »
  onclick="document.getElementById('player').volume »
  -= 0.1">
  Volume Down
  </button>
</div>
</body>
</html>

5.      Menampilkan video dalam halaman web
Output

Nama file: latihan5_5.html

 Catatan:
Format video yang dapat digunakan dalam web adalah .mp4 dan .oog

9 comments:

  1. Wah blog Anda sangat indah dan berwarna Sis. Selain itu saya sangat suka dengan pemaparan Anda tentang Multimedia pada halaman web. Disini Anda menjelaskan dengan simple sintaks apa saja yang digunakan untuk macam-macam file. Anda juga melampirkan contoh-contoh file, dari tiap jenis multimedianya. Itu sangat bermanfaat bagi saya Sis. Dengan begitu saya bisa jadi lebih mengerti menggunakan sintaksnya. Saya punya saran sedikit nih Sis. Tambahkan musik pada blognya agar para pembaca bisa lebih tertarik. Siapa tau musik yang didengarkan merupakan musik kesukaan para pembaca. Jadinya para pembaca lebih sering berkunjung ke blog Anda Sis. Terus buat karya yang lebih baik lagi ya Sis. Saya tunggu karya selanjutnya. Perkenalkan nama saya Tessa Hervika mari kunjungi website kampus saya https://www.atmaluhur.ac.id/

    ReplyDelete
  2. Alhamdulillah, akhirnya saya menemukan blog yang saya cari-cari yaitu tentang multimedia pada halaman web,ternyata setelah saya membaca blog anda mengenai cara memasukkan file berupa audio, gambar, video sangatlah mudah dan ini akan sangat membantu saya yang baru belajar ini.Saran saya mungkin bisa dibuat lebih menarik lagi misalnya pada gaya penulisannya dibuatkan animasi. Jadi pembaca yang melihatnya pun terkesan dan akan lebih sering mengunjungi website anda. Terus buat karya-karya yang menarik lagi ya, semoga lebih baik lagi. Perkenalkan Saya Mutia Amirah Rahim dan jangan lupa untuk kunjungi website kampus saya https://www.atmaluhur.ac.id/

    ReplyDelete
  3. Terimakasih telah membuat blog ini dengan adanya blog ini saya bisa lebih mudah belajar html multimedia seperti audio,gambar didokumen html,video.blog ini sangat membantu saya sebagai pemula untuk beljar html multimedia.perkenalkan nama saya kamelia kunjungi website kampus saya https://www.atmaluhur.ac.id.

    ReplyDelete
  4. Terima kasih kak untuk informasi artikelnya.karena ini saya dapat mengetahui bagaimana cara mudah belajar html multemedia seperti gambar,audio yang kakak buat,,sukses selalu kak saya tunggu artikel selanjutnya
    perkenalkan nama saya LAILATUL MARFU'AH
    Kunjungi website kampus saya https://www.atmaluhur.ac.id.

    ReplyDelete
  5. Hallo Min keren banget nih artikelnya membantu sekali bagi saya yang baru belajar tentang HTML Multimedia,sukses & semangat terus ya Min saya tunggu artikel terbaru lainnya
    salam kenal nama saya Margiana Rahayu
    kunjungu web kampus saya https://www.atmaluhur.ac.id/

    ReplyDelete
  6. makasih ya kak buat artikelnya :) artikelnya sangat membantu dalam membuat tugas dan artikelnya dapat dimengerti dan dipahami :) berkat artikel kakak aku lumayan mengerti mengenai HTML Multimedia...
    terus biki artikel yang keren lagi ya kak :)
    makasih kak :)
    perkenalkan nama saya Laila Huriana Anisah Rohmawati dari STMIK Atma Luhur
    website kampus saya di https://www.atmaluhur.ac.id/ :)

    ReplyDelete
  7. Terima kasih ilmunya kak, semakin canggih dunia membuat ilmu tentang komputer harus dipelajari , dengan artikel ini saya menjadi lebih mudah untuk mendalami html , semoga semakin sukses ya kak , perkenalkan saya Hadiyatan Nazilah , jangan lupa mampir ke website kampus saya ya kak https://www.atmaluhur.ac.id/

    ReplyDelete
  8. Terima kasih ilmunya kak, semakin canggih dunia membuat ilmu tentang komputer harus dipelajari , dengan artikel ini saya menjadi lebih mudah untuk mendalami html , semoga semakin sukses ya kak , perkenalkan saya Fiqkry al bawiki , jangan lupa mampir ke website kampus saya ya kak https://www.atmaluhur.ac.id/

    ReplyDelete
  9. Terimakasih telah membuat blog ini kak,dengan adanya blog ini saya bisa lebih mudah belajar html multimedia seperti audio,gambar didokumen html,video.blog ini sangat membantu saya sebagai pemula untuk beljar html multimedia.perkenalkan nama saya Genaro Miana,jangan lupa kunjungi website kampus saya https://www.atmaluhur.ac.id.

    ReplyDelete