HTML 5 Jelena Stanojević jelena.stanojevic83@live.com

Šta je HTML i istorijat HTML i razvoja internet prezentacijaSvakodnevna upotreba interneta se ne može zamisliti bez upotrebe HTML-a.

Šta je zapravo HTML? HTML je skraćenica za HyperText Markup Language, odnosno jezik koji uređuje tekst. Zamišljen je kao vrsta koda koji pored toga što ga prevodi poseban softver (browser, odnosno "internet pregledač") treba da bude relativno razumljiv i čitljiv ljudima u svom izvornom obliku.

Za razliku od programskih jezika koji se sastoje iz raznih instrukcija koje se prevode u mašinski kod, HTML je jezik sastavljen od "tagova" i "atributa" čijim se prevođenjem korisnicima prikazuje jasan izgled neke internet stranice.

Kao najjednostavniji primer se može navesti tag "b", tako da, ako se u HTML-u napiše

<b>tekst</b>

on će u browser-u biti prikazan kao

tekst

Pristup internetu nije uvek bio jednostavan kao danas: velike brzine, kablovski internet, ADSL, WiFi, 3G. Može se slobodno reći da smo danas konstantno uključeni na internet. Mlađe generacije su već zaboravile kako izgleda (i zvuči) povezivanje na internet putem modemske veze, male brzine, nestabilne veze i sl. Zbog takvih sporih početaka bilo je bitno da se prikaže internet stranica koristeći malu količinu podataka. Kako je tada za prikaz najbitniji bio tekst i on se kao takav morao preneti, kao veoma jednostavno rešenje se nametnulo korišćenje "markup-a" osnosno opisnih parametara uz tekst koji definišu način prikaza teksta: podebljan tekst, iskošen, podvučen, centriran, pasusi, paragrafi i sl.

Korišćenje markup “jezika” se pokazalo ispravnim sa nekoliko aspekata:

server na kome se nalazi internet prezentacija sadrži samo čiste HTML datoteke koje browser na korisničkom računaru "prevodi" u internet stranice

jednostavni tagovi, koje je svaki entuzijasta mogao lako da nauči I primenjuje, tako da svako ko želi da napravi neku internet stranicu to može veoma brzo da savlada

Slobodno se može reći da je zahvaljujući ovako zamišljenom jeziku za kreiranje internet stranica internet veoma brzo napredovao.

Prvi zvanični HTML standard je HTML 2.0 koji je objavljen 1995. godine. Na žalost različitim interesima unutar grupacije za razvoj HTML i WEB standarda usporen je dalji razvoj. Taj period se poklapa sa razvojem infrastrukture, brže veze postaju sve dostupnije, internet se omasovio i postavio se kao veoma

komercijalna platforma: e-banking, internet trgovina, servisi raznih namena i sl. Među takvim potrebama istaklo se nekoliko problema HTML-a, nedostatak “dinamičnosti” kao i klasičnih “programerskih” zahteva za razvoj ozbiljnih aplikacija.

U pomoć priskaču druge tehnologije: Java i JavaScript su uveli mogućnost “programiranja” internet stranica, CSS je uveo nove mogućnosti u sfere dizajniranja internet stranica, Flash kao tehnologija je uveo malu revoluciju u kreiranju dinamičkih prezentacija, kako sa strane programiranja, tako i sa strane dizajna i omogućio prikazivanje video zapisa na internet stranicama.

Kao da sve ovo nije bilo dovoljno u igru se uključuju i mobilni uređaji (u skorije vreme i tablet računari) čiji ekrani postaju dovoljno veliki i kvalitetni i čija mogućnost povezivanja na internet stvara potrebu za kreiranjem internet prezentacija i servisa koji treba da budu upotrebljivi i na takvim uređajima.

Kao aktuelni standard za prikaz internet stranica se koristi kombinacija HTML+JavaScript+CSS, to je kombinacija koju svaki browser treba pravilno da prevede korisniku u vidu internet prezentacije.

Svaka ozbiljna promena bilo koje od ove tri ključne tehnologije se manifestuje tako što browseri postaju “zastareli” i ne mogu pravilno da prikažu internet stranicu ukoliko ona koristi noviju verziju. Zbog toga se svi browseri na tržištu redovno ažuriraju i pokušavaju da isprate blagovremeno sve aktuelne promene i dopune u standardima.

