Multimedija na Internetu

VISOKA TEHNIČKA ŠKOLA NIŠ

SEMINARSKI RAD Multimedija na Internetu Predmet: Napredne Internet i WEB tehnologije

Mentor:

Student:

Veličković Zoran

Pavlović Milan RTs 24/10

Niš, 2011

2

Multimedija Multimedija na Internetu Sadržaj Sadržaj .............................................. ..................................................................... .............................................. .............................................. ........................................ ................. 1 1. Uvod .......................................................... ................................................................................. .............................................. .............................................. .......................... ... 2 2. Tekst ………………………….. .................................................. ......................................................................... ..................................... .............. 3 3. Slika …………………………................................................ …………………………....................................................................... ........................................... .................... 6 4. Zvuk ………………………………………….. .................................. ......................................................... .............................. ....... 10 5. Video ……………………………… …………... ................................. ........................................................ ............................ ..... 14 6. Zaključak ........................................... .................................................................. .............................................. ............................................... .................................. .......... 19 7. Literatura .......................................................... ................................................................................. .............................................. ........................................... .................... 20

Multimedija na Internetu

- Uvod -

1. UVOD Multimedija je zajednički naziv za medije koji kombinuju više tipova pojedinačnih medija, da bi se stvorila jedna celina. U običnom govoru multimedija najčešće znači interaktivni računarski projekat u kome se koristi film, f ilm, tekst i zvuk. Multimedija je već duže vreme oko nas i upotreblj upotrebljava ava se u različitim različitim okolnosti okolnostima, ma, uključuju uključujući ći korporacij korporacijske ske prezenta prezentacije, cije, edukativ edukativne ne aktiv aktivnos nosti ti i reakci reakciju ju u obliku obliku video video igara. igara. Smatra Smatra se da je multim multimedi edija ja postal postalaa fenome fenomenn savremenog društva, koga posmatramo kao sredstvo u procesu interakcije čoveka sa okruženjem. Multim Multimedi edija ja svojim svojim postoj postojanj anjem em i napret napretkom kom posta postavlj vljaa nove nove izazov izazovee i granic granicee razvoj razvojuu tehnologije, jer se pojavljuje potreba za bržim prenosom signala, efikasnijim načinom kodiranja i kvalitetnijim prikazom. Multimedija nalazi široku primenu skoro u svim oblastima a jedan od njih su i Web prezentacije. U ovom radu pokušaću da objasni na koji način je moguće da se multimedijalni sadržaj prikaže na jednoj HTML strani i kako će on uticati na vizuelni doživljaj korisnika.


- Tekst -

2. TEKST Čitači HTML dokumenta prikazuju tekst stranice u svom podrazumevanom fontu i stilu, podrazumevane podrazumevane boje i veličine. Upotrebom početne i završne oznake i definiše se kako će izgledati tekst na web stranici. Savremeni način promene izgleda teksta se ostvaruje primenom CSS pravila. >

