Veb programiranje

33
Veb programiranje HTML dr Jelena Graovac www.matf.bg.ac.rs/ ~ jgraovac Matematiˇ cki fakultet Beograd, 24. mart, 2016.

Transcript of Veb programiranje

Page 1: Veb programiranje

Veb programiranjeHTML

dr Jelena Graovac

www.matf.bg.ac.rs/~jgraovac

Matematicki fakultetBeograd, 24. mart, 2016.

Page 2: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Literatura

Zasnovano na:Filip Maric: Uvod u Veb i Internet tehnologije, 2013.(www.matf.bg.ac.rs/~filip/uvit/uvit.pdf)

dr Jelena Graovac Veb programiranje

Page 3: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Pregled

1 Istorijat

2 Verzije jezika

3 Tipovi dokumenata

4 Skup karaktera i kodiranje karaktera

5 Literatura

dr Jelena Graovac Veb programiranje

Page 4: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Pregled

1 Istorijat

2 Verzije jezika

3 Tipovi dokumenata

4 Skup karaktera i kodiranje karaktera

5 Literatura

dr Jelena Graovac Veb programiranje

Page 5: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Istorijat

Jezik HTML je nastao 1980-tih godina u istrazivackom centruCERN.

Razvio ga je fizicar Tim Berners-Li (eng. Tim Berners-Lee) uokviru sistema koji omogucava istrazivacima jednostavnokoriscenje i razmenu dokumenata.

Kljucne ideje koje Berners-Li koristi su da se dokumentirazmenjuju koriscenjem Interneta i da se dokumentipredstavljaju kao hipertekst, tj. tekst koji sadrzi veze(uputnice, linkove) ka drugim dokumentima i koji, ukoliko secita uz podrsku specijalizovanog softvera, omogucava izuzetnojednostavnu navigaciju kroz veliki broj dokumenata i timeznacajno povecava dostupnost informacija.

dr Jelena Graovac Veb programiranje

Page 6: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Istorijat

S obzirom na to da se u CERN-u za obelezavanje dokumenatavec koristio SGML, novi jezik je kreiran kao SGML aplikacija(kreiran je poseban DTD, pri cemu je vecina naziva elemenatapreuzeto iz vec koriscenih SGML DTD-ova u okviru CERN-a iubaceno je nekoliko novih elemenata, pre svega onaj zaobelezavanje veza).

Godine 1989. Berners-Li sa grupom kolega predlaze postojecuinfrastrukturu Internet-a kao platformu za razmenu ovihdokumenata i 1990. kreira prototip klijentskog i serverskogsofvera i definise prvu verziju HTTP protokola za njihovukomunikaciju.

Iako je ovaj predlog odbijen u okviru CERN-a, ovo se smatrapocetkom Veba.

dr Jelena Graovac Veb programiranje

Page 7: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Istorijat

Rad na HTML-u se nastavlja i 1993. u okviru IETF seobjavljuje prva formalna HTML specifikacijaU to vreme se pojavljuje pregledac Mosaic koji mimo HTMLstandarda uvodi mogucnost direktnog predstavljanja iprikazivanja slika u okviru dokumenata sto mu odmah donosipopularnost i veliki broj korisnika.Ubrzo se pojavljuje mogucnost i predstavljanja tabela i formiza popunjavanje i sva ova prosirenja bivaju obuhvacenastandardima koji se pojavljuju.Popularnost veba i HTML-a raste i tokom 1990-tih velikesoftverske kompanije proizvode svoje pregledace (MicrosoftInternet Explorer i Netscape Navigator) i zapocinju borbu zaprimat na Veb trzistu (ovaj period poznat je i kao periodratova pregledaca — eng. browser wars).

dr Jelena Graovac Veb programiranje

Page 8: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Istorijat

Napredak tehnologije prikaza (pre svega pojava grafickihkontrolera i monitora u boji) i sve veca rasprostranjenostgrafickih korisnickih okruzenja dovela je do toga da autori tezekreiranju dokumenata sa bogatim elementima grafickeprezentacije (npr. mnostvom boja, slovnih likova, animiranimsadrzajem) i pod tim pritiskom proizvodaci pregledacaprosiruju ad hoc smisljenim elementima koji HTML prosirujuelementima koji sluze iskljucivo za definisanje vizuelneprezentacije i koji znacajno opterecuju oznacavanje logickestrukture dokumenata

dr Jelena Graovac Veb programiranje

Page 9: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Istorijat

Pocinje velika trzisna utrka koja dovodi naglog inekontrolisanog razvoja HTML tehnologija, van uticajazvanicnih standardizacionih institucija

Kako bi se kanalisao dalji razvoj veba i koordinisali industrijskiproizvodaci softvera, 1994. Tim Berners-Li formira neprofitnuorganizaciju World Wide Web Consortium (W3C) koja okupljanekoliko stotina, pre svega akademskih, strucnjaka i kojapreuzima kontrolu nad veb tehnologijama. Danas se W3Csmatra jedinim relevantnim telom za razvoj veba i njihovepreporuke se smatraju de facto standardima.

dr Jelena Graovac Veb programiranje

Page 10: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Pregled

1 Istorijat

2 Verzije jezika

3 Tipovi dokumenata

4 Skup karaktera i kodiranje karaktera

5 Literatura

dr Jelena Graovac Veb programiranje

Page 11: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Verzije jezika

Striktno pridrzavanje standarda je osnovni preduslov kreiranjakvalitetnih dokumenata.Autori bi sve vreme trebalo da imaju u vidu da ce njihovidokumenti biti tumaceni koriscenjem razlicitih alata urazlicitim okruzenjima i na razlicitim uredajima (npr.verovatno je da ce biti korisceni razliciti pregledaci, moguce jeda ce dokumenti biti pregledani na ekranima sa razlicitomvelicinom i rezolucijom, na mobilnim telefonima, cak jemoguce da ce biti prikazivani Brajevom azbukom ili zvucno zaosobe sa ostecenim vidom).Dakle, kontrolu kvaliteta dokumenta ne bi trebalo vrsiti samoproverom u omiljenom pregledacu, vec je za svaki dokumentpozeljno proveriti njegovu saglasnost sa standardom putemvalidacije.

dr Jelena Graovac Veb programiranje

Page 12: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Verzije jezika

Trenutno aktuelna verzija standarda je HTML 5, koji je 2014.godine zamenio standard HTML 4.01

dr Jelena Graovac Veb programiranje

Page 13: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Pregled

1 Istorijat

2 Verzije jezika

3 Tipovi dokumenata

4 Skup karaktera i kodiranje karaktera

5 Literatura

dr Jelena Graovac Veb programiranje

Page 14: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Tipovi dokumenata

Vec je pomenuto kako je sredinom 1990-tih godina podpritiskom trzista i industrije sofvera jezik HTML (cak i njegovestandardizovane verzije) prosiren nizom elemenata kojiiskljucivo sluze za definisanje graficke prezentacije dokumenta.

Medutim, od verzije HTML 4.0, odluceno je da se pokusa saispravljanjem ovako losih resenja i uvedeno je potpunorazdvajanje opisa logicke strukture i vizuelne prezentacijedokumenata.

Za opis prezentacije dokumenata koriste se stilski listovi (eng.style-sheets), tj. uveden je zaseban jezik CSS (koji ce bitikasnije opisan).

dr Jelena Graovac Veb programiranje

Page 15: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Tipovi dokumenata

Odluceno je da se elementi (i atributi) koji se odnose na opisprezentacije uklone iz jezika HTML.

Ipak, s obzirom na veliki broj postojecih dokumenata kojikoriste ove elemente odluceno je da se ovo izbacivanje radipostepeno.

Za pocetak, ovi elementi su proglaseni zastarelim. Uvedena sudva razlicita tipa dokumenta (DTD): striktni (eng. strict) iprelazni (eng. transitional).

dr Jelena Graovac Veb programiranje

Page 16: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Tipovi dokumenata

Striktni dokumenti postuju znatno ostrija pravila i ne sadrzesporne elemente.

Prelazni tip dokumenata je formulisan tako da su pravilaznatno blaza i dokumenti i dalje mogu da sadze sve sporneelemente. Na primer, telo striktnih dokumenata ne moze dasadrzi tekst ili sliku koja nije deo nekog pasusa, tabele ilislicno, dok je kod prelaznih dokumenata ovako nestodopusteno.

Svakako, W3C preporucuje koriscenje striktnog DTD prikreiranju svih novih dokumenata.

dr Jelena Graovac Veb programiranje

Page 17: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

MIME tip HTML dokumenata

Kao sto je vec opisano u poglavlju o HTTP protokolu,prilikom slanja sadrzaja preko veba, HTTP odgovori sadrzeContent-Type polje koje sadrzi informaciju o tipu sadrzaja uobliku MIME (Multi-Purpose Internet Mail Extensions)formata.

HTML 5 dokumenti, kao i dokumenti ranijih verzija HTML-ase predstavljaju MIME tipom text/html. Kod XHTMLdokumenata, situacija je komplikovanija.

Ovi dokumenti se mogu predstaviti kao dokumenti MIME tipatext/html, application/xhtml+xml, application/xml itext/xml.

dr Jelena Graovac Veb programiranje

Page 18: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

MIME tip HTML dokumenata

Zadnja dva tipa su pogodnija za predstavljanje ,,cistih“ XMLdokumenata i ne preporucuju se prilikom predstavljanja HTMLsadrzaja. Ukoliko je korisnicki agent takav da moze daobraduje XML, savet je da se dokument predstavi kaoapplication/xhtml+xml.

