STYLE PADA MULTIMEDIA INTERAKTIF

Informasi memegang peranan penting dalam berbagai bidang kebutuhan menusia, sehingga dunia teknologi dapat berkambang dengan pesat. Informasi tersebut tidak terlepas dari perkembangan teknologi yang membuat segalanya lebih dinamis dan efisien.

pada umumnya, untuk membuat Multimedia Interaktif dengan tampilan menarik beserta kemudahan dalam mengubah tampilan layar berkaitan erat dengan kinerja style CSS (Cascading Style Sheet). CSS juga dapat diterapkan pada elemen-elemen HTML Multimedia diataranya pada Teks, Gambar, Audio dan Video.

  1. Pengaturan Style pada Teks
    Dalam pengaturan style teks meliputi beberapa jenis rangkaian properti, diantaranya pewarnaan, spasi, jenis font, style font, color font, dan sebagainya, yang dapat dikondisikan dalam kemasa CSS. Beberapa properti CSS antara lain sebagai berikut :
    Tabel Properti CSS
    NoPropertiKeterangan
    1ColorMengatur warna pada teks/ script yang hendak dituju
    2DirectionMenentukan arah tulisan atau teks pada script terkait
    3Letter-SpacingMenambah atau mengurangi properti dari spasi antarkarakter dalam suatu teks
    4Line-HeightMengatur tinggi barisnya suatu teks
    5Text-alignBertugas memberi rata atau batas teks secara horizontal
    6Text-decorationMenentukan hiasan/ dekorasi pada teks
    7Text-indentBertugas mengatur jarak inden dalam baris pertama dalam teks blok
    8Text-ShadowBertugas menentukan efek dari bayangan pada suatua teks
    9Text-transformBertugas mengatur dari teks kecil hingga besar
    10Unicode-alignBertugas mengeset unicode
    11Vertical-alignMengatur dari batas teks seacara horizontal
    12White-spaceMengatur dari penulisan white-space pada suatu elemen
    13Word-spacingMenambahkan atau mengurangi spasi antarkata dalam teks
  2. Pengaturan Style pada Tampilan Gambar
    Style sangat berperan dalam menyajikan suatu sinformasi visual agar terlihat lebih baik serta lebih optimal jika dilihat dari sisi nonpenulisan, sehingga lebih disukai oleh mesin pencari (search engine). Dalam hal ini penggunaan Cascading Style Sheet (CSS) dapat diterapkan pada semua objek yang ingin disisipkan dalam bentuk tag-tag tertentu, misalnya bentuk tulisan, tabel, gambar, maupun objek lainnya. Guna memberi pengaturan dalam penggunaan gambar pada umumnya dapat diterapkan secara inline, misalnya dengan format pemanggilan berikut.
    <img src=’nm-filegbr’ width=’lebargbr’ height=tinggigbr’alt=’kata-kuncigbr’ title=’judulgbr’ border=’garistebal’ />

     

  3. Pengaturan Style pada Tampilan Audio
    Sebuah halaman website yang dibuka adakalanya diiringi denga nmusik (audio) dengan menambahkan elemen untuk memanggil file musik didalamnya. Beberapa atribut yang dapat digunakan pada elemen suara, yaitu sebagai berikut.
    NoPropertiKeterangan
    1BalanceMengatur keseimbangan suara kiri dan kanan
    2LoopBanyak perulangan main yang dilakukan
    3VolumeMengatur Volume suara
    Dalam hal ini, elemen yang digunakan adalah tag <bgsound> dengan atribut "src" nama dile suara. Misalnya <bgsound src="musikakustik.wav">. Disamping elemen tag <bgsound>, terdapat elemen <embed> yang dapat digunakan untuk memanggil file suara. Elemen tersebut membutuhkan atribut "src" untuk menentukan file suara yang akan dimainkan pada halaman website, misalnya <embed src="musikakustik.wav"></embed>. Penggunaan elemen <embed> secara otomatis memunculkan "control panel" pada aplikasi multimedia yang terpasang pada sistem, sekaligus sebagai aplikasi default dalam memainkan file multimedia. Beberapa jenis atribut yang dapat digunakan pada elemen <embed> adalah sebagai berikut.

    No

    Atribut

    Keterangan

    1

    Align

    Mengatur posisi kontrol multimedia

    2

    Alt

    Menampilkan informasi alternatif

    3

    Height

    Mengatur tinggi kontrol

    4

    Width

    Mengatur lebar kontrol

    5

    Autostart

    Nilai true untuk dimainkan otomatis, false untuk manual

    6

    Hidden

    Nilai true untuk menyembunyikan kontrol

    7

    Loop

    Nilai true untuk mengulang terus-menerus



  4. Pengaturan Style pada Tampilan Video
    Salah satu contoh paling mudah melihat style jenis ini dapat ditemukan pada video amded dari Youtube secara langsung dari fitur online yang di-frame/embeded-kan pada website youtube ataupun web video lainnya.
    Contoh perintah-perintah script yang digunakan adalah sebagai berikut :

<html>
<head>
<title>Tampilan video dari YOUTUBE</title>
<style>
.video Wrapper {position: relative;

padding-bottom: 50%;
padding-top: 20%;
height: 0;

.video Wrapper iframe {position: absolute;

top: 0;
left: 0;
width: 100%
height: 100%}

</style>
</head>
<body>
<div class='video Wrapper'>
<!--Tampilan video dari YOUTUBE --!>
<iframe width='590' height='379' src='https://www.youtube.com/watch?..........'frameborder='0' allowfullscreen></iframe>
</div>
</body>
</html>