Transcript Tehnologije za Web - Naslovna | Visoka poslovna škola

Tehnologije za Web
Kaskadni stilovi - CSS
Kaskadni stilovi (CSS)

HTML je izvorno projektovan kao strukturni jezik – nije napravljen
da upravlja izgledom stranice, već se pretpostavljalo:


Autor zadaje elemente stranice
Čitač Weba određuje kako će oni na ekranu izgledati

Sa podrškom za fontove, boje i druge vizuelne efekte, HTML je
postao alatka za dizajniranje Web strana

Kaskadni stilovi – uvedeni su s namerom da se jeziku HTML vrati
prvobitna namena – strukturiranje Web strana

Pomoću kaskadnih stilova odvaja se struktura od izgleda Web
strane
2
CSS

Kaskadni opisi stilova (CSS) predstavljaju skup odrednica (pravila)
pomoću koji se u potpunosti upravlja rasporedom i izgledom stranice

Opisi stilova omogućavaju pisanje naredbi za izgled i formatiranje u
zaglavlju Web stranice ili u spoljašnjoj datoteci, van HTML koda
kojim se zadaje sadržaj stranice

Nasuprot upotrebi tabela za raspoređivanje elemenata stranice, CSS
pravila su jednostavni tekstualni iskazi, pomoću kojih istovremeno
može da se raspoređuje i formatira jedan ili više elemenata

Stranica na kojoj su razdvojeni sadržaj i izgled lakše se održava i
ažurira
3
Metode izrade HTML dokumenata i
kaskadnih stilova
Metod
Primer
Prednosti
Mane
Ručno
Pisanje koda u
Notepadu
Autor ima veliku kontrolu nad
kodom. Moguće je odmah
pristupiti greškama, novim
HTML elementima i CSS
svojstvima.
Metod je spor. Podložan je
greškama. Zahteva odlično
poznavanje HTML elemenata i
svojstava CSS. Nema mogućnost
direktne vizuelne kontrole.
Prevođenje
Snimanje HTML
Brz. Pojednostavljuje
dokumenta iz
objavljivanje postojećih
drugog programa, dokumenata.
npr. Worda
Pisanje koda Program HomeSite
u specijalnom
programu za
obradu koda
Kod nastao na ovaj način obično
sadrži dosta grešaka. Zahteva
dodatno pročišćavanje, dodavanje
hiperveza.
Velika kontrola nad kodom. Brži Spor. Zahteva dobro poznavanje
od ručnog pisanja koda. Pruža
jezika HTML i CSS.
pomoć, upozorava na greške i
pomaže u pisanju struktuiranog
HTML koda i CSS.
Izrada strana Program
Autor radi direktno sa grafičkim
*WYSIWYG
What
You
See
Is
What You Get
u WYSIWYG Dreamweaver
i tekstualnim
objektima. Ne
Šta želite, to ćete i videti zahteva dobro poznavanje jezika
programima
FrontPage
HTML i CSS.
Često daje loš HTML kod i CSS.
Fino podešavanje izgleda strane
najčešće zahteva ručno uređivanje
HTML koda.
4
Programi za izradu Web strana
Program
Platforma Korisna adresa
Opis
Dreamweaver Windows, http://
Dobar alat za vizuelnu izradu Web strana sa
Macintosh www.macromedia.com ili usklađenim WYSIWYG* i mogućnostima
www.dreamweaver.com
uređivanja
PružaIsjaku
podršku
CSS i
*WYSIWYG
- Whatkoda.
You See
What
You Get
specifikaciji DHTML.
Šta želite, to ćete i videti
HomeSite
Windows http://www.allaire.com/
homesite
Ima neverovatne mogućnost iza upravljanje
kodom, lošu podršku za vizuelno uređivanje.
GoLive
Macintosh http://www.adobe.com/
Windows products/golive
Veoma popularan među korisnicima računara
Macintosh. Ima grafički interejs potpuno
prilagođen dizajneru. Generisani kod sadrži
greške, nije popularan među autorima koji
teže strogom poštovanju standarda.
FrontPage
Windows http://www.microsoft.
com/frontpage
Popularan među autorima malih lokacija i
dizajnerima kompanijskih prezentacija.
Znatno je poboljšan od prve verzije, ali još
ima reputaciju programa koji daje loše ili
Microsoftske strane.
5
Programiranje i izrada Web strana

Programiranje za Web može se podeliti u dve osnovne velike
grupe: klijentsko i serversko



Klijentske tehnologije su one koje se izvršavaju u klijentu, tj. u čitaču,
iako postoje i neke klijentske tehnologije, poput ActiveX kontrola, koje
se izvršavaju na klijentskom računaru, ali izvan čitača
Programi koji se izvršavaju na serveru su serverske aplikacije
Svakoj tehnologiji pripada određeno mesto i primena, njihovo
kombinovanje je najbolje rešenje
6
Klijentsko
programiranje
Klijentsko programiranje

Programi koji se izvršavaju na klijentskoj strani mnogo su brži od
programa na serverskoj strani


Nije potrebno prenositi podatke preko mreže da bi se prikazao rezultat
akcije
Klijentsko programiranje – nedostatak kontrole