Me�utim, veliki broj korisnickih agenata (pre svega oni stariji)ne moze da obraduje XML i ne ume da iskoristi prednosti kojeXML donosi. U tim slucajevima, savet je da se koristi MIMEtip text/html i da se XHTML dokumenti ,,lazno“ predstavljajukako da su HTML.

dr Jelena Graovac Veb programiranje

Page 19: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

MIME tip HTML dokumenata

Da bi ovo uspelo, potrebno je pridrzavati odre�enih savetapoznatih kao saveti za HTML kompatibilnost (eng. HTMLcompatibility guidelines).

Ova pravila su takva da ne narusavaju ispravnost XMLdokumenata, a doprinose mogucnosti njihovog ispravnogtumacenja od strane starijih korisnickih agenata koji razumejusamo HTML.

dr Jelena Graovac Veb programiranje

Page 20: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

MIME tip HTML dokumenata

Saveti su dati u dodatku XHTML 1.0 standarda i ovde ce bitinavedeno samo nekoliko primera:

Ne navoditi XML deklaraciju i koristiti UTF-8 ili UTF-16kodiranje karaktera.Za elemente sa praznim sadrzajem navoditi skraceni zapisetiketa (npr. <br />)).Za elemente sa mogucim nepraznim sadrzajem ne koristitiskraceni zapis etiketa ako se jave prazni (npr. <p></p>)....

Tabela 1: MIME tipovi HTML i XHTML dokumenata

dr Jelena Graovac Veb programiranje

Page 21: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Pregled

1 Istorijat

2 Verzije jezika

3 Tipovi dokumenata

4 Skup karaktera i kodiranje karaktera

5 Literatura

dr Jelena Graovac Veb programiranje

Page 22: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Skup karaktera i kodiranje karaktera

Jezik HTML definise skup karaktera (eng. character set) kojije dozvoljeno koristiti u HTML dokumentima

U nastavku ce biti opisano nekoliko najcesce koriscenihkodiranja karaktera. Imena koja ce biti navedena sustandardna (pod nadleznoscu IANA (Internet AssignedNumbers Authority)) i trebalo bi ih koristiti prilikomnavo�enja kodiranja karaktera. Velicina slova nije bitnaprilikom navo�enja ovih oznaka.

dr Jelena Graovac Veb programiranje

Page 23: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Skup karaktera i kodiranje karaktera

ASCII - American Standard Code for Information Interchange— jedan od starijih standarda za kodiranje koji definise samo127 karaktera (uglavnom slova engleske abecede, cifre,interpunksijske znake i neke specijalne karaktere). Iako jestandard sedmobitan, obicno se za kodiranje svakog karakterakoristi ceo jedan bajt.Naredne kodne strane predstavljaju prosirenja ASCII tabele idefinisu po 255 karaktera. Prvih 127 karaktera se poklapaju saASCII tablicom, dok su naredni karakteri specificni, obicno zaneko geografsko podrucje. Prilikom kodiranja, naravno, svakikarakter zauzima 1 bajt. Dve familije kodnih stranadominiraju - ISO-8859 familija standardizovana od stranemedunarodne organizacije za standardizaciju i windows-125xprotezirana od strane kompanije Majkrosoft.

dr Jelena Graovac Veb programiranje

Page 24: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Skup karaktera i kodiranje karaktera

Naredne kodne strane su izdvojene zbog toga sto se najcescekoriste za zapis tekstova na srpskom jeziku.

ISO_8859-1 - Latin-1. Pored ASCII simbola, definise latinicnesimbole koriscene u zapadnoevropskim jezicima.ISO_8859-2 - Latin-2. Pored ASCII simbola, definise latinicnesimbole koriscene u centralnoevropskim jezicima (izmeduostalog i dijakritike s, c, d, c i z koji se koriste u srpskom).ISO_8859-5 - Latin-5. Pored ASCII simbola, definise cirilicnesimbole

dr Jelena Graovac Veb programiranje

Page 25: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Skup karaktera i kodiranje karaktera

Naredne kodne strane su izdvojene zbog toga sto se najcescekoriste za zapis tekstova na srpskom jeziku.

windows-1250 - Majkrosoftova kodna strana koja pored ASCIIsimbola definise latinicne simbole koriscene ucentralnoevropskim jezicima (izmedu ostalog i dijakritike s, c,d, c i z koji se koriste u srpskom).windows-1251 - Majkrosoftova kodna strana koja pored ASCIIsimbola definise i cirilicne simbole.

dr Jelena Graovac Veb programiranje

Page 26: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Skup karaktera i kodiranje karaktera

Naredne kodne sheme su novije i omogucavaju kodiranje siregskupa karaktera. Za razliku od prethodnih ,,jednobajtnih“kodnih strana, ovde je moguce u okviru istog dokumentamesati razlicite karaktere (npr. dijakritike, cirilicu, grcko ihebrejsko pismo).

