Sadržaj:

1. Uvod..................................................................................................................2
2. Računarska grafika............................................................................................3
2.1. Piksel...........................................................................................................3
2.2.Boja..............................................................................................................3
2.3. Dubina boja.................................................................................................4
2.4.Rezolucija slike............................................................................................4
3.Vrste grafičkih prikaza.......................................................................................5
3.1.Rasterska grafika..........................................................................................5
3.2.Vektorska grafika.........................................................................................6
4. Razlika između vektorske i rasterske grafike....................................................6
5. Grafički formati.................................................................................................7
5.1 JPEG format.................................................................................................7
5.2. BMP format.................................................................................................8
5.3.TIFF format..................................................................................................9
5.4. GIF format.................................................................................................10
5.5. PNG format...............................................................................................10
6.Važniji formati za smještaj vektorske grafike..................................................11
7. Podržanost grafičkih formata..........................................................................12
8. Zaključak.........................................................................................................13
9.Literatura:.........................................................................................................14
1. Uvod
U posljednjih deset godina prednosti digitalne tehnologije dovele su do masovne upotrebe te
tehnologije za obradu, pohranjivanje i prikazivanje slika u specijaliziranim primjenama
(stolno izdavaštvo (desktop publishing),grafička umjetnost (graphic arts), medicina), ali i u
svakodnevnom životu (faksimili, digitalni fotoaparati itd). Ograničenje primjene digitalne
tehnologije je u činjenici da je za prezentaciju slike u digitalnom obliku potrebno mnogo
podataka.
Upotrebom digitalnih slikovnih sistema ograničena je velikoa cijena pohrane i prijenosa iako
su uređaji za snimanje i prikazivanje cjenovito dostupni.
Danas se susrećemo s mnoštvom web-preglednika koji, osim što se razlikuju u kozmetičkim
detaljima izgleda korisničkog sistema te dodatnim funkcionalnostima, također se razlikuju u
načinu na koji interpretiraju web-stranice, odnosno pripadajuće HTML, CSS i JavaScript
instrukcije.
Bez obzira na različite algoritme i metode prikaza sadržaja web-stranica na različitim web
-preglednicima, ipak se pokazalo da svi oni jednako prikazuju grafički sadržaj spremljen u
datotekama različitih grafičkih formata.
Pravilo za multimedijske i grafičke formate je da je kvaliteta sadržaja proporcionalnija
veličini datoteke koju opisuje taj sadržaj. Zato je potrebno za svaku oprimjenu na webu
pronaci format koji zadovoljava balans između kvalitete sadržaja te rezultantne veličine
datoteke.
2. Računarska grafika

Računarska grafika predstavlja način stvaranja i obrade slike u dvije ili tri dimenzije uz
pomoć računara i uz predviđene programe. Zato računarska grafika ima široku primjenu u
nauci, industriji i dizajnu. U samu računarsku grafiku spada i dizajn interfejsa operativnih
sistema i softvera. Pri samom čuvanju slike u računaru nailazimo na problem sa njenim
optimalnim zapisom. Pod optimalnim zapisom smatramo što vjerniju sliku i sa što manjim
zauzertim prostorom na disku. Dva elementa koji utiču na sadržaj i veličinu grafičkog
formata fajla su broj piksela i dubina boje.

2.1. Piksel

Piksel (eng.pixel ), od eng. „ picture element “ je najmanji grafočki element slike i specifičan
je za bitmap slike. Da bi se sama slika pretvorila u digitalni oblik, mora se spremiti kao niz
bitova)(bajtova), i mora se prevesti u više ili manjih dijelova od koji je svaki određene boje.
Ti dijelovi nazivaju se pikseli i količina istih u pojedinoj slici određuje kvalitet slike i stvarne
dimenzije slike. U samom color sistemu piksel je sastavljen od podpiksela tj, tačkica osnovnih
boja(crvena,zelena i plava-R,G,B) od kojih se različitim sjajem pojedinih podpiksela
kombinuje željena nijansa boje. Kompletna informacija o pikselu sadrži položaj piksela na
ekranu, nijansu boje i intenzitet osjeljivosti.

2.2.Boja

Boja predstavlja osjećaj koji se pojavljuje kada na oko dijeluje svijelost određene talasne
dužine emitovana od nekog izvora. Osnovne boje su plava, crvena i žuta i one se ne mogu
dobiti miješanjem drugih boja. Komplementarne boje leže u krugu jedna naspram druge.
Tople boje su crvena, narandžasta i žuta. Hladne  boje su plava,zelena i ljubičasta.

RGB predstavlja sistem aditivne sineteze boja. Prikaz RBB sistema se dobija različitim
intenzitetima svijelosni primanrnih boja:crvene(Red), Zelene(Green) i plave (Blue). Ovaj
sistem se upotrebljava za radove koji su namjenjeni ekranskom prikazivanju budući da je
ekran izvor svijela. Za razliku od RBG sistema, CMYK je sistem koji predstavlja suptraktivne
sinteze boja. Prikaz kod CMYK se dobija filtriranjem kojim se od bijele kompleksne
svijelosti oduzima svijelost primarne boje. Tirkiznoplavi filter(Cyan) oduzima od bijele
crvenu, a purpurni(Magenta) oduzima zelen u dok žuti oduzima plavu. Međutim crna se
koristi da dodatno potamni boju.
Ovaj sistem se upotrebljava za radove namjenjene štampi pošto se stamparske boje ponašaju
kao filter svijelosti.

2.3. Dubina boja

Dubina boja (engl. color depth, bit depth ili pixel depth) je način da se opiše koliko imamo
informacija o boji svakog piksela slike. Samim time može se reći da veća dubina boja, znači
veći broj raspoloživih boja na digitalnim slikama. Tako možemo predpostaviti da ako je
dubina boja 1 imamo samo dvije moguće vrijednosti i to crnu ili bijelu. Uobičajene dubine
vrijednosti boja iznose od 1 do 64. Tako možemo predpostaviti da sivi piksel sa dubinom 8
ima 256 mogućih vrijednosti.
Ako je pikselu prudružen 1 bajt on može da ima 256 boja. U slučaju da je pikselu pridruženo
2 bajta on ima 65.536 boja. U slučaju da je pikselu pridruženo 3 bajta on može imati 16.7
miliona boja.

2.4.Rezolucija slike

Rezolucija slike predstavlja broj piksela po mijernoj jedinici. Ta mijerna jedninica se izražava
u inčima(2.54 cm). Rezolucija slike dobija se na taj način tako što se podijeli njena fizička
dimenzija sa brojem piksela poredanih duž fizičke dimenzije. Ako je širina slike 16 cm a
visina 7.51 cm i ima poredanih 454 piksela po širini i 201 po visini slike, onda možemo
predpostaviti da je rezolucija 454716 ili 7.51/7.51= 28.735 piksela po centimetru odnosno
28.375*2.54 = 72 piksela po inch.

 
 
3.Vrste grafičkih prikaza

Postoje dvije vrste grafičkih prikaza i to:

 Rasterska(bitmapirana) grafika i
 Vektorska grafika

3.1.Rasterska grafika

Raster predstavlja neki oblik koji je sačinjen od više elemenata u nekom vidljivom
dvodimenzionalnom sistemu. U računarskoj grafici to je prikaz od jednog do beskonačnog
broja polja na površini određene veličine. Zajedno kreirano polje čini cjeloviti sliku. Pri tome
se polja moraju dodirivati ali ne i preklapati. Takva slika naziva se bitmapa a polja pikseli.
Broj piksela na površini veličine naziva se rezolucija.
Rasterska grafika je "crtanje" pomoću mozaika piksela pri čemu svaki piksel posebno
nosiinformaciju o boji koju reprodukuje. Veličina crteža ili slike dobijene na ovaj
način ponajviše zavisi od brojapiksela koji je čine. Kao veoma bitan pojam unutar grafičke
industrije javlja se rezolucija,a označava broj piksela na nekoj određenoj veličini. Od broja
piksela osim same veličine,zavisi kvalitet slike, ali i njena fizička veličina koju zauzima na
digitalnim medijima za smještaj podataka. Ukoliko korisnik želi da poveća rastersku sliku, to
postiže ili uveća-vanjem postojećih ili dodavanjem novih piksela. Smanjivanje rasterske slike
se odvija umanjivanjem ili oduzimanjem postojećih piksela (slika 1.)

Slika 1. Rasterska grafika

 3.2.Vektorska grafika

Kod vektorske grafike grafikoni su izrađeni pomoću proporcionalnih formula. EPS, AI i PDF
su vektorski formati grafičkih datoteka, a ako često trebate promijeniti veličinu slika, bolje ih
je koristiti. Logotip vaše tvrtke sigurno bi trebao biti izvršen u vektorskoj grafici, a izvorna
datoteka uvijek treba biti pri ruci. Glavna prednost vektorske grafike je da možete
komprimirati sliku na veličinu poštanske marke ili povećati do pune veličine plakata od 3 do 6
m. Ako niste sigurni imate li vektorsku sliku logotipa, nazovite tiskaru koja ispisuje sve vaše
proizvode. U 99% imat će vektorska verzija vašeg logotipa.

4. Razlika između vektorske i rasterske grafike

Programi vektorske grafike kreiraju crteže sačinjene od linija i krivih definisanih
matematičkim objektima zvanim vektori. Vektori opisuju grafike prema njihovim
geometrijskim karakteristikama. Vektorska slika ne zavisi od rezolucije.

Slika 2. Primjer vektorske slike koja ne zavisi od rezolucije

Programi rasterske grafike generišu bitmapirane (rasterske) slike koje koriste mrežu
kvadratića (tzv. piksela) da bi tu sliku predstavili. Svakom pikselu je dodeljena lokacija i
boja. Bitmapirana slika zavisi od rezolucije.

Slika 3. Bitmapirana slika koja zavisi od rezolucije

5. Grafički formati

Grafičkom datotekom ili slikom naziva se svaka sačuvana slikovna prezentacija. Grafički
formati su razvijeni, kako bi se organizovale informacije za adekvatan prikaz slike. Bilo
kakva rasterska prezentacija slike naziva se rasterska datoteka. Monohromatske slike se
čuvaju u formatu bitmape. Rasterske datoteke u punoj boji su velike datoteke, tako da su
razvijeni grafički formati lkoji omogućavaju primjenu odgovarajuće kopresije podataka kako
bi se smanjila veličina datoteka. Samim time kao dodatak ovome, broj boja prikazanih na
kolornoj slici mora da se smanjuje kada se takva slika prikazuje na sistemu sa ograničenim
mogućnostima za prikazivanje boja.
Grafički formati uključuju zaglavlja koja obezbjeđuju infomacije o strukturi tih datoteka.
Zaglavlje sadrži različite informacije, kao što su veličina daoteteke, broj bitova ili bajtova,
upotrebljenu metodu komprimovanja da bi se smanjila veličina datoteke.