HTML 5Od 2004. počinje razvoj HTML 5 standarda koji postaje dostupan 2008. godine i ovaj standard se i dalje razvija.

HTML 5 uvodi novine po pitanju prikazivanja multimedijalnog sadržaja, ali i pruža jaču podršku ka integraciji sa programskim jezicima pri kreiranju komplikovanih veb aplikacija.

HTML 5 kao pojam ne označava samo promenu postojećeg HTML stanarda već pod jedno ime okuplja sve standarde koji se koriste u kreiranju internet prezentacija: HTML standard, CSS standard i JavaScript biblioteke. Na ovaj način se lako kontroliše razvoj standarda i browseri mogu lakše da se unapređuju da isprate sve promene.

Zbog ovakvih karakteristika HTML 5 postaje standard i za mobilne platforme.

U praksi HTML 5 uvodi nove tagove poput <video>, <audio>, <canvas> kao i podršku ka SVG (skalabilna vektorskia grafika). Ovakvi dodaci pružaju mogućnost i lakoću implementiranja multimedijalnih elemenata na veb stranici bez korišćenja nekih drugih (dodatnih) tehnologija (kao što se na primer za video elemente danas najviše koristi Flash).

Dalje, HTML 5 uvodi delove koji ne služe konkretno za prikaz teksta, već logički odvajaju celine stranice što pomaže prvenstveno internet pretraživačima da bolje razumeju sadržaj na stranici. Neki od ovih novih tagova su <section> za sekciju, <article> za članak, <header> za zaglavlje, <nav> za navigaciju i sl.

Unapređenja u JavaScript bibliotekama su dovela do bržeg izvršavanja komplikovanih grafičkih prikaza (senke, refleksije, 3D i sl.), na ova unapređenja se nadovezuje i podrška novih browsera koji u potpunosti koriste raspoložive hardverske resurse poput korišćenja jakih grafičkih kartica za obradu efekata, prelaza i animacija.

Korišćenje internet aplikacija bez uspostavljene veze ka internetu? Ovo pitanje postaje veoma opravdano ako se uzme u obzir da se na internetu nalazi sve veći broj ozbiljnih servisa koji se koriste kao potpune zamene za klasične “desktop” aplikacije (e-mail, online Office preko SkyDrive-a i sl.) pa je neophodno da funkcionišu iako iz bilo kog razloga nije moguće uspostaviti vezu sa internetom.

HTML5 pruža metode za kreiranje i takvih aplikacija koje mogu da sačuvaju određenu količinu informacija (keširanje, localStorage, sessionStorage...) tako da je aplikacija potpuno funkcionalna i bez pristupa internetu, a kada se veza uspostavi da se svi podaci obrade na pravilan način.

Primena ovakvog čuvanja podataka ne mora da se ogleda samo u slučajevima prekida veze, već se može koristiti i za brže učitavanje odnosno izvršavanje same aplikacije.

BrowseriJedan od dugo najpopularnijih browsera je bio Internet Explorer 6 (veliku popularnost uglavnom duguje što je stizao "već ugrađen" u windows XP), ovaj browser danas spada u veoma zastarele browsere koji ne samo što ne mogu da prikazuju mogućnosti HTML 5 već I starijih standarda. Vremenom je Microsoft pravio nove verzije svog browsera: Internet Explorer 7, 8 i danas je aktuelna verzija 9.

U trenutno aktuelnoj verziji 9 su već podržani neki od HTML 5 standarda ali se puna implementacija očekuje u narednoj verziji Internet Explorer 10. Za sada pripremna (beta) verzija može da se isproba samo u kombinaciji sa Windows 8 operativnim sistemom. Internet Explorer 10 beta i Windows 8 devepler preview se mogu besplatno preuzei sa Microsoftovoe veb stranice. Ukoliko ne želite da menjate svoj postojeći operativni sistem, Windows 8 možete instalirati kroz neki od programa za

virtuelizaciju (VMWare, VirtualBox, VirtualPC i sl.) i na taj način isprobati funkcionalnost novog operativnog sistema (i Internet Explorera) bez menjanja postojećeg operaivnog sistema.

Naravno, pored Internet Explorer browsera postoje i drugi: Opera, Firefox, Safari, Chrome i na veb stranicama svakog od njih možete pratiti njihov razvoj pri implementaciji HTML 5 standarda.