UTF-8 - Pametan algoritam kodiranja koji karaktere kodiratako da ASCII karaktere zapisuje sa po jednim bajtom(kompatibilno sa ASCII kodiranjem), naredne karaktere(izmeduostalih i dijakritike koriscene u latinicnom zapisusrpskog jezika i cirilicne simbole) sa po dva bajta, naredne sapo tri bajta itd. S obzirom da se u engleskom jeziku i u ostalimevropskim jezicima koji koriste latinicu uglavnom koriste ASCIIkarakteriUTF-16 - Pametan algoritam koji omogucava kodiranje punogISO-10646 skupa, pri cemu se za karaktere osnovne visejezickeravni koriste dva bajta, a za ostale karaktere vise bajtova.

dr Jelena Graovac Veb programiranje

Page 27: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Skup karaktera i kodiranje karaktera

Za navo�enje karaktera u okviru dokumenata moguce jekoristiti i numericke karakterske reference. Npr. rec lisce semoze kodirati kao li&#x161;&#x107;e. S obzirom da ovocini dokumente prilicno necitljivim, ovaj nacin kodiranjakaraktera se ne preporucuje. Naglasimo jos jednom, daizuzetak predstavljaju karakteri <, > i & koji imaju specijalnoznacenje u okviru HTML dokumenata, tako da se za njihovokodiranje zahteva koriscenje karakterskih referenci &lt;, &gt;i &amp;, respektivno.

dr Jelena Graovac Veb programiranje

Page 28: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Navo�enje kodne strane za HTML dokumente

Kako bi sadrzaj mogao korektno da se protumaci, neophodnoje da korisnicki agenti imaju informaciju koje je kodiranjekaraktera korisceno. Ova informacija cesto biva dostavljena odstrane servera na kome se dokument nalazi. Standardan nacinda se ovo uradi je da se informacija o kodiranju dostavi uokviru HTTP odgovora kojim se HTML dokument dostavlja.Standardna oznaka koriscenog kodiranja se u tom slucajunavodi u okviru Content-Type polja. Na primer:Content-Type: text/html; charset=UTF-8 govori da je sadrzajkoji sledi kodiran koriscenjem UTF-8 kodiranja.

dr Jelena Graovac Veb programiranje

Page 29: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Navo�enje kodne strane za HTML dokumente

S obzirom da neki serveri ne ukljucuju ovu informaciju uHTTP odgovore, kodiranje karaktera je moguce izvrsiti i uokviru samog HTML dokumenta. Ovo se radi u okviruhttp-equiv atributa elementa meta koji se navodi u zaglavljudokumenta.

U HTML5:<meta charset="character_set">

U HTML 4.01:

<meta http-equiv="Content-Type"

content="text/html; charset=UTF-8">

dr Jelena Graovac Veb programiranje

Page 30: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Navo�enje kodne strane za HTML dokumente

Ukoliko se koristi XHTML, moguce je informaciju o kodiranjunavesti u xml deklaraciji:<?xml version="1.0" encoding="UTF-8"?> Jos jedan odnacina je da se naglasi kodiranje je da se u okviru elementakoji upucuje na neki dokument (npr. u okviru veze) naglasikoje je kodiranje korisceno za dokument na koji element(veza) upucuje. Npr.<a href="page.html" charset="utf-8">...</a>

dr Jelena Graovac Veb programiranje

Page 31: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Navo�enje kodne strane za HTML dokumente

Ukoliko korisnicki agent ne dobije informaciju o kodiranjudokumenta koji treba da obradi, moguce je ili da sam pokusada pogodi kodiranje ili da ponudi korisniku da odaberekodiranje (npr. ,,View — Character Encoding“ u programuFirefox).

Ukoliko je kodiranje takvo da ne moze da obuhvati nekekaraktere iz univerzalnog skupa karaktera, oni se navodekoristeci reference karakterskih entiteta ili numerickekarakterske reference.

dr Jelena Graovac Veb programiranje

Page 32: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Pregled

1 Istorijat

2 Verzije jezika

3 Tipovi dokumenata

4 Skup karaktera i kodiranje karaktera

5 Literatura

dr Jelena Graovac Veb programiranje

Page 33: Veb programiranje

IstorijatVerzije jezika

Tipovi dokumenataSkup karaktera i kodiranje karaktera

Literatura

Literatura

Slajdovi su pripremljeni na osnovu glave 2 e-knjigeFilip Maric: Uvod u Veb i Internet tehnologije, 2013.(www.matf.bg.ac.rs/~filip/uvit/uvit.pdf)

Za pripremu ispita, slajdovi nisu dovoljni, neophodno je ucitiiz knjige!

dr Jelena Graovac Veb programiranje