Teško je odrediti kakvi će korisnici pristupati lokaciji
Koji će čitač korisnici koristiti,
Koja će svojstva čitača biti uključena
Koju vrstu procesora korisnik upotrebljava
Postoje korisnici koji isključuju podršku za skriptove ili koriste programe
koji se tek testiraju
8
Klijentsko programiranje
Klijentsko programiranje nije uvek efikasno
Pretpostaviti: da će sve ispravno raditi, ali napraviti i rezervnu varijantu
9
Active X

ActiveX je Microsoft-ova tehnologija za izradu malih komponenti
(kontrola) u okviru Web strane – nije programski jezik, već mnoštvo
integrisanih objekata napisanih na različitim jezicima u
Windowsovom okruženju.

ActiveX kontrole mogu biti programirane u više različitih
programskih jezika, uključujući Javu, Delphi, Visual Basic, C++ i
druge.

ActiveX objekti (kontrole) omogućavaju dodavanje programa Web
stranici za rešavanje mnoštva zadataka: od prikazivanja poruka do
generisanja zvučnih izlaza za tekst ili npr. mogućnosti prepoznavanja
govora u programima i Web stranicama.
10
Active X

ActiveX kontrole mogu biti izvršavane samo na Windows
operativnim sistemima.

ActiveX objekti nisu bezbedni, jer moraju da se nalaze na
korisnikovom disku da bi ga bilo moguće koristiti - imaju pristup
svim resursima sistema

Zlonamerni ActiveX objekat može uneti virus i oštetiti ili uništiti
podatke na disku korisnika
11
ActiveX

Ako korisnik poseti Web stranicu koja koristi ActiveX objekat, a
nema instaliran objekat na svom disku, Web server će pokušati da
ga pošalje na korisnikov računar


Zavisno od korisnikovih bezbednosnih podešavanja, čitač Weba će
prikazati okvir za dijalog, koji upozorava korisnika o preuzimanuju
ActiveX objekta
Preporuka: koristiti samo svoje objekte, one koje su napravili
poznati i pouzdani programeri i one koji su preuzeti sa pouzdanih
Web lokacija (kao što je Microsoft)
12
Java

Tehnologija kompanije Sun Microsystems

Java je razvojni jezik nezavisan od platforme, koji
omogućava pisanje programa i njegovu primenu na bilo kom
sistemu, čitaču ili OS koji podržava Java Virtualnu Mašinu
(JVM)
13
Java apleti

Web strane koriste male programe pisane na jeziku Java, koji
se nazivaju apleti i koji se preuzimaju i izvršavaju u samom
čitaču proširujući njegove mogućnosti

Apleti se pišu na jeziku Java,


prevode u bajt kod, koji je nezavisan od računara na kojem se
izvršava,
pokreće u okruženju samog čitača
14
Čitač preuzima Java aplete sa
Web servera
HTML kod Web
stranice, slike,
Java apleti
Zahtev čitača za
Web stranicom
čitač
HTML, slike,
Java apleti
server
15
Java apleti
Java apleti koriste generički bajt-kod koji čitač prevodi u kod specifičan
za mašinu – isti aplet radi na raznim tipovima mašina
Bajt-kod apleta
Windows radna stanica
Bajt-kod apleta
Java aplet
Linux radna stanica
Bajt-kod apleta
Mac radna stanica
16
Java apleti

Čak i na računarima sa brzim procesorom može izgledati kao
da se bajt kod izvršava sporije nego u normalno prevedenim
programima

JVM pre izvršavanja mora da interpretira bajt kod apleta

Zbog toga vlada mišljenje da je Java spora

Zapravo njena interpretacija može biti spora
17
Bezbednost Java apleta

Java apleti nisu samostalni izvršni programi – oni se pokreću samo
u okviru Web čitača

Javin bezbednosni model štiti korisnike od virusa i drugih
opasnosti iz programa preuzetih s Weba

Radi eliminisanja virusa i krađe podataka Java apleti:

ne mogu da pristupe resursima (posebno datotekama) koji se nalaze na
korisnikovom disku,
 ne mogu da pristupe svojstvima sistema,
 ne učitavaju datoteke,
 niti otvaraju mrežnu vezu sa bilo kojim računarom osim onog s kojeg
su preuzeti.
18
Java apleti štite rad diska i datoteka
Disk
Java aplet
Datoteke
19
JavaScript

JavaScript je skript jezik kojim Web dizajneri mogu da
automatizuju postupke unutar Web stranice

Skript jezik- jer omogućava pisanje skripta (niza naredbi) koje će
Web čitač izvršiti

Omogućava zadavanje grupe naredbi koje će čitač Weba izvršiti –
ali se ne koristi za pravljenje spoljnog programa koji se izvršava
nezavisno od čitača
20
JavaScript

JavaScript se ugrađuje u HTML Web stranice – nije potreban
poseban alat; može se koristiti isti program za uređenje teksta koji
se koristi za izradu Web stranice

Najpopularniji čitači Weba imaju ugrađenu podršku za JavaScript –
posetioci lokacije ne moraju instalirati dodatne programe na svoje
računare

