Web savjeti (2) – Naučite HTML 5 na vrijeme

Ovo je drugi dio Web savjeta, logičan nastavak na prvi dio. U ovom dijelu savjetujem vam da naučite HTML 5 i da budete spremni kada on bude u upotrebi.

HTML 5 nije teško naučiti, treba se samo naviknuti na korištenje novih elemenata, što naučite za koji dan. No, uvijek je dobro biti spreman, pa krenimo.

Novi strukturni elementi

Trenutno vam je normalno da strukturirate sadržaj pomoću DIV elemenata kojima onda dajete klase i ID-e. Tako za header imate npr. <div id=”header”>. HTML 5 uvodi niz novih, semantičkih (iako bi se o ovome dalo još raspravljati) elemenata, koje ću vam sada predstaviti.

  • <header> Trebao bi se koristiti za bilo kakva zaglavlja, uključujući header dokumenta (logo, navigacija, pretraga).
  • <nav> Ovaj element treba koristiti za dijelove stranice sa navigacijskim linkovima. Obuhvaća glavnu navigaciju, te bilo koje druge linkove koji pomažu u navigaciji siteom (npr. breadcrumb).
  • <section> Ovo je element dosta sličan DIV-u. Koristi se za grupiranje dijela sadržaja na web stranici (npr. <section id=”related-content”>).
  • <aside> Ovaj element, iako tako djeluje na prvu, uopće nije namijenjen za sidebare, iako se može koristiti i za njih. On bi se trebao koristiti za bilo kakav dodatan sadržaj koji je povezan sa sadržajem koji okružuje.
  • <footer> Ovaj element koristi se footer stranice i podnožja članaka gdje se prikazuje tko je autor, tagovi članka, broj komentara, itd.

Video i audio

Video (<video>) i audio (<audio>) novi su elementi HTML-a koji omogućuju ubacivanje video i audio sadržaja bez posredovanja Flash playera. Mislim da ćemo podršku za njih najduže čekati jer se proizvođači browsera ne mogu dogovoriti oko standardnog formata koji će svi podržavati.

Spremni ste…

Eto, u ovom kratkom članku, koliko-toliko ste spremni za tehnologiju koje dolazi u slijedećih nekoliko godina. Naravno, sada znate elemente, a pravo korištenje tih elemenata shvatit ćete nakon što neko vrijeme provedete u novom HTML-u. Možda još uvijek ne možete takve siteove objaviti, ali probajte privatno, za sebe, prekodirati neki dizajn u HTML 5.

I da, još sam vam zaboravio spomenuti, DOCTYPE novog HTML-a jako je jednostavan i lako pamtljiv:

<!DOCTYPE html>

Uživajte…

7 Odgovora

  1. Pozdrav,
    Pogledao sam vas blog i ima jako dobrih i kvalitetnih clanaka, pa da li imamo dozvolu da stavimo vase clanke na nas portal datapodium.com (naravno sa naznacenom izvorisnom adresom
    na vas blog) ili jednostavno mozete i vi da ih napisete kao novi clanak. DataPodium.com je portal koji se bavi temama vezanim za informacione tehnologije i programiranje.

    Osnovna ideja portala je da centralizira IT informacije na jednom mjestu. DataPodium vam omogucuje da razmjenjujete IT sadrzaje koji su vec na Internetu u vidu clanaka ili da sami pišete nove clanke Imano sve vise posjetioca tako da ce i vasi clanci biti citani.

    Takodjer, mozete postaviti nas link na vasem blogu.

    PS. Nisam nasao Vas kontakt mail pa pisemo ovdje, mozete izbrisati ovaj komentar.

    Pozdrav i sve najbolje,

    Datapodium.com

  2. Moj hosting servis, bjelovarski WMD, ne zna podesiti automatski odgovor na e-mailu. Možete li mi pomoći da im pomognem. Prilično mi je bitan automatski odgovor a oni već nekoliko dana ne uspijevaju podesiti e-mail za tu opciju.

    Petar Grabovac
    Zagreb

  3. […] Web savjeti (2) – Naučite HTML 5 na vrijeme […]

  4. Znate li neku dobru knjigu za HTML 5 a da nije Dive Into HTML 5 ?
    Hvala unaprijed
    M

  5. Jako dobar članak, mada ga čitam sa solidnim zakašnjenjem :)

  6. Stvarno odličan članak, trenutno je budućnost u HTML5 web stranicama jer pružaju puno više mogućnosti za interakciju, što je meni veoma zanimljivo!

Odgovori

Popunite niže tražene podatke ili kliknite na neku od ikona za prijavu:

WordPress.com Logo

Ovaj komentar pišete koristeći vaš WordPress.com račun. Odjava / Izmijeni )

Twitter picture

Ovaj komentar pišete koristeći vaš Twitter račun. Odjava / Izmijeni )

Facebook slika

Ovaj komentar pišete koristeći vaš Facebook račun. Odjava / Izmijeni )

Google+ photo

Ovaj komentar pišete koristeći vaš Google+ račun. Odjava / Izmijeni )

Spajanje na %s

%d bloggers like this: