Jeden zo základných elementov HTML jazyka, možnosť vkladať obrázky <IMG>, nie tak úplne patrí medzi multimédia, ale zakladať vlastnú kategóriu by bolo zbytočné. Webstránky sa dajú ľahko rozšíriť o obrázok, ktorý nemusí slúžiť iba ako ilustrácia na spríjemnenie obsahu, alebo znázornenie. Vhodnou kombináciou značiek sa dá použiť aj ako súčasť ovládacích prvkov.

Základné použtie značky img je:

<img src="/images/obrazok.jpg">

Odporúča sa pri značke IMG používať popisok obrázka z dôvodu vysvetlenia, čo sa na obrázku nachádza, ale aj pre prípad, že sa návštevníkovi vašich stránok nezobrazujú obrázky.

<img src="/images/obrazok.jpg" alt="Popisok obrazka">

Vhodné je uvádzať aj ďalšie parametre obrázka, ako je jeho výška(height) a šírka (width). V prípade, ak sa zobrazuje webstránka postupne, nebude text bez zobrazených obrázkov rozhádzaný.

<img src="/images/obrazok.jpg" width=200 height=320 alt="Popisok obrazka">

Umiestnenie v rámci odstavca v pozdĺžnej osi môžete meniť atribútom align a hodnotami: left, center, right.

“Background Sound” je špeciálna značka používana (iba?) v Microsoft Internet Explorer. Umožňuje spustiť prehrávanie zvuku na pozadí. Príklad použitia značky pre jedno prehratie:

<bgsound src="helloo.wav">

Atribúty:

• SRC - povinný, ukazuje na zdroj / umiestnenie hudobného súboru (WAV, MIDI, …)
• LOOP - nepovinný, počet prehrávaní, môže byť buď číselná hodnota, alebo INFINITE pre nekonečnú slučku

Pre tri prehratia:

<bgsound src="helloo.wav" loop="3">

Pre nekonečnú slučku:

<bgsound src="music.mid" loop="infinite">

Túto značku neodporúčam používať lebo to nie je štandardná značka používaná všetkými internetovými prehliadačmi.

Značka embed sa používa na vloženie multimedialného prehrávača, napríklad na zvukový súbor do obsahu webstránky. Táto značka bohužiaľ nebola schválená ako štandardná značka jazyka HTML ani XHTML, preto ju nemusia vedieť zobraziť všetký internetové prehliadače, ale väčšina ju našťastie používa.

<embed src="muzika.mid">

Atribúty:

• SRC - umiestnenie súboru
• WIDTH - šírka vloženého prehrávača
• HEIGHT - výška vloženého prehrávača
• ALIGN - umiestnenie
• NAME - meno vloženého objektu
• PLUGINSPAGE - odkial získať plug-in
• PLUGINURL - umiestnenie JAR archívu pre automatickú inštaláciu
• HIDDEN - je objekt skryty ?
• HREF - vytvorí objekt ako odkaz (link)
• TARGET - rámec (frame) pre zobrazenie obsahu
• AUTOSTART - automaticke spustenie filmu / hudby
• LOOP - koľko krát sa opakuje film / hudba
• PLAYCOUNT - ako LOOP
• VOLUME - hlasitosť prehrávania
• CONTROLS - aké ovládacie prvky zobraziť
• CONTROLLER - majú byť zobrazené ovládacie prvky?
• MASTERSOUND - hlavná hlasitosť
• STARTTIME - od kedy spustiť prehrávanie ?
• ENDTIME - kde skončiť prehrávanie ?

Príklad použitia:

<embed src="muzika.mid" height="60" width="144">

Značka VIDEO sa nachádza v novej pripravovanej verzii HTML 5. V podstate ma veľmi podobne atribúty ako už spomenutá značka embed. Je určená na vloženie iba video súboru do webstránky. Video súbor nemôže byť akéhokoľvek formátu (tzv. kontainer), ani akéhokoľvek kódeku, či už audio alebo video. Preferované kombinácie sú (video/audio/kontainer):

• Theora+Vorbis+Ogg
• H.264+AAC+MP4
• WebM

Od Januára 2010 podporuje skúšobnú prevádzku svojej webstránky so značkou VIDEO aj portál Youtube, cez aktiváciu na tejto stránke: http://www.youtube.com/html5 . Použitý kontainer je MP4 s kódovaním H.264.

Funkčnosť značky HTML5 video si môžete overiť na webovej stránke http://www.double.co.nz/video_test/test4.html na trajlery filmu Transformers vo videoformáte OGG.

Najjednoduchší zápis značky VIDEO musí obsahovať aspoň umiestnenie zdrojového súboru s videom.

<video width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
  Your browser does not support the video tag.
</video>

Atribúty:

• AUTOPLAY - Pre automatické spustenie prehrávania filmu, zadajte TRUE
• CONTROLS - Pre zobrazenie ovládacich prvkov, zadajte TRUE
• END - Umiestnenie vo zvukovej stope, kedy sa ukončí prehrávanie
• HEIGHT - výška prehrávača
• LOOPEND -
• LOOPSTART -
• PLAYCOUNT -
• POSTER - Obrázok, ktorý sa zobrazuje, kým sa nenačíta (nespustí prehrávanie) videosúboru
• SRC - umiestnenie zdroja (videosúboru)
• START - Číselná hodnota, kde vo zvukovej stope sa začína prehrávanie.
• WIDTH - šírka prehrávača

Detailnejší zápis značky video:

<video width="590" height="332" controls>
  <source src="umiestnenie/subor.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
  <source src="umiestnenie/subor.ogg" type='video/ogg; codecs="theora, vorbis"'>
</video>

Pre zjednodušenie stačí napísať iba:

<video width="590" controls>
  <source src="umiestnenie/subor.ogg" type="video/ogg">
  <source src="umiestnenie/subor.mp4" type="video/mp4">
  <!—kód pre flash prehravac -->
</video>

Podporu HTML5 vo vašom prehliadači (teda aj pre značku HTML) si môžete overiť na stránke http://html5test.com/.

1. Vytvorte hlavnú stránku (index.html), na ktorej budete mat odkazy na ďalšie 3 podstránky, jedna podstránka bude galéria obrázkov, druha bude zoznam videí (niečo na spôsob youtube) a posledná bude zoznam hudby na prehrávanie.
2. Prvá podstránka (obrazky.html)bude obsahovať 10 obrázkov, na šírku bude obrázok 600px ,bude mať popisok a bude centrovaný. Zároveň na každý zmenšený obrázok nastavte odkaz odkazujúci priamo na obrázok (po kliknutí sa zobrazí obrázok v originálnej veľkosti).
3. Druhá podstránka (video.html)bude obsahovať aspoň 5 videí podľa HTML 5. Každé video bude mať na šírku 600px a bude obsahovať ovládacie prvky. Ako zdroj videí môžete použiť webstránku umožňujúcu sťahovať video obsah z najznámejších portálov: http://dearchivator.com/ .
4. Tretia podstránka (hudba.html)bude mať obsahovať aspon 5 hudobných súborov (mp3), dĺžka bude 600px a bude mať zobrazené ovládacie prvky.
5. Pre každú podstránku, nastavte hudbu na pozadí.
6. Úlohu odovzdajte najneskôr do 12:00 formou odoslaného zabaleného súboru vo formáte ZIP s menom v tvare: multimedia-vasepriezvisko.zip na ftp://server/incoming
7. Nezabúdajte dodržiavať štruktúru HTML súboru.