HTML 5 nije finalni proizvod, već se konstantno razvija pa se tako i browseri redovno ažuriraju da isprate sve promene.

Pitanje svakog korisnika se logično postavlja "Zbog čega bih ja morao da pratim sve te promene?". Što se tiče Internet Explorera, on se redovno ažurira putem Windows Update-a, drugi browseri automatski proveravaju da li postoje novije verzije i nude korisnicima da pređu na njih. Na ovaj način prelazak na noviju verziju bilo kog browsera predstavlja veoma jednostavan korak.

Sam prelazak na novije verzije browsera nije cilj sam po sebi, već se nameće kao neophodan korak da bi se HTML 5 internet stranice pravilno prikazivale. Ovih stranica je sve više: u septembru 2011. godine, čak 35 internet sajtova od 100 najposećenijih je koristilo HTML 5, YouTube ima svoju kompletnu verziju koja koristi HTML 5 za prikazivanje video sadržaja umesto Flasha itd.

Ukoliko se do sada niste redovno ažurirali svoj browser, jednostavno će vas internet tendencije naterati na takav korak da bi ste u potpunosti iskoristili potencijal HTML 5 stranica.

HTML 5 u praksiNeke od mnogobrojnih primera primene HTML 5 standarda možete pronaći na adresi: http://ie.microsoft.com/testdrive

Početna stranica:

Internet Explorer 8:

Internet Explorer 9

Internet Explorer 10 (preview)

Početna strana se prikazuje podjednako dobro na IE 9 i IE 10, dok IE 8 prikazuje primere u dve kolone, umesto u 3.

Prvi primer "Let it Snow" prikazuje animaciju pahulja (može se birati broj pahulja koje provejavaju) koje pokrivaju centralnu tablu. Klikom miša na tablu se "sklanja" sneg. Ove animacije se ne mogu videti na IE 8, dok ih IE 9 i 10 dobro prikazuju

IE 8:

IE 9:

IE 10:

Sledeći primer je klavir "Blob Builder". U ovom primeru klikom miša na određene dirke na klaviru se proizvodi zvuk, a ispod se ispisuju note (note su u SVG formatu). Dodatna mogućnost je kasnija reprodukcija tih nota. IE8 ovaj primer uopšte ne može da prikaže, IE 9 omogućava sviranje klavira i pojavljivanje nota ali ne može da se reprodukuje "snimljena" melodija, dok IE 10 prikazuje kompletan primer: sviranje nota, stvaranje notnog zapisa i njegova reprodukcija.

IE 8:

IE 9:

IE 10:

HTML 5 Video Captions je primer u kome se tekst prikazuje preko video datoteke (u vidu titla), ovaj primer pravilno prikazuje samo IE 10, IE 9 pušta samo video (bez titlova) dok IE 8 ne prikazuje nikakav sadržaj.

IE 8:

Windows 8 web platform prikazuje kako se pomoću CSSa mogu primeniti razne transformacije na tekstu (translacija, rotacija, 3d i sl.). Svi efekti su vidljivi na IE 10, IE 9 prikazuje samo manji broj efekata dok IE 8 prikazuje samo najosnovnije efekte (pomeranje po vertikali i horizontali).

IE 8:

IE 9:

IE 10:

Spremni ili ne HTML 5 je stigaoHTML 5 je doneo mnogo novina u kreiranju HTML stranica, sada dizajneri imaju mnogo više mogućnosti za kreiranje prezentacija, programeri mogu da iskoriste bogate javascript biblioteke, hardverska akceleracija je omogućila izvršavanje i zahtevnih video animacija. Sve više sajtova koristi mogućnosti HTML 5 tandarda, pojavljuju se ažurirane verzije browsera, kako za desktop računare, tako i za mobilne uređaje, koji podržavaju sve veći broj standarda.

Šta čekate? Ažurirajte svoj browser i pogledajte u budućnost.

Web nikada nije bolje izgledao!

Korisne adreseIE 9: http://windows.microsoft.com/sr-Latn-CS/internet-explorer/products/ie/home

IE 10 i HTML 5 demoi: http://ie.microsoft.com/testdrive

Windows 8 Developer Preview: http://msdn.microsoft.com/en-us/windows/apps/br229516

O HTML 5, primeri i kodovi: http://www.html5rocks.com/en/

HTML 5 dokumentacija: http://www.w3.org/TR/html5/

YouTube kroz HTML 5: http://www.youtube.com/html5