Atributi navedeni unutar početne početne oznake nalažu nalažu čitaču weba na koji način da prikažu tekst tekst iz HTML fajla. Atribut „color“ određuje boju teksta. Vrednosti ovog atributa mogu biti simboličke (yellow, red, green...) ili heksadecimalne vrednosti (#00C000, #FF0000, #990000“...). Atribut „size“ određuje veličinu fonta. Atribut „face“ određuje ime fonta kojim će se ispisati tekst (npr. Times New Roman, Arial, Helvetica...) Ako traženi font nije instaliran na računaru posetioca weba, čitač će ignorisati ovaj atribut i zameniti ga podrazumevanim fontom. Pored ovih atributa u HTML-u postoje i nekoliko oznaka za formatiranje teksta koji se mogu koristiti za menjanje izgleda teksta. Formatiranje teksta može se obavati unošenjem početne oznake formata na sam početaka teksta. Najčešće oznake koje se koriste su : >PREDMET: b> Tekst koji se nalazi između ovih oznaka biće prikazan polucrnim fontom. MENTOR: Tekst koji se nalazi između ovih oznaka biće prikazan kurzivom. STUDENT: Tekst koji se nalazi između ovih oznaka biće podvučen. Čitač weba kontroliše podrazumevane vrednosti boja, veličine i fonta. Povratak ispisivanja teksta na podrazumevani font obezbeđujemo stavljanjem završne oznake na kraju teksta koji ste menjali atributima oznake . Takođe treba napomenuti da postavljanje teksta na željenom mestu na web stranici zna da predstavlja problem, zbog ćega se često koriste tabele u kojima se ubacuje tekst. U nastavku rada prikazan je slika prve vežbe za uređene teksta i kompletan kod:


- Tekst -

Slika 1. Vežba 1 – tekst

>

> <meta http-equiv ="Content-Language" content content="en-us"> ="en-us"> <meta http-equiv ="Content-Type" content content="text/html; ="text/html; charset=windows-1252"> >

>

< ="left">< ="Arial">NAPREDNE INTERNET I WEB TEHNOLOGIJE

> ="Arial"> ="#000000"> > >


- Tekst -

> > > >
< ="center">< ="#990000">< > ="index.htm"> color ="#990000">TEKST TEKST < ="center">< ="#990000">< > ="zvuk.htm"> color ="#990000">ZVUK ZVUK < ="center">< ="#990000">< > ="slika.htm"> color ="#990000">SLIKA SLIKA < ="center"> ="video.htm"> ="#990000">VIDEO VIDEO
>
="center">
< ="center">PREDMET: Napredne Internet i WEB tehnologije

< ="center">MENTOR: mr. ="hr">Veli Velič čkovi ković ć Zoran

< ="center">< ="hr">STUDENT: Pavlović Pavlovi ć Milan

< ="center">< ="hr">BROJ INDEKSA: < >RTs 24/10

="center">
="center">
="center">
< ="center"> ="hr">Visoka Visoka tehnič tehni čka ka škola Niš
>
> >

>


- Slika -

3. SLIKA Glavni cilj kada radite sa grafikom je da zadržite odgovarajuće veličine a da pritom ne žrtvujete kvalitet. Razumevanje postojećih formata fajlova koji se koriste za grafiku na webuje osno osnova va.. Osim Osim toga toga,, jeda jedann od bitn bitnih ih fakt faktor oraa za kons konstr trui uisa sanj njee web web sajt sajtaa je potr potreb ebaa za visokokvalitetnom visokokvalitetnom dobro dizajniranom grafikom. GIF je format fajla koji upotrebljava tip kompresije koja se naziva “lossless” (najmanji gubitak kvaliteta). Kompresija je bazirana na komplikovanom matematičkom algoritmu koji radi tako šro proverava koliko slika upotrebljava istu boju. GIF je ograničen na maksimalno 256 boja, pa je prema tome rezultujući numerički obrazac veoma specifičan. Ako imate 15 nijansa plave u okviru grafike koja je snimljena u GIF formatu, to se prevodi u 15 pojedinačnih šablona. Ako postoje više od 256 nijansi algoritam kompresije mora da odluči koja nijansa će biti izostavljena. Ovo se određuje ograničavanjem boje koja se najmanje pojavljuje. JPEG dozvoljava visoki kvalitet kompresije, dok istovremeno može da sadrži milione boja. JPEG definiše “lossy” metod kompresije. Algoritam se bazira na uklanjanju podataka za koje se ispostavlja da su nebitne, a prazna mesta se popunjavaju informacijama koje treba da budu sačuvane. JPEG metod izvodi ovu kompresiju tako što deli podatke na slici na pravougaone delove pre nego što se primeni algoritam. JPEG format je dizajniran pre svega za rad sa fajlovima koji imaju veliki broj boja. PNG format je definisan tokom 1995, i 1996, godine da bi bili nadvladani problemi zbog autorskih prava GIF formata koji je tada postojao. Kao i GIF, PNG upotrebljava “lossless” kompresiju. Jedna od velikih prednosti po kojoj PNG nadmašuje GIF kompresiju je mogućnost smeštanja slike koja obuhvata alfa kanal. Ovo omogućava odgovarajuće smanjivanje prelaza, eleminišu se oštre ivice oko fontova i slika i dozvoljava se kreiranje transparentnih slika. Dodava Dodavanje nje slike slike na web strana stranama ma je prvi prvi korak korak napred napred od jednos jednostav tavnog nog forma formatira tiranja nja dokumenta u svetu dizajna. Slike dodaju indetitet, boju, oblik i prisustvo. Upotrebom oznake možete postaviti sliku na web stranicu. Da biste prikazali sliku oznaka treba da sadrži atribut „src“, koji šitašu predočava putanju do datoteke sa traženom slikom. Mnogi atributi moga da budu dodati oznaci “img” da bi bio kontrolisan način na koji pretraživač kontroliše sliku. Ovi atributi obuhvataju sledeće:


-

- Slika -

src= src=”x ”x”” - Ovo Ovo je atrib atribut ut ya iyvo iyvorr koji koji se upot upotre rebl blja java va ili sa apso apsolu lutn tnim im ili relati relativn vnim im URL-om koji ukazuje na lokaciju slike.

-

width= width=”x” ”x” – Ovim atrib atributo utom m se dozvolj dozvoljav avaa da pretraživ pretraživač ač predde preddefin finiše iše širinu širinu koja koja je potrebna za sliku.

-

heigh height=” t=”x” x” – Ovim Ovim atributo atributom m se dozvolja dozvoljava va da pretraž pretraživa ivačč preddefi preddefiniš nišee visinu visinu koja je potrebna za sliku.

-

border=”x border=”x”” – Ovaj Ovaj atribut atribut se koristi koristi za dodav dodavanje anje ili uklanja uklanjanje nje okvira okvira oko oko slike. slike.

-

align= align=”x” ”x” – Možete Možete da poravna poravnate te sliku sliku na strani strani horizont horizontaln alnoo i vertik vertikaln alnoo upotrebo upotrebom m ovog atributa.

-

alt=”o alt=”opis pis slike slike”” – Ovaj Ovaj atribut atribut obezbe obezbeđuj đujee tekst tekst za čitače čitače koji koji ne mogu da prika prikažu žu sliku. sliku. Rezervni tekst čitači koriste i kao tekst koji se prikazuje u blizini pokazivača miša na ekranu kada je on na slici.

-

hspace=”x hspace=”x”” – Horizont Horizontalni alni prosto prostorr se upotreb upotrebljava ljava za dodavan dodavanje je prostora prostora,, sa numerič numeričkom kom vrednošću oko horizontalne ose slike.

-

vspace=”x vspace=”x”” – Vertikalni Vertikalni prostor prostor defini definiše še razmak razmak slike uz vertik vertikalnu alnu osu.

="10">

U nastavku rada prikazana je slika prve vežbe sa postavljenim slikama i kompletan kod.


- Slika -

Slika 2. Vežba 1 – slika >


>


> ="Arial"> ="#000000"> > >


- Slika -

> > > >
< ="center">< ="#990000">< > ="index.htm"> < none"> color ="#990000">TEKST TEKST < ="center">< ="#990000">< > ="zvuk.htm"> < none"> color ="#990000">ZVUK ZVUK < ="center">< ="#990000">< > ="slika.htm"> < none"> color ="#990000">SLIKA SLIKA < ="center"> ="video.htm"> ="#990000">VIDEO VIDEO
> > ="images/Slika%2011.jpg"> ="images/Slika%2022.jpg"> ="images/Slika%2033.jpg">

> >
="center">
< ="center">< ="Arial"> ="hr">Visoka Visoka tehnič tehni čka ka škola Niš

>

>

>


- Zvuk -

4. ZVUK Postavljanje audio fajlova na web stranici može dodatno da “oživi” web sajt. Prilikom postavljanja audio fajlova treba obratiti pažnju na njegovu veličinu. Uvek treba smanjiti audio fajlove što je više moguće. Jedan od važnih faktora koji direktno utiče na veličinu fajla je kvalitet. Kvalitet zvučnog zapisa dosta varira i formati određenih fajlova su boji za bolji kvalitet audio zapisa. Viša frekvencija odmeravanja i rezolucija zahtevaju više prostora i veći propusni opseg. Morate da odlučite da li želite da žrtvujete prostor na disku i propusni opseg i korist kvaliteta audio fajlova. Audio zapisi dužine od jednog minuta koji je 8-bitni mono zapis, sa frekvencijom od 8 KHz ima veličinu oko 150 KB, a 16-bitni stereo fajl koji je odmeravan sa frekvencijom od 44.1 KHz može da ima do 10 MB. Ponekad će manji kvalitet audio fajla ispuni očekivanja posetilaca sajta. Audio formata koji se najviše upotrebljavaju su: - WAV Kao odgovarajući format za Microsfot i IBM, najviše se koristi na Windows platformi. Podržan jeod strane svih računara sa operativnim sistemom Windows, i svih popularnih web browsera. radi se o formatu baziranom na RIFF specifikaciji koja govori o načinu čuvanja (memorisanja) multimedijalnih datoteka.

- MP3 (MPEG) Jedan od svakako najraširenijih standarda zvučnih zapisa u svetu je svakako MP3 (MPEG-1 Audio Layer 3) format zapisa. To je tehnologija kompresije audio signala koja je u stanju da fajl za digitalni audio svede na oko 10% svoje veličine, uz samo neznatan gubitak u kvalitetu zvuka. - MIDI

Za razliku od drugih formata Musical Instrument Digital Interface (MIDI) nije specifikacija za digitalni audio zapis. MIDI datoteke neuporedivo su manje od svih pre spomenutih datoteka upravo zbog činjenice da se u MIDI datotekama čuvaju note i mnoštvo parametara, a ne uzorkovani zvuk. Naravno, zbog toga je kvalitet reprodukovanih MIDI zapisa daleko manji od uzorkovanog zvuka.


- Zvuk -

- RMF Rich Music Format je relativno nov format koji se se emituje na Beatnik programu. RMF RMF upotrebljava Java Script da bi dodao audio fajl web strani, a ti fajlovi su dosta mali i brzo se učitavaju. Ako korisnik nema ovaj program za emitovanje onda jednostavno neće da čuje muziku.

Postoje dva načina na koje može da se postave audio zapisi na Web sajt i koji će biti odgovarajući za pretraživače: upotrebom oznake sidra i pomoću elementa embed. Upotreba elementa sidra je ista kao i smeštanje linka u okviru dokumenta: Pusti sema.mp3"> Pusti pesmu

Ako upotrebljavate ovaj metod korisnici će moći da snime fajl na svoj računar. Ako želite da se audio zapis prikaže na strani sa ostalim sadržajem morate da upotrebite element embed. Upotreba oznake embed je slična kao i upotreba oznake img. Međutim oznaka embed zahteva da imate instalirane određene dodatke inače nećete moći da pustite pesmu.
sema.mp3"

type="application/x-mplayer2" type ="application/x-mplayer2" width width="300" ="300" height height="42" ="42" autostart="false" autostart ="false" loop loop="false" ="false" pluginspage ="http://www.microsoft.com/Windows/MediaPlayer/download/default.as ”> >

Atributi za oznaku embed i njihove vrednosti su sledeće: •

height=”pixel/percent”

Ovim atributom određujete visinu plejera na Web stranici. •

width=”pixel/percent”

Najbolje je da se širina kontroliše u pikselima, ali možete da navedete i procente da bi ste rekli pretraživaću koliko prostora strane treba da zauzme. •

autostart=”true/false”

Ako je vrednost true pesma će početi odmah pri učitavanju web strane. Ako je vrednost false korisnik mora da klikne na dugme da bi pustio pesmu. •

loop=”true/false”

Ako želite da se pesma stalno ponavlja podesite ovu vrednost na true. Ako želite da se pustite pesmu samo jednom a zatim da stane podesite ovu vrednost na false. •

pluginspage=”gohere.html”

Ovo vodi korisnike koji nemaju odgovarajuće pluginove na odgovarajuću stranu gde mogu da ih nađu.


- Zvuk -

U nastavku rada prikazana je slika prve vežbe sa plejerom preko kojeg može da se pusti pesma i kompletan kod.

Slika 3. Vežba 1 – zvuk >


>


> ="Arial">


- Zvuk -

="#000000"> > > > > > >
< ="center">< ="#990000">< > ="index.htm"> < none"> color ="#990000">TEKST TEKST < ="center">< ="#990000">< > ="zvuk.htm"> < none"> color ="#990000">ZVUK ZVUK < ="center">< ="#990000">< > ="slika.htm"> < none"> color ="#990000">SLIKA SLIKA < ="center"> ="video.htm"> ="#990000">VIDEO VIDEO
>
="center">
sema.mp3"

type="application/x-mplayer2" type ="application/x-mplayer2" autostart autostart="false" ="false" width width="300" ="300" height height="42" ="42" pluginspage ="http://www.microsoft.com/Windows/MediaPlayer/download/default.as p"> >
>
< ="center">< ="Arial"> ="hr">Visoka Visoka tehnič tehni čka ka škola Niš

>

>

>


- Video -

5. VIDEO Izbor video formata će zavisiti od odsta faktora, kao što su mogućnost platforme, editori koji se koriste za obradu i lično iskustvo. MPEG je format koji se najviše koristin na Webu. Ovo je i ujed ujedno no i naje najefik fikas asni niji ji form format at,, zato zato što što ima ima i najb najbol olje je tehn tehnik ikuu za komp kompre reso sova vanj nje. e. Dost Dostaa programera više voli QuickTime fajlove ili AVI fajlove zato što su obično manji i brže se preuzimaju. MPEG i QuivkTime fajlovi su ipak najbolji izbor jer je MPEG pre svega dosta rasprostranjen a QuickTime alati i danas su veoma popularni. AVI je ipak dosta okrenut Microsoftu i radi samo unutar IE pretraživača a podržava i neke druge. Ako želite da dodate video Web sajtu treba da eksperimentišete sa ovim fajlovima da biste i sami uvideli koji je format najbolji za korisnike. Takođe morate da razmotrite da svi alati za editovanje video zapisa ne odgovaraju svim formatima. Video formata koji se najviše upotrebljavaju su: - AVI Audio/Video interfejs se upotrebljava u Windows operativnim sistemima za obezbeđivanje audio i video zapisa, gde se audio zapis tretira kao važniji. Može se desiti da se ispuste neki kadrovi ali zvuk i dalje mora da postoji. Ovaj format radi na skoro svim Windows mašinama od onih vrlo slabih do najjačih. - WMV Za WMV potrebno je imati instaliran operativni sistem Windows i na njemu poslednju verziju Windows Media Player-a, programa s kojim se WMV može reprodukovati (i drugi programi mogu reprodukovati video zapise ako je na računaru instaliran odgovarajući video kodek, ali je obično slika nekvalitetna u tom slučaju, zbog Majkrosoftove politike softvera zatvorenog koda). Verzije WMV 7 i 8 su vlasnički, tek je verzija 9 slobodna za upotrebu. - MPEG Međunaradna organizacija za standarde je kreirala Moving Picture Expert Group (MPEG) format za audio i video kompresiju fajlova. MPEG koderi su omiljeni velikom broju korisnika weba. Tehnika kompresije stvara male fajlove koji su obično manji od svih ostalih a visokog su kvaliteta. Danas se

koriste MPEG, MPEG1, MPEG2 i MPEG4 a u razvoju su i još naprednije varijante ovog standarda (MPEG7 i MPEG21).


- Video -

- MOV MOV format je razvijen od strane Apple. MOV je čest format na Internetu i za njegovu reprodukciju potreban je QuickTime Player. Zbog toga da bi Windows pustio MOV format potrebno je instalirati dodatne komponente.

Postavljanje video zapisa na Web stranicu je slično kao i kod postavljanja audio zapisa. Jedan od načina da se postavi video jeste pomoću oznake

Multimedija na Internetu

Recommend Documents