JavaScript iskazi postavljaju se između oznaka <script> i
</script>, koje će ukazati čitaču Weba da izvrši JavaScript
iskaze umesto da prikaže tekst na ekranu
21
JavaScript

Iskazi skripta mogu se uokviriti HTML oznakama za
komentar (<!--..-->) kako bi se sprečilo da čitači koji ne
podržavaju JavaScript na ekranu prikažu iskaze skripta

Čitači koji ne podržavaju JavaScript ignorisaće oznake
skripta i sve što se nalazi između početne i završne oznake
komentara

Obrnuto, čitači koji podržavaju JavaScript ignorisaće oznake
komentara i izvršiti funkciju skripta
22
Sakrivanje skripta od čitača koji ne
podržavaju JavaScript
<script language=“JavaScript”>
<!-Document.bgColor=“lightyellow”;
Document.fgColor=“magenta”;
//-->
</script>
23
Dodatni programi za čitače

Dodaci su uvedeni da bi se rešio problem komunikacije i
integracije koji je postojao kod pomoćnih programa koji
nisu integrisani u čitač Weba već se izvršavaju u zasebnim
prozorima i vrlo loše komuniciraju sa čitačem

Dodaci su komponente koje se izvršavaju u okviru čitača, pa
se zato mogu lako ugraditi u Web stranu

Lako komuniciraju sa čitačem putem tehnologije kakva je
JavaScript
24
Dodatni programi za čitače

Proširivanje čitača pomoću dodataka ima i mane – korisnici
moraju pronaći i preuzeti dodatak. Instalirati ih i ponovo
pokrenuti čitač.

Za mnoge korisnike – komplikovano.

Da bi se olakšao postupak instaliranja neki popularni dodaci
poput dodatka za format Flash kompanije Macromedia, postali
su sastavni deo instalacije samog čitača.

Standardni dodaci – reprodukovanju multimedijskih sadržaja

Primeri: Macromedia Flash, Macromedia Shockwave, Adobe
Acrobat, RealVideo..
25
26
Dinamičko generisanje
HTML-a
Dinamičko generisanje HTML-a
HTTP protokol

Web čitači su namenjeni za prikazivanje Web stranica koje
im isporučuju odgovarajući Web serveri.

Struktura i izgled samih stranica se opisuje jezikom HTML.

Komunikacija između Web klijenta (tj. čitača) i Web servera
odvija se po standardnom HTTP (HyperText Transfer
Protocol) protokolu.
28
Statički i dinamički Web sadržaji

Jedino što klijent može da zatraži od servera je datoteka (fajl).

Na serveru je da tu datoteku pronađe (eventualno i modifikuje!) i
pošalje klijentu.

Web sadržaji koji se smeštaju na server vidljivi su klijentima kao
pojedine datoteke:

datoteke mogu biti unapred pripremljene (npr. u editoru kakav je
Macromedia Dreamweaver) i smeštene u fajl-sistem Web servera.
 Mogu biti i generisane “u letu” po prijemu zahteva klijenta na neki
poseban način;

U tom smislu, Web sadržaje (zapravo, datoteke) možemo podeliti
na statičke i dinamičke.

Klijent ne zna da li je datoteka koju je tražio generisana statički ili
dinamički.
29
Statički Web sadržaji

Statički Web sadržaji su datoteke koje su unapred smeštene u
odgovarajući direktorijum fajl-sistema Web servera i spremne su za
isporuku klijentima po njihovom zahtevu.
1) Klijent zahteva fajl
HTTP klijent
2) Sever učitava fajl iz fajlsistema i šalje ga klijentu
HTTP server
- Isporuka statičkih sadržaja -
30
Dinamički Web sadržaji

Dinamički sadržaji nisu uskladišteni unapred već se generišu za
svaki zahtev klijenta posebno.

U ovom slučaju server neće tražiti datoteku u okviru fajl-sistema;
server “zna” da je u pitanju dinamički generisana datoteka i poziva
odgovarajući potprogram koji će je generisati.

Najčešće nema potrebe ovako generisanu datoteku čuvati na
serveru
1) Klijent zahteva fajl
HTTP klijent
2) server generiše fajl i šalje ga klijentu; ne
snima ga u svoj fajl-sistem
HTTP server
- Isporuka dinamičkih sadržaja 31
HTTP komunikacija
Ukupna sekvenca aktivnosti klijenta i servera u HTTP komunikaciji
1.
2.
3.
4.
klijent otvara konekciju sa serverom
klijent šalje zahtev serveru
server vraća odgovor
zatvara se konekcija
32
HTTP komunikacija

Komunikacija između klijenta i servera zasnovana na
zahtev/odgovor principu.

Svaki par zahtev/odgovor smatra se nezavisnim od ostalih.

Recimo, u slučaju da prvi klijent pošalje zahtev serveru i dobije
odgovor, zatim drugi klijent pošalje zahtev i dobije odgovor, pa
potom ponovo prvi klijent pošalje novi zahtev, nema načina da se
ustanovi da je prvi klijent poslao dva zahteva (prvi i treći).

Server svaki zahtev opslužuje nezavisno od ostalih zahteva.
HTTP je stateless protokol: ne omogućava praćenje stanja
korisničke sesije između slanja više različitih zahteva.
33
Praćenje sesije korisnika

HTTP protokol ne omogućava praćenje sesije korisnika.

Kako bi se ovaj cilj ipak postigao definisano je pomoćno rešenje mehanizam slanja “kolačića” (cookies) između klijenta i servera

Uveo ga je Netscape Navigator, a kasnije je postao standardan
mehanizam za ovu namenu podržan od svih Web čitača i servera.

Šta je jedan cookie zapravo?

Možemo ga shvatiti kao string od tipično 20-30 nerazumljivih
znakova koji je namenjen za jednoznačno identifikovanje korisnika
na serveru.
34
Praćenje sesije korisnika

Prilikom slanja prvog zahteva server će ustanoviti da mu klijent
nije poslao cookie kao jednu stavku u zaglavlju zahteva.

U odgovor na taj zahtev server će dodati cookie.

Ukoliko je Web čitač podešen tako da radi sa cookie-ima, on će u
svim sledećim zahtevima koje bude slao tom serveru uključiti i
cookie, tako da će server moći da prepozna klijenta koga je već
ranije opsluživao.
35
Praćenje sesije korisnika
1) zahtev
HTTP klijent
2) odgovor+cookie
HTTP server
a) slanje prvog zahteva i prijem odgovora koji uključuje cookie
1) zahtev + cookie
HTTP klijent
2) odgovor+cookie
HTTP server
b) svi sledeći zahtevi sadrže cookie
36
Svrha kolačića

Glavna svrha kolačića jeste da sačuva informacije:
Oni se uglavnom koriste za čuvanje korisničkog imena i lozinke –
korisnik ne mora da ih unosi svaki put kada pristupi lokaciji
 Mogu se koristiti za čuvanje svih podešavanja koja je korisnik zadao
kada je poslednji put pristupao lokaciji


Sa programerske tačke gledišta:

Kolačići se koriste da reše probleme vezane za upravljanje stanjem –
problem stanja je povezan sa činjenicom da se između dve posete
lokaciji server ne seća korisnika
37
Upotreba kolačića

Nekim korisnicima se ne dopada kada neko prati njihovo ponašanje
na Webu, pa će oni isključiti kolačiće

Da bi se to izbeglo i steklo poverenje korisnika, autori Web lokacije
bi trebalo da sačine:

poseban dokument o privatnosti ili
 izjavu o upotrebi i tako obaveste korisnika za šta će kolačići biti
upotrebljeni
 samo jedan kolačić koji će istovremeno i da prati korisnika i da čuva
informacije o podešavanjima koja je on zadao – više kolačića zahteva
od korisnika niz potvrda, jer svaki mora biti prihvaćen
 alternativno rešenje za korisnike koji ne žele da prihvate kolačiće
38
Serversko
programiranje
Serversko programiranje

Serversko programiranje ima mnogo oblika, uključujući CGI
skriptove, serverske API program poput NSAPI (Netscape Server
Application Programming Interface) i ISAPI (Internet Server
Application Programming Interface) i Java programa, serverska
okruženja za skriptove, kakva su ASP kompanije Microsoft i
ColdFusion kompanije Allaire

Svaka tehnologija ima svoje prednosti i mane – zajedničko
svojstvo: kontrola

Server je jedini deo klijent-server arhitekture nad kojim autor
lokacije ima kontrolu
40
Serversko programiranje

Serversko programiranje ne primećuje razlike koje mogu da postoje
na klijentskoj strani,

Lokacija čija je interaktivnost bazirana na serveru, teoretski može
da isporuči sadržaj bilo kom čitaču

Razvoj interaktivnih elemenata, uprkos prednostima klijentske
tehnologije, za veliki broj lokacija sa velikim protokom podataka
oslanja se uglavnom na serverske tehnologije

Glavna mana serverske tehnologije je: brzina

Zbog kompletne interakcije koja se odvija na serveru može doći do
kašnjenja zbog:
 Opterećenosti servera ili
 Zagušenosti mreže za prenos podataka
41
CGI programi

Najstarija tehnologija za serversko programiranje: Common
Gateway Interface (CGI) programi

CGI omogućava Web serverima da pokreću programe kao odgovor
na HTTP zahteve

CGI specificira kako proslediti argumente programu koji će se
izvršiti kao deo HTTP zahteva

CGI omogućava da se vrati rezultat u HTML (ili nekom drugom)
formatu, i to u zavisnosti od parametara konkretnog zahteva
42
CGI programi
HTTP zahtev
Svaki HTTP zahtev, od strane korisnika, generiše novi proces na
serveru
43
CGI programi

CGI programi mogu da se pišu na svim jezicima koji mogu da se
koriste na serveru koji izvršava program

Najčešće se CGI programi pišu na jeziku Perl, zbog njegove
izuzetne mogućnosti za rad sa znakovnim nizovima i podrške za
Web

CGI programi mogu se pisati u bilo kom od sledećih jezika:

C/C++, Java, Visual Basic, pa čak i Pascal, Cobol ili Fortran
CGI programe treba pisati na jeziku koji je brz, prenosiv i koji
odgovara serveru što će ga izvršavati i programeru koji će ga pisati i
održavati.
44
CGI programi

CGI program mora da kreira posebni proces za svaki zahtev
posetioca, koji nestaje tek kada se u potpunosti završi transfer
podataka

Kreiranje nove instance programa zahteva dodatno vreme, OS treba
da učita program, alocira memorijski prostor, a nakon izvršenja da
dealocira i ukloni program iz memorije

Performanse – značajne – server opslužuje veliki broj istovremenih
zahteva

U serverskim programima veoma je važan bezbednosni aspekt
CGI programi se lakše mogu nadgledati i održavati ukoliko se
postave u jedan direktorijum
45
Java Servleti

Servleti - jedna od tehnologija za generisanje dinamičkih Web
sadržaja.

Da bi se servleti mogli koristiti, Web server mora da ima
odgovarajuću podršku za servlete.

Pisanje servleta je moguće samo u programskom jeziku Java, tako
da je za njihovo izvršavanje potrebna i JVM (koju najčešće
obezbeđuje Web server).
46
Životni ciklus servleta
Prvi zahtev
1.
POSETILAC
sevlet
kod
kreira novi
proces
2.
POSETILAC
...
N-ti
POSETILAC
Servlet prihvata i obrađuje
zahteve posetilaca
1
SERVER
sevlet
sevlet
kod
kod
2
SERVER
Uništi proces
SERVER
sevlet
kod
3
47
Prednosti Java Servleta

Efikasnost – prilikom prvog zahteva prema servletu, server mora
pokrenuti novi proces unutar Java virtualne mašine, ali za svaki sledeći
zahtev prema tom servletu, JVM kreira samo malu Java nit (eng. Thread)

Portabilnost – zbog prirode napiši jednom pokreni, bilo gde (eng. Write
once, run anywhere) Java idioma, servleti su portabilni na različitim
platformama
HTTP zahtev
prvi put novi proces
sledeći put samo
nova nit (thread)
48
Nedostaci Java servleta

Vidljiv nedostatak je i vezivanje za samo jedan programski jezik
– Java (što je važno samo za programere i ne smatra se nedostakom
tehnologije)

HTML kao izlaz iz servleta je priličan problem, jer je reč o
internom štampanju HTML koda iz servleta – teško čitljive i
složene izlazne naredbe, koje sadrže HTML i programski kod
ostatka aplikacije
49
Serverski skriptovi

Često nazivan “serverski HTML” ili “serverski skriptovi” – pridruživanje
programiranja Web stranama na relativno jednostavan i brz način

Cilj serverskih skriptova: izrada posebnih HTML datoteka ili šablona koji
sadrže smešu skripta i HTML elemenata, koje će server po potrebi učitati

Postoje mnoga okruženja za serverske skriptove:


PHP –Personal Home Page

ASP - Active Server Pages

ASP.NET

JSP - JavaServer Pages

ColdFusion..
Razlike su veoma male – glavna razlika između okruženja jeste sintaksa
50
Primer serverske analize HTML
dokumenta
HTTP zahtev
51
Primer serverske analize dokumenta
čitač
Web server
Zahtev za
dokumentom
Vraćanje
rezultujućeg
HTML dokumenta
Učitavanje
dokumenta
analiza
serverskog
skripta
HTML sa serverskim
skriptom
52
ASP

ASP ("Stranice aktivne na serveru", eng. Active Server Pages)
predstavlja jedan od skriptnih jezika za razvijanje Internet sajtova,
razvijen od strane kompanije Microsoft.

ASP nije programski jezik, već tehnologija koja omogućava
programiranje Web servera, dok programski jezik zavisi od izbora
autora.

Njegov glavni takmac na Internet tržištu je PHP, koji ima tu
osobinu da je besplatan i slobodan, dok su ASP i svi proizvodi
potrebni za njegovo korišćenje komercijalni i u vlasništvu
kompanije Microsoft.

Sa druge strane, Microsoft konstantno održava i dodaje nove
mogućnosti svom paketu, na taj način ga čineći modernim, čvrstim
i pružajući svojim klijentima svu moguću tehničku podršku.
53
Upotreba multimedije na
Web stranama
Multimedija na Web stranama

Multimedija može da unapredi i obogati izgled lokacije, ali ona ima
velike tehnološke i infrastrukturne zahteve

Ukoliko multimedijalni elementi neće pomoći korisnicima da lakše
koriste Web lokacije – ne bi ih trebalo koristiti

Veoma je važan način dodavanja multimedijskih sadržaja –
potrebno je koristiti poznate tehnologije koje neće predstavljati
barijeru za pristup lokaciji
55
Animacija

Animacije se na Webu koriste za:

Aktivne logotipe,
 Animirane ikonice,
 Prikaze i
 Kratke crtane filmove

Animacije ne treba međusobno da se nadmeću

Nakon izvesnog vremena korisnika animacije zamaraju – izbeći
animacije koje se neprekidno ponavljaju

Autorima su na raspolaganju mnoge tehnologije za izradu
animacija
56
Tehnologije za animaciju
Tehnologija
Opis
Animirane
sličice u
formatu GIF
Najjednostavniji oblik animacije i izvorno je podržana u većini Web
čitača. Ovakvoj animaciji može se zadati koliko će se puta ponoviti i
druge vremenske karakteristike, ali ostala napredna svojstva su izvan
dometa ove tehnologije.
Flash
Macromedijin Flash vodeći je format za kvalitetne animacije za Web.
Datoteke u ovom formatu su veoma male, mnogi korisnici imaju
instaliranu podršku za njih. Podržava ograničene mogućnosti
programiranja, mora biti dopunjen JavaScript-om.
Shockwave
Komprimovane datoteke Macromedijinog programa Director. Njihova
glavna prednost nad formatom Flash jeste u podržavanju složenog
programiranja. Mogu biti mnogo veće od datoteka u formatu Flash.
Java
Iako se može koristiti za animacije, nije preporučljivo. Jedina prednost
animacija izrađenih u Javi jeste što mogu da se izrade u letu na osnovu
složenih proračuna. Jedina razumna upotreba- na klijentskoj strani na
osnovu korisnikovih postupaka. Java je previše složena da bi se
koristila u jednostavnim animacijama.
57
Zvuk

Najnovije tehnologije za reprodukovanje zvuka preko
Interneta obuhvataju široku oblast, od tradicionalnog sistema
preuzmi-i-pusti u mnoštvu formata, do tehnologije strujećeg
zvuka koja reprodukuje zvuk u skoro realnom vremenu

Najnaprednije tehnologije nisu uvek najbolje rešenje
58
Osnove digitalnog zvuka

Digitalni zvuk meri se učestanošću uzorkovanja – time koliko je
puta zvuk digitalizovan u toku određenog vremenskog perioda

Učestanost uzorkovanja izražava se u kilohercima (kHz) – mera
broja uzorkovanja tokom jedne sekunde

Zvuk CD kvaliteta dobija se uzorkovanjem na 44,1 kHz – 44100
puta tokom jedne sekunde

Za stereo zvuk potrebna su dva kanala sa po osam bita – 16 bita po
uzorku zvuka – 705600 bitova za svaku sekundu zvuka CD
kvaliteta

U stvarnosti prenos tolike količine podatka zauzeo bi polovinu
kapaciteta propusne moći – što najčešće nije dostupno – potreban
drugi pristup za emitovanje zvuka CD kvaliteta preko Interneta
59
Formati i kompresija zvučnih datoteka

Datoteke koje sadrže zvuk mogu da se komprimuju da bi se brže
prenosile preko mreže

Program na strani servera komprimuje i isporučuje zvuk, dok ga
program na strani klijenta dekomprimuje i reprodukuje

Program za kompresiju i dekompresiju naziva se kodek

Formati zvuka mogu da narušavaju kvalitet zvuka ili da ga uopšte
ne narušavaju
60
Formati i kompresija zvučnih datoteka

Kompresija sa gubicima ne reprodukuje verno originalni zvuk – ali
je prihvatljiva jer daje male datoteke

Kompresija – kompromis između kvaliteta zvuka i veličine
datoteke – što je datoteka veća potrebno je i više vremena da se
prenese preko mreže

Kada se obrađuje zvuk – zadaje format datoteke, a ne način
kompresije
61
Formati za datoteke sa zvukom
Format
Opis
WAV
Wav datoteke su najčešći formati datoteka sa zvukom na Windows platformi.
MPEG
(MP3)
Format Motion Pictures Experts Group je standardni format sa velikim stepenom
kompresije. MPEG nivo 3, ili MP3 datoteke su najpopularniji oblik za distribuciju
muzike preko Interneta. Zbog svoje veličine, MPEG datoteke se pre reprodukovanja
najčešće kompletno prenesu na klijentski računar.
Ogg Vorbis
Ogg Vorbis je besplatan metod enkodiranja, kompresije i strimovanja digitalnog zvuka.
Za tačno 1/8 bolji je u brzini po bitovima i po svom kvalitetu u odnosu na MP3. Jedna
.ogg datoteka pri brzini 45 kb/s najčešće zvuči bolje od datoteke .mp3 pri brzini od 320
kb/s.
RealAudio
Dominantna tehnologija za strujeće reprodukovanje preko Interneta. Ona zahteva
poseban plejer, čije su osnovne verzije besplatne.
MIDI
Format Musical Instrument Digital Interface nije format digitalnog zvuka. On nosi
informacije o notama i druge bitne informacije na osnovu kojih muzika može biti
sintetizovana. Upotrebljive su samo za neke primene lošeg kvaliteta reprodukcije.
RMF
Rich Music Format podržava organizacija Beatnik. To je kompaktan format koji nudi
visok kvalitet reprodukovanja nakon preuzimanja datoteke. Postaje sve popularniji.
62
Jednostavan zvuk za Web

Najjednostavniji način da se kroz jezik HTML pruži podrška
pristupu preuzmi-i-pusti jeste povezivanje takve datoteke i
prepuštanje obrade pomoćnom ili dodatnom programu

Ako pomoćni programi ili dodatak nisu podešeni odluka o daljoj
akciji se prepušta korisniku

Da bi se povezala datoteka sa zvukom u formatu WAV, u HTML
datoteku dodaje se kod sličan sledećem:

<a href=“democompanyjingle.wav”>Demo Company+s
Corporate Jingle (7 second WAV – 180K) </a>
63
Jednostavan zvuk za Web

Kada se na Web stranu dodaje snimak poput govora ili delova radio
ili TV programa, uvek treba naznačiti dužinu, format i veličinu
datoteke sa zvukom

Ako se koristi pristup preuzmi-i-pusti najbolje je da datoteke koje
sadrže muziku niskog kvaliteta, zvučne efekte ili govor budu u
formatu WAV

Datoteke u formatu MIDI koristiti za pozadisnku muziku na Web
stranama, naročito ako je ograničena propusna moć

Format MPEG – a posebno MP3 – zaista je jedini izbor za
kvalitetnu reprodukciju, a posebno za reprodukciju muzike
64
Jednostavan zvuk u praksi

Čitači bi trebalo da podržavaju preuzimanje i reprodukovanje
zvučnih datoteka u formatu MIDI i WAV

Microsoftov Internet Explorer koristi sopstvenu HTML oznaku
<bgsound> ili oznaku <embed>

Na primer, da bi se podesio dodatak LiveAudio da reprodukuje
datoteku test.wav i da prikaže karticu za podešavanje zvuka,
upotrebiti sledeći HTML kod:

<embed src=“test.wav” height=“60”
width=“144”>
65
Jednostavan zvuk u praksi

<embed src=“test.wav” height=“60” width=“144”>

Zadavanje atributa height i width veoma je važno, jer bi u
suprotnomo čitač mogao da opseče konzolu

Podrazumevana LiveAudio kontrola visoka je 60 piksela i široka 144
piksela

Drugi stilovi za kontrolu imaju druge podrazumevane veličine

Postavljanje pozadinske muzike na Web stranu, moguće je upotrebom
sledećeg koda

<embed src=“test.wav” hidden=“true”
autostart=“true”>
66
Upotrebljivost i datoteke sa zvukom

Uvek obezbediti alternativni oblik pristupa podacima, jer podrška
za zvuk nije uvek na rapolaganju

Omogućiti korisnicima da isključe zvuk koji je upotrebljen na
lokaciji

Koristiti jednostavniju tehnologiju preuzmi-i-pusti koja je podržana
u mnogim čitačima – ne zahtevati od korisnika da instaliraju mnoge
dodatke za reprodukovanje raznih formata
67
Video

Mnoge kompanije pokušavaju da razviju emitovanje
televizijskog programa preko Weba


Emitovanje visokokvalitetnog video zapisa od 30 sličica u
sekundi
Većina dosadašnjih rešenja ne radi dobro sa propusnom moći
koja je na raspolaganju prosečnom korisniku
68
Osnove digitalnog videa

Digitalni video zapisi karakterišu se brojem snimljenih sličica u
sekundi i njihovom veličinom i rezolucijom

Video zapisi mogu da budu veoma veliki, a naročito ako se teži
PAL videu (televizijski kvalitet slike)

Video slika veličine 640 x 480 piksela sa 24-bitnom paletom boja i
30 sličica u sekundi zauzima 27 MB po sekundi - i to bez zvuka

Ako se tome doda i kvalitetni CD zvuk (705600 bitova za sekund
zapisa), datoteka će dvostruko narasti

U stvarnosti, prenos tolike količine podataka nije lak čak ni kada se
upotrebi kompresija
69
Formati datoteka sa video
zapisima i njihova kompresija
Format
Opis
AVI
Audio Video Interleave je format za digitalni zvuk i video za Windows.
Često se sreće i lako zadaje. Na Internetu je sve više datoteka u tom
formatu, bez obzira na to što mogu biti velike. IE se lako snalazi sa
datotekama u tom formatu.
MOV
(QuickTime)
MOV je nastavak imena datoteke koji označava format QuickTime
kompanije Apple. Verovatno najčešći format video zapisa, postaje sve
popularniji na Internetu. Različiti kodeci i poboljšanja učinili su
QuickTime moćnim rešenjem za digitalne video zapise.
MPEG
Motion Picture Expert Group format za video zapise smatra se
standardnim formatom za digitalni video. Iako su kompresija i kvalitet
slike formata MPEG na visokom nivou, ponekad je s njim teško raditi.
ASF
Advanced Streaming Format kompanije Microsoft isporučuje se
Microsoftovom serverskom tehnologijom NetShow koja se sada zove
Windows Media. Rastuća konkurencija formatu RealMedia, nudi visok
kvalitet i dobru podršku IE.
RM
RealMedia je dobar format tehnologije strujećeg videa. Datoteke u RM
formatu mogu biti snimljene u različitim kvalitetima u zavisnosti od toga
kolika propusna moć stoji na raspolaganju krajnjem korisniku.
70
Formati datoteka sa video
zapisima i njihova kompresija
Format
Opis
VCD
VideoCD (VCD) format pojavio se na azijskom tržištu koje nije želelo da za
reprodukciju videa na DVD plejeru plaća astronomske cene DVD konzorcijumu.
Kvalitet formata VCD bi mogao da se uporedi sa VHS kasetama – ni previše
dobar ni previše loš. VCD diskovi mogu da se reprodukuju na većini savremenih
DVD plejera.
SVCD
Super VideoCD (SVCD) Na DVD plejeru (ukoliko može da ga podrži), ovaj
format pruža video izuzetnog kvaliteta. SVCD ima rezoluciju 480x576 piksela
tako da, kada se reprodukuje na računaru može da izgleda pomalo nejasno.
DivX
DivX format baziran na standardu MPEG4 pomoću koga se dobijaju
izuzetno komprimovane video datoteke vrhunskog kvaliteta. Posebno je
podesan za razmenjivanje filmova. Ipak i ovaj format ima svoje nedostatke.
DVD
Digital Versatile Disc (DVD) je možda najpoznatiji termin u svetu
digitalnog videa. DVD plejeri su postali standard i osvajaju tržište mnogo
brže nego video rekorderi nekada. Video signal brzine 9800 Kbps u
rezoluciji 720x576 pruža vrhunski kvalitet slike. Na standardni DVD može
da stane oko 2 časa digitalnog videa, što zavisi od njegovog kvaliteta.
71
HD DVD
72
HD DVD

HD DVD (engl. High-Definition DVD, High Definition Digital
Video Disc) je digitalni višenamenski disk velike gustine, razvijen
za zapisivanje videa visoke definicije.

HD DVD standard je razvila grupa proizvođača potrošačke
elektronike i personalnih računara, predvođena Tošibom, 2003.
godine

Kapacitet HD DVD je 15 GB, odnosno 30 GB u slučaju dvoslojnih
diskova. Tošiba je objavila i karakteristike formata troslojnog diska,
kapaciteta 45 GB.

HD DVD je kompatibilan sa DVD.

Sloj sa podacima se kod ovih diskova nalaze u sloju koji je 0.6 mm
ispod površine.
73
HD TV

Televizija visoke rezolucije ili HDTV što je skraćenica od
engleske reči High-definition television koja u prevodu znači
televizija visoke definicije.

Predstavlja novi standard emitovanja TV programa koji se ne
oslanja na stare, već zastarele, sisteme.

Glavne odlike novog sistema su: veća rezolucija, 16:9 odnos
ivica ekrana (dosadašnji 4:3), okružujući sistem zvuka,
moguća implementacija servisa interaktivne televizije.
74
Odnos veličina dosadašnjih
standarda i HDTV
75
Odnos rezolucija dosadašnjih
standarda i HDTV
Rezolucija HDTV 4 puta veća od standardne
Rezolucija standardne televizije
76
Uporedni prikaz video formata
AVI, DivX,
WMV
MOV
(QuickTime)
RM
(RealMedia)
640 x 4802
640 x 4802
320 x 2402
720 x 480
720 x 576
VCD
SVCD
DVD
HD DVD, HDTV
(WMV HD)
Rezolucija
NTSC/PAL
352 x 240
352 x 288
480 x 480
480 x 576
720 x 4802
720 x 5762
1440 x 10802
1280 x 7202
Video
kompresija
MPEG1
MPEG2
MPEG2,
MPEG1
MPEG2 (WMV
MPEG4)
MPEG4
Sorenson,
Cinepak,
MPEG4...
RM
DV
Audio
kompresija
MP1
MP1
MP1, MP2,
AC3, DTS,
PCM
MP1, MP2, AC3,
DTS, PCM
MP3, WMA,
OGG, AAC,
AC3
QDesign
Music,
MP3...
RM
DV
Veličina fajla
(MB/minut
snimka)
10
10-20
30-70
~150 (~60)
4-10
4-20
2-5
216
Minuta na CD
od 74 min (650
MB)
74
35-60
10-20
~4 (~10)
60-180
30-180
120-300
3
Dobar
Vrlo
dobar*
Odličan*
Izuzetan*
Odličan
Vrlo dobar
Pristojan
Odličan
Format
Kvalitet
AVI DV
77
Zaključak

Izrada Web strana može biti veliki izazov jer potrebne tehnologije
nisu sazrele i stalno se menjaju

Trebalo bi dobro analizirati prednosti i mane svih tehnologija za
Web pre donošenja odluke koju primeniti

Čitači Weba i programi za izradu Web lokacija podložni su
greškama

Rešavanje potencijalnih problema niskog nivoa – zahteva dobro
poznavanje osnovnih tehnologija za Web poput jezika HTML i
kaskadnih stilova
78
Zaključak
Web stranama sigurno će biti dodato i programiranje
Prilikom odabira alata za programiranje – očuvati doslednost
izboru
Multimedijski sadržaji imaju svoje mesto na Webu –
tehnološka ograničenja sužavaju njihovu upotrebu
79
Tehnologije za Web