Grafički fomati koji se najčešće koriste su:

 JPEG(Joint Photographics Experts Group)

 BMP(Bitmap image file)
 PCX(Personal Computer Exchange)
 TIFF(Tag Image File Format)
 GIF(GraphicsInterchange Format 
 PNG(Portable network Graphics )

  5.1 JPEG format

Format JPEG potiče od engleskog naziva Joint PhotoGraphics Experts Group i riječ je o
formatu koji je formirala zajednička frupa fotografskih stručnjaka. Format JPEG može bez
vidljivih gubitaka z kvalitetu slike za ljusko oko smanjiti veličinu datoteke i do nekoliko puta.
To podrazumjeva da JPEG pravi kompromis između kopresije i gubitka.
JPEG format koristi osobinu ljudskog oka da slabije uočava razlike u nijansi boje nego u
intenzitetu svijetlosti.Osnovni problem kod formata JPEG je što su oštećenja trajna i što se
gubitci akumuliraju prilikom višestrukog uređenja slike. Poslije određenog broja uređenja
jedne te istre slike, slika više neće izgledati kako treba i biti će mnogo lošija od orginala.
 Slika 4. Prikaz slike poslije korištenja višestruke kompresije

Zbog ovakvih problema ne treba uređivati JPEG slike. Zato se uređuju slike u sirovom obliku
ili slike koje se kompreminuju bez gubitka primjenom odgovarajućih metoda. Korisnik može
da se igra sa ne komprinovanim orginalom koliko hoće, a JPEG sliku može praviti poslije
svih izmjena kada hoće da napravi malu datoteku koju treba poslati.

5.2. BMP format

BMP je format za bitmapiranu grafiku unutar operativnog sistema Windows. BMP format
sadrži sve dubine boje. Što se samog komprimovanja tiče BMP format podržava i RLE
algoritam za komprimovanje za slike sa 4 ili 8 bita po pikselu. BMP formati nemaju
mogućnost za spremanje u slojevima. Grafika u tom formatu zauzima puno prostora na
medijima za smještaj podataka.
 Slika 5. Klasičan primjer korištenja BMP formata

5.3.TIFF format

TIFF -  Kreirao Aldus posebno za čuvanje skeniranih slika. Format je dizajniran za čuvanje
raster slika visokog kvaliteta (ime datoteke extension.TIF). Odnosi se na broj
rasprostranjenih, razlikuje se prenosivost između platformi   (IBM PC i Apple Macintosh),
podržava većina grafičkih, verstalnih i dizajnerskih programa. Zbog svoje fleksibilnosti, ovaj
format je zaista univerzalan. Iako je dugo vremena od formiranja formata, TIFF je i dalje
glavni format za čuvanje skeniranih slika i njihovo postavljanje u ilustrativne programe i
sisteme objavljivanja. Njegove verzije postoje na svim kompjuterskim platformama, što čini
ovaj format veoma pogodnim za prenos raster slike između platformi. TIFF podržava
monohromne, indeksirane, polutonske slike, kao i slike u RGB i SMYK modelima sa 8 i 16-
bitnim kanalima. U formatu možete sačuvati putanje klipova, informacije o kalibraciji i
postavke za štampanje. Takođe je moguće koristiti bilo koji broj dodatnih alfa kanala, ali
dodatni kanali u boji nisu podržani. Velika prednost formata je podrška skoro svakog
algoritma kompresije. Veoma visok stepen kompresije pruža najčešći LZW algoritam
(Lempel-Ziv-Welch) - kompresija informacija bez gubitaka. Isti algoritam koristi brojne
programe kompresije opšte namene koji podržavaju ZIP format. TIFF format postoji u dve
verzije: za Macintosh i PC

5.4. GIF format

GIF potiče od engleskog naziva Graphics Interchange Format . GIFF format je nastariji
format, iako se i danas koristi za prikazivanje jednopstavnih slika na webu.Dubina boje GIFF
formata kreće se od 1 do 8 bita po pikselu i ovaj format podržava maksimalno 256 boja. Slike
sa GIF formatom su ivjek komprimovane i primjenjena je LZW metoda komprimovanja
grafičkih podataka. GIF format je dobar za jednostavne crteže. Jednostavne slike u GiF
formatu se odlično komprimuju tako da izlaz predstavljaju izuzetno mali fajlovi.GIF format
ima još osobina koje su razlog njegovog opstanka na tržištu a to su transparentnost i
mogućnost animacije.
Isto tako se pokazalo da GIF format pored statičkih podržava i animirane slike. Dovoljno je
kreirati nekoliko slika, koje posmatrane u nizu predstavljaju animaciju. To je najbolje uraditi
u programu Photoshop, a onda pomoću programa ImageReady formirati animaciju gdje će
svaki sloj biti pojedinačni kadar u animaciji. Na ekranu podešavamo prikaz svakog kadra,
tako da korisnik ima puno slobodu u kreiranju željene animacije.

5.5. PNG format

PNG je novi web format dizajniran da zamjeni zastareli GIF. Koristi se Deflate za kompresiju
bez gubitaka, slično LZW (upravo zbog patentiranja 1995. godine, PNG algoritam se pojavio
u LZW algoritmu). Komprimirane indeksirane PNG datoteke obično su manje od sličnih GIF-
ova, RGB PNG je manji od odgovarajućeg TIFF datoteke.
Dubina boje u PNG datotekama može biti bilo koja, do 48 bita. Koristi se dvodimenzionalno
prepletanje, koji malo povećava veličinu datoteke. Za razliku od GIF-a, gdje je
transparentnost prisutna ili ne, PNG također podržava prozirne piksele ( je u opsegu
transparentnosti od 0 do 99%) zahvaljujući Alpha kanalu sa 256 sivih tonova.
PNG datoteka zapisuje informacije o korekciji gama. Gama je broj koji karakteriše zavisnost
osvetljenosti ekrana vašeg monitora od napona na elektrodama kinekopa. Ovaj broj, pročitan
iz datoteke, omogućava vam da na ekranu unesete ispravku svjetline. Neophodno je da slika
stvorena na Masu izgleda isto na PC-u i Silicon Graphics-u. Dakle, ova značajka pomaže u
implementaciji glavne ideje WWW - isti prikaz informacija, bez obzira na korisničku opremu.
6.Važniji formati za smještaj vektorske grafike

Vektorskim formatima mogu se smatrati svi oni namenjeni za smeštaj 3D grafike, različitih
nacrta, šema, itd. To ih čini veoma kompatibilnim i lako razmenjivim među različitim
programima, ali samo ako se odnos e na jednostavne linije i ispune. Složene efekte, prelaze
boja i sl. podržavaju samo matičnih formati programa u kojima radimo. Formati za smještaj
vektorske grafike mogu biti:

 .TTF (true type font) najčešći format koji nosi podatke o fontu namjenjenom pisanju
tekstova na računaru.
 .AI, .CDR, .FH, .XAR su matični formati programa za izradu i obradu vektorskih
crteža i slika. To su redom: Adobe Illustrator, CorelDRAW, Macromedia Freehand i
Xara-X. Odlikuju ih relativno velike mogućnosti i velika svestranost jer je uz pomoć
njih moguće napraviti gotovo sve što ulazi u područje rada sa vektorskom grafikom
(izuzev 3D projektovanja).
 .WMF - vektorski format datoteke pogodan za prenos vektorske grafike jer je veoma
kompatibilan sa ve ćinom programa koji imaju mogućnost izrade ili obrade ra
čunarske grafike, a nisu nužno primarno namjenjeni za crtanje vektorima (npr.Word,
Excel, PowerPoint itd.). Velika mana tog formata je što podržava samo najosnovnije
boje bez prelaza. Novijim verzijama gore navedenih programa pojavio se
poboljšani .WMF format pod nazivom .EMF. Dopušta primenu nekih jednostavnijih
prelaza boja, ali još uvijek nema većih prednosti nad .WMF formatom.
 .EPS i .PDF - su veoma snažni vektorski formati koji podržavaju i smeštaj rasterskih
slika. Veoma su pogodni za ispis i pripremu za procese štampanja jer podržavaju
PostScript programski jezik koji je zaslužan za ubrzavanje i lakši rad pri prenošenju
grafike sa ekrana ra čunara na željeni medijum nekom od metoda reprodukcije grafike.
7. Podržanost grafičkih formata

Da bi neki grafički format bio podržan za korištenje na webu, potrebno je osigurati da web-
preglednik posjetitelja zna kako interpretirati instrukcije dobivene u obliku HTML oznaka -
tagova.
Dosadašnja iskustva pokazala si da je potrebno puno vremena kako bi neki format postao de
facto standradom za korištenje na webu. Uzroci za najveći broj grešaka u prikazu web-
stranica su web preglednici koji ne prate preporuke već često implementiraju vlastite načine
za prikaz i upravljanje sadržajem. Pošto problemi sa prikazom slikovnog sadržaja na webu
nisu brojni, oni ipak postoje i najviše se odnose na probleme sa prikazom vektorskih i drugih
slikovnih formata koji su nakon ostalih došli u korištenje na webu.
Samim time možemo predpostaviti da je grafički format podržan za korištenje na webu onaj
čiji sadržaj konzistentan i tačan u svim web preglednicima.
Rasterski formati su oni koji će se ispravno prikazati na webu ukoliko su u HTML-u
definirani pomoću taga <img src=“naziv_datoteke“/ > ili putem CSS atributa background-
image.
Međutim kod vektorskih formata neka jedinstvenog načina uključivanja u HTML, nego se za
svaki format koristi druga sintaksa, i najčešće oslanjajući se na HTML tagove objecta i
njihovu kombinaciju.
8. Zaključak

Sama činjenica je da niti rasterska grafika niti vektorska grafika ne može funkcionisati bez
grafičkih formata. Jedan od najvećij problema predstavlja koji tačno format odabrati. Zato
sam u sklopu ovog seminarskog rada opisao koji su mto najvažniji grafički formati, koja im je
prednost kao i koja je to razlika za korištenje kako u rasterskoj tako i u vektorskskoj grafici.
Isto taako važnu ulogu prilikom odabira nekog grafičkog formata igra i sama uloga boje kao i
rezolucija. Zato je važno napomenuti da kod same vektorske grafike sama slika ne zavisi od
rezolucije dok kod rasterske grafike slika zavisi od rezolucije. Zato je bitno donijeti odluku
kada je samo korištenje formata koji stvaraju grafičke gubitke. Njihova upotreba dolazi do
izražaja kada radimo na webu jer zbog velikog prostora koji zauzimaju teže se učitavaju. Iz
ovog seminarskog rada se nameće zaključak da rasterske formate koristimo kada želimo i da
dobijemo realističku sliku, dok vektroske formate koristimo ako želimo da pravimo animacije
ili razne crteže. U slučaju da trebamo spremati slike sa malo boja u tom slučaju je najbolje da
korsitimo GIF format, jer nam on daje najbolji odnos između kvaliteta slike i prostora koji ta
slika zauzima u memoriji računara.
9.Literatura:
[1] Dr Dragan Cvetković, „Vektorska i rasterska grafika“ drugo dopunjeno izdanje,
Beograd,2009.

Izvori sa Interneta:
1) http://people.etf.unsa.ba/~srizvic/Kompjuterska_grafika.pdf
2) https://eprints.grf.unizg.hr/2578/1/Z768_%C5%A0imundi%C4%87_Domagoj.pdf
3) http://www.am.unze.ba/pzi/2007/SaljicDaut/Vrste_Formata.html
4) https://pcchip.hr/helpdesk/po-cemu-tocno-se-razlikuju-formati-slika-jpeg-png-